Jest to vitest migration alpha #5097

ZackDeRose · 2023-03-08T10:35:32Z

Mostly a clone of #5081, but for the alpha branch (see discussion in that pr w/ @TkDodo)

Addresses #5074

vercel · 2023-03-08T10:35:40Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment

Name	Status	Preview	Comments	Updated
query	⬜️ Ignored (Inspect)			Mar 10, 2023 at 9:57AM (UTC)

codesandbox-ci · 2023-03-08T10:37:47Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit e9f3a1a:

Sandbox	Source
@tanstack/query-example-react-basic-typescript	Configuration
@tanstack/query-example-solid-basic-typescript	Configuration
@tanstack/query-example-svelte-basic	Configuration
@tanstack/query-example-vue-basic	Configuration

codecov-commenter · 2023-03-09T07:38:07Z

Codecov Report

Patch coverage: 100.00% and project coverage change: -2.01 ⚠️

Comparison is base (d2af584) 90.39% compared to head (e9f3a1a) 88.39%.

📣 This organization is not using Codecov’s GitHub App Integration. We recommend you install it so Codecov can continue to function properly for your repositories. Learn more

Additional details and impacted files

@@            Coverage Diff             @@
##            alpha    #5097      +/-   ##
==========================================
- Coverage   90.39%   88.39%   -2.01%     
==========================================
  Files         105       78      -27     
  Lines        3791     2877     -914     
  Branches      952      815     -137     
==========================================
- Hits         3427     2543     -884     
+ Misses        331      283      -48     
- Partials       33       51      +18

Impacted Files	Coverage Δ
packages/solid-query/src/createBaseQuery.ts	`68.35% <ø> (ø)`
packages/solid-query/src/createInfiniteQuery.ts	`100.00% <ø> (ø)`
packages/solid-query/src/createMutation.ts	`100.00% <ø> (ø)`
packages/solid-query/src/createQuery.ts	`100.00% <ø> (ø)`
packages/query-core/src/mutation.ts	`97.82% <100.00%> (-0.12%)`	⬇️
packages/query-core/src/mutationObserver.ts	`78.72% <100.00%> (-3.10%)`	⬇️
packages/query-core/src/tests/utils.ts	`85.71% <100.00%> (-4.61%)`	⬇️
packages/react-query/src/useQueries.ts	`93.61% <100.00%> (-0.93%)`	⬇️
packages/solid-query/src/createQueries.ts	`100.00% <100.00%> (ø)`
packages/solid-query/src/useIsFetching.ts	`100.00% <100.00%> (ø)`
... and 2 more

... and 74 files with indirect coverage changes

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

☔ View full report in Codecov by Sentry.
📢 Do you have feedback about the report comment? Let us know in this issue.

TkDodo

Thank you 🙏 ❤️ . Please have a look at my comments:

TkDodo · 2023-03-09T07:36:03Z

