add example to reproduce defect of serializeQueryArgs with skipToken

packages/toolkit/src/query/core/buildSelectors.ts

@@ -168,6 +168,9 @@ export function buildSelectors<
     endpointDefinition: QueryDefinition<any, any, any, any>,
   ) {
     return ((queryArgs: any) => {
+      if (queryArgs === skipToken) {
+        return createSelector(selectSkippedQuery, withRequestFlags)
+      }
       const serializedArgs = serializeQueryArgs({
         queryArgs,
         endpointDefinition,
@@ -176,10 +179,8 @@ export function buildSelectors<
       const selectQuerySubstate = (state: RootState) =>
         selectInternalState(state)?.queries?.[serializedArgs] ??
         defaultQuerySubState
-      const finalSelectQuerySubState =
-        queryArgs === skipToken ? selectSkippedQuery : selectQuerySubstate
 
-      return createSelector(finalSelectQuerySubState, withRequestFlags)
+      return createSelector(selectQuerySubstate, withRequestFlags)
     }) as QueryResultSelectorFactory<any, RootState>
   }
 

packages/toolkit/src/query/tests/buildHooks.test.tsx

@@ -125,6 +125,12 @@ const api = createApi({
         return true
       },
     }),
+    queryWithDeepArg: build.query<string, { param: { nested: string } }>({
+      query: ({ param: { nested }}) => nested,
+      serializeQueryArgs: ({ queryArgs }) => {
+        return queryArgs.param.nested
+      }
+    }),
   }),
 })
 
@@ -667,6 +673,12 @@ describe('hooks tests', () => {
       await screen.findByText('ID: 3')
     })
 
+    test(`useQuery shouldn't call args serialization if request skipped`, async () => {
+      expect(() => renderHook(() => api.endpoints.queryWithDeepArg.useQuery(skipToken), {
+        wrapper: storeRef.wrapper,
+      })).not.toThrow()
+    })
+
     test(`useQuery gracefully handles bigint types`, async () => {
       function ItemList() {
         const [pageNumber, setPageNumber] = useState(0)