[bug] getToken is not a function in nuxt/vue

[divine]

Preliminary Checks

• I have reviewed the documentation: https://clerk.com/docs

• I have searched for existing issues: https://github.com/clerk/javascript/issues

• I have not already reached out to Clerk support via email or Discord (if you have, no need to open an issue here)

• This issue is not a question, general help request, or anything other than a bug report directly related to Clerk. Please ask questions in our Discord community: https://clerk.com/discord.

Reproduction

https://github.com/divine/clerk-nuxt-quickstart

Publishable key

not_related

Description

Steps to reproduce:

1. Fork reproduction url
2. Set publishable key and secret key in .env
3. npm install && npm run dev
4. Visit the dev site
5. Sign in
6. Click on fetch token button
7. See console error: Error fetching token: TypeError: getToken is not a function
8. Is this even tested?
   Expected behavior:

Should return: a promise that resolves to the token. * https://clerk.com/docs/hooks/use-auth#returns

async (options) => {
    const loadedClerk = await clerkLoaded(clerk);
    if (!loadedClerk.session) {
      return null;
    }
    return loadedClerk.session.getToken(options);
  }

Actual behavior:

Error fetching token: TypeError: getToken is not a function

Environment

not applicable

[wobsoriano]

Hello! All of the properties returned by the composables are Vue Refs. You can see useAuth()'s returned properties and their types here - https://clerk.com/docs/references/vue/use-auth#returns

So in your code here, it should be getToken.value(). We're doing this to keep the returned value of all the composables destructurable and reactive.

Thanks!

[divine]

Hello! All of the properties returned by the composables are Vue Refs. You can see useAuth()'s returned properties and their types here - https://clerk.com/docs/references/vue/use-auth#returns

So in your code here, it should be getToken.value(). We're doing this to keep the returned value of all the composables destructurable and reactive.

Thanks!

Okay, this works but documentation for Vue/Nuxt is definitely incomplete.

There are tons of examples for Next.js in Vue/Nuxt documentation - this should be definitely improved.

Thanks!

[wobsoriano]

Hello! All of the properties returned by the composables are Vue Refs. You can see useAuth()'s returned properties and their types here - https://clerk.com/docs/references/vue/use-auth#returns

So in your code here, it should be getToken.value(). We're doing this to keep the returned value of all the composables destructurable and reactive.

Thanks!

Okay, this works but documentation for Vue/Nuxt is definitely incomplete.

There are tons of examples for Next.js in Vue/Nuxt documentation - this should be definitely improved.

Thanks!

We appreciate the feedback and will definitely improve the Vue docs 🫡