TypeError: api.query.substrateKitties.countForKitties is not a function

Question

I'm following the Substrate Kitties tutorial, and I've run into some problems getting the front end working.

The backend node seems to be working just fine, but this code snippet for the front end:

// Subscription function for kitty count
const subscribeCount = () => {
  let unsub = null
  const asyncFetch = async () => {
    unsub = await api.query.substrateKitties.countForKitties(
      async count => {
        // Fetch all kitty keys
        const entries = await api.query.substrateKitties.kitties.entries()
        const ids = entries.map(entry => entry[1].unwrap().dna)
        setKittyIds(ids)
      }
    )
  }
  asyncFetch()
  return () => {
    unsub && unsub()
  }
}

throws an exception:

Kitties.js:26 Uncaught (in promise) TypeError: api.query.substrateKitties.countForKitties is not a function
    at asyncFetch (Kitties.js:26:1)
    at subscribeCount (Kitties.js:34:1)
    at invokePassiveEffectCreate (react-dom.development.js:23487:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
    at invokeGuardedCallback (react-dom.development.js:4056:1)
    at flushPassiveEffectsImpl (react-dom.development.js:23574:1)
    at unstable_runWithPriority (scheduler.development.js:468:1)
    at runWithPriority$1 (react-dom.development.js:11276:1)
    at flushPassiveEffects (react-dom.development.js:23447:1)

I first followed the tutorial carefully, and to ensure I didn't mess anything up, I cloned the backend and frontend repos and switched to the tutorials/solutions/kitties branch. Same error.

Is the front end code out of date?

Thanks for your help!

Answer 1

@Shawn is right. Unfortunately in the kitties tutorial part I, some snippets still use the deprecated kitty_cnt method (as below) to get the number of stored kitties. This last is probably why you are getting the error: Your Frontend is trying to reach a getter method that does not exists. However, the repos you described above are properly updated and both implement the right matching method: countForKitties.

#[pallet::storage]
#[pallet::getter(fn kitty_cnt)]
pub(super) type KittyCnt<T: Config> = StorageValue<_, u64, ValueQuery>;