packages/query-async-storage-persister/src/__tests__/asyncThrottle.test.ts

    const handleError = (e: unknown) => {
      expect(e).toBe(err)
-      done()


how does vitest know to wait for this expectation to occur ?

I believe vitest will wait for any unresolved promises created by the test's callback closure to resolve before continuing. I affirmed this assumption by adding a false assertion (expect(true).toBe(false)) where the done() was and ensuring the test fails).

If we want we can make the test callback async and explicitely await a promise that will assert this assertion is called. e.g.:

test('"onError" should be called when "func" throw error', async () => { await new Promise((res) => { const err = new Error('error') const handleError = (e: unknown) => { expect(e).toBe(err) res() } const testFunc = asyncThrottle( () => { throw err }, { onError: handleError }, ) testFunc() }) })

This appears to be the recommended solution for the deprecated done parameter.

yeah that looks good 👍

packages/query-core/src/tests/query.test.tsx

TkDodo · 2023-03-09T07:41:05Z

packages/react-query/src/__tests__/useMutationState.test.tsx

+    // Should not display the console error
+    // "Warning: Can't perform a React state update on an unmounted component"


feel free to delete this whole test. this warning is no longer a thing in react18, so the test doesn't test anything

packages/react-query/src/__tests__/useQueries.test.tsx

packages/react-query/src/__tests__/useQuery.test.tsx

packages/solid-query/package.json

TkDodo · 2023-03-09T07:44:22Z

packages/vue-query/src/useBaseQuery.ts

-            resolve(observer.fetchOptimistic(defaultedOptions.value))
+            resolve(observer.fetchOptimistic(defaultedOptions.value) as any)
          } else {
            stopWatch()
-            resolve(optimisticResult)
+            resolve(optimisticResult as any)


@DamianOsipiuk FYI

TkDodo · 2023-03-09T07:44:50Z

packages/vue-query/tsconfig.json

@@ -4,10 +4,9 @@
    "composite": true,
    "rootDir": "./src",
    "outDir": "./build/lib",
-    "tsBuildInfoFile": "./build/.tsbuildinfo"
+    "tsBuildInfoFile": "./build/.tsbuildinfo",
+    "module": "esnext"


doesn't this change the output of the type definitions for the vue package?

@ZackDeRose Could you please explain why this change is necessary?

Hey folks - yes I needed top-level await for those mock files. The equivalent of jest's synchronous requireActual is vitest's async importActual. I'll revert this and see if I can fix those mocks some other way.

Looks like the error I was getting is only in the ts language server, so this is safe to revert. See comment in the mock file!

packages/vue-query/src/useBaseQuery.ts

DamianOsipiuk · 2023-03-09T18:41:36Z

packages/vue-query/src/__mocks__/useBaseQuery.ts


-export const useBaseQuery = jest.fn(originImpl)


If vi.mock automatically wraps all original implementations with spy functions, then we could remove it.
Jest used the __mock__ directory for mocking modules, without necessity to write the same mock in multiple files.

makes sense - thanks!

ZackDeRose · 2023-03-10T06:31:15Z

packages/vue-query/src/__mocks__/useBaseQuery.ts

+  // @ts-expect-error - vitest uses esmodules; tsconfig is not set to use them
+  (await vi.importActual('../useBaseQuery')) as any


After reverting my change to the tsconfig.json this error shows up in the IDE via the ts language service, but running pnpm test:ci passes just fine even with the error marked in the IDE.

I've added this // @ts-expect-error so we don't see this via the IDE, but lmk if there's a preferred fix I'm not aware of.

ZackDeRose · 2023-03-10T06:33:28Z

Setting sights on coverage reports now

ZackDeRose · 2023-03-10T06:44:59Z

let's see if that fixes coverage - confirming I see the reports generated now on my local filesystem

TkDodo · 2023-03-10T08:10:31Z

ran into an error:

packages/react-query test:lib: FATAL ERROR: v8::FromJust Maybe value is Nothing.
packages/react-query test:lib:  1: 0xb09980 node::Abort() [node]
packages/react-query test:lib:  2: 0xa1c235 node::FatalError(char const*, char const*) [node]
packages/react-query test:lib:  3: 0xcf758a v8::Utils::ReportApiFailure(char const*, char const*) [node]
packages/react-query test:lib:  4: 0xb0d7dd node::fs::FileHandle::CloseReq::Resolve() [node]

I've re-run to see if this was just flaky

TkDodo · 2023-03-10T08:21:28Z

hmm the error seems to persist :/

ZackDeRose · 2023-03-10T08:30:07Z

interesting - I'm getting passing pnpm test:ci locally :\

investigating now

ZackDeRose · 2023-03-10T09:55:59Z

Was able to reproduce this FATAL ERROR: v8::FromJust Maybe value is Nothing. error with node v16.4.2

I'll add a bump this in the ci files to 16.19 (most recent v16), I don't seem to get the error on that version of node, let me know if that acceptable or if we need to stay on this version

TkDodo · 2023-03-10T10:29:03Z

That's fine 👍

ZackDeRose added 2 commits March 7, 2023 19:12

eslint-lugin-query updated

b3e3771

migrating from jest to vitest

1738ff3

Merge branch 'alpha' into jest-to-vitest-migration-alpha

d8a13eb

ZackDeRose added 2 commits March 8, 2023 10:54

fixing error in ci pipeline

73fcf74

adding coverage

cd9397b

TkDodo reviewed Mar 9, 2023

View reviewed changes

DamianOsipiuk reviewed Mar 9, 2023

View reviewed changes

packages/vue-query/src/useBaseQuery.ts Show resolved Hide resolved

DamianOsipiuk reviewed Mar 9, 2023

View reviewed changes

ZackDeRose added 3 commits March 9, 2023 23:12

re-introduction vi.fn generics and addressing comments

e810d65

fixes from vi.fn generics second pass

41fe0a8

reverting vue-query tsconfig to not use esnext

8bd70bf

ZackDeRose commented Mar 10, 2023

View reviewed changes

fixing frozen lock file error

1e83276

adding coverage option on vitest command

036d7ba

ZackDeRose requested review from TkDodo and DamianOsipiuk and removed request for TkDodo and DamianOsipiuk March 10, 2023 06:53

TkDodo approved these changes Mar 10, 2023

View reviewed changes

ZackDeRose and others added 2 commits March 10, 2023 01:31

Merge branch 'alpha' into jest-to-vitest-migration-alpha

257d7b2

resetting bad merge from alpha

3ba3844

bumping node version in CI

e9f3a1a

DamianOsipiuk approved these changes Mar 10, 2023

View reviewed changes

TkDodo merged commit 4aaaa51 into TanStack:alpha Mar 10, 2023

This was referenced Mar 10, 2023

Jest to vitest migration #5081

Closed

vitest jest migration cleanup #5117

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Jest to vitest migration alpha #5097

Jest to vitest migration alpha #5097

ZackDeRose commented Mar 8, 2023

vercel bot commented Mar 8, 2023 •

edited

Loading

codesandbox-ci bot commented Mar 8, 2023 •

edited

Loading

codecov-commenter commented Mar 9, 2023 •

edited

Loading

TkDodo left a comment

TkDodo Mar 9, 2023

ZackDeRose Mar 10, 2023 •

edited

Loading

TkDodo Mar 10, 2023

TkDodo Mar 9, 2023

ZackDeRose Mar 10, 2023

TkDodo Mar 9, 2023

TkDodo Mar 9, 2023

DamianOsipiuk Mar 9, 2023

ZackDeRose Mar 10, 2023

ZackDeRose Mar 10, 2023

DamianOsipiuk Mar 9, 2023

ZackDeRose Mar 10, 2023

ZackDeRose Mar 10, 2023

ZackDeRose commented Mar 10, 2023

ZackDeRose commented Mar 10, 2023

TkDodo commented Mar 10, 2023

TkDodo commented Mar 10, 2023

ZackDeRose commented Mar 10, 2023

ZackDeRose commented Mar 10, 2023

TkDodo commented Mar 10, 2023

		// Should not display the console error
		// "Warning: Can't perform a React state update on an unmounted component"

		// @ts-expect-error - vitest uses esmodules; tsconfig is not set to use them
		(await vi.importActual('../useBaseQuery')) as any

Jest to vitest migration alpha #5097

Jest to vitest migration alpha #5097

Conversation

ZackDeRose commented Mar 8, 2023

vercel bot commented Mar 8, 2023 • edited Loading

codesandbox-ci bot commented Mar 8, 2023 • edited Loading

codecov-commenter commented Mar 9, 2023 • edited Loading

Codecov Report

TkDodo left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ZackDeRose Mar 10, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ZackDeRose commented Mar 10, 2023

ZackDeRose commented Mar 10, 2023

TkDodo commented Mar 10, 2023

TkDodo commented Mar 10, 2023

ZackDeRose commented Mar 10, 2023

ZackDeRose commented Mar 10, 2023

TkDodo commented Mar 10, 2023

vercel bot commented Mar 8, 2023 •

edited

Loading

codesandbox-ci bot commented Mar 8, 2023 •

edited

Loading

codecov-commenter commented Mar 9, 2023 •

edited

Loading

ZackDeRose Mar 10, 2023 •

edited

Loading