Getters in query keys don't work with axiosInstance

[razvantimis]

Describe the bug

In #7608 was introduce a issue regarding the getters, if you are add a axios instance in the query keys array, because AxiosInstance has get method on the object, it will be call

Your minimal, reproducible example

https://codesandbox.io/p/devbox/new-bird-jjl3dl?workspaceId=e1ee8762-c2c2-4cb0-afda-b50967dd69c3

Steps to reproduce

const {
  isLoading,
  data,
} = useQuery<User[], AxiosError>({
  queryKey: ['users',  axiosInstance],
  queryFn: async ({ signal, queryKey }) => {
    const [, axios] = queryKey as [string, AxiosInstance];
    console.log(axios); // this will be a Promise because we called get method on axios object
    return getUsersApi(axios, accountId, signal);
  },
});

Expected behavior

I think we should have a way to check if its ok to call "get" or not

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

Don't matter

Tanstack Query adapter

vue-query

TanStack Query version

5.51.15

TypeScript version

5.5.3

Additional context

No response

[TkDodo]

@DamianOsipiuk FYI

[DamianOsipiuk]

I do not think you should pass axiosInstance trough queryKey as its not serializable.
Use meta for that which can hold arbitrary data.

https://tanstack.com/query/latest/docs/framework/vue/guides/query-functions#queryfunctioncontext

[TkDodo]

agree with @DamianOsipiuk. not really sure what you are trying to achieve as you are importing axios, thus you can just use it directly in the queryFn. In any case, the queryKey isn't the right place for this.