@shopify/ui-extensions-server-kit 5.4.0 → 5.4.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/README.md +1 -1
- package/dist/ExtensionServerClient/ExtensionServerClient.d.ts +3 -5
- package/dist/ExtensionServerClient/server-types.d.ts +31 -7
- package/dist/_virtual/jsx-runtime.cjs.js +1 -0
- package/dist/_virtual/jsx-runtime.cjs2.js +1 -0
- package/dist/_virtual/jsx-runtime.es.js +5 -0
- package/dist/_virtual/jsx-runtime.es2.js +4 -0
- package/dist/_virtual/react-jsx-runtime.development.cjs.js +1 -0
- package/dist/_virtual/react-jsx-runtime.development.es.js +4 -0
- package/dist/_virtual/react-jsx-runtime.production.min.cjs.js +1 -0
- package/dist/_virtual/react-jsx-runtime.production.min.es.js +4 -0
- package/dist/i18n.d.ts +2 -8
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs2.js +1 -1
- package/dist/index.es.js +18 -18
- package/dist/index.es2.js +3 -3
- package/dist/node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react-jsx-runtime.development.cjs.js +22 -0
- package/dist/node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react-jsx-runtime.development.es.js +604 -0
- package/dist/node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react-jsx-runtime.production.min.cjs.js +9 -0
- package/dist/node_modules/.pnpm/react@18.3.1/node_modules/react/cjs/react-jsx-runtime.production.min.es.js +28 -0
- package/dist/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.cjs.js +1 -0
- package/dist/node_modules/.pnpm/react@18.3.1/node_modules/react/jsx-runtime.es.js +10 -0
- package/dist/packages/ui-extensions-server-kit/src/ExtensionServerClient/ExtensionServerClient.cjs.js +1 -0
- package/dist/{ExtensionServerClient → packages/ui-extensions-server-kit/src/ExtensionServerClient}/ExtensionServerClient.es.js +21 -18
- package/dist/packages/ui-extensions-server-kit/src/context/ExtensionServerProvider.cjs.js +1 -0
- package/dist/packages/ui-extensions-server-kit/src/context/ExtensionServerProvider.es.js +30 -0
- package/dist/{context → packages/ui-extensions-server-kit/src/context}/constants.cjs.js +1 -1
- package/dist/packages/ui-extensions-server-kit/src/hooks/useExtensionServerContext.cjs.js +1 -0
- package/dist/{hooks → packages/ui-extensions-server-kit/src/hooks}/useExtensionServerContext.es.js +3 -2
- package/dist/packages/ui-extensions-server-kit/src/testing/MockExtensionServerProvider.cjs.js +1 -0
- package/dist/packages/ui-extensions-server-kit/src/testing/MockExtensionServerProvider.es.js +25 -0
- package/dist/packages/ui-extensions-server-kit/src/utilities/isUIExtension.cjs.js +1 -0
- package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/isUIExtension.es.js +3 -2
- package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/isValidSurface.cjs.js +1 -1
- package/dist/packages/ui-extensions-server-kit/src/utilities/isValidSurface.es.js +7 -0
- package/dist/types.d.ts +11 -8
- package/dist/utilities/isUIExtension.d.ts +1 -1
- package/dist/utilities/isValidSurface.d.ts +1 -1
- package/dist/utilities/set.d.ts +1 -1
- package/node_modules/{@shopify/react-testing/LICENSE.md → @testing-library/react/LICENSE} +2 -3
- package/node_modules/@testing-library/react/README.md +692 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.cjs.js +537 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.esm.js +497 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.pure.cjs.js +501 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.pure.esm.js +461 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.pure.umd.js +502 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.pure.umd.js.map +1 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.pure.umd.min.js +2 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.pure.umd.min.js.map +1 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.umd.js +538 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.umd.js.map +1 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.umd.min.js +2 -0
- package/node_modules/@testing-library/react/dist/@testing-library/react.umd.min.js.map +1 -0
- package/node_modules/@testing-library/react/dist/act-compat.js +80 -0
- package/node_modules/@testing-library/react/dist/config.js +33 -0
- package/node_modules/@testing-library/react/dist/fire-event.js +70 -0
- package/node_modules/@testing-library/react/dist/index.js +52 -0
- package/node_modules/@testing-library/react/dist/pure.js +356 -0
- package/node_modules/@testing-library/react/dont-cleanup-after-each.js +1 -0
- package/node_modules/@testing-library/react/package.json +116 -0
- package/node_modules/@testing-library/react/pure.d.ts +1 -0
- package/node_modules/@testing-library/react/pure.js +2 -0
- package/node_modules/@testing-library/react/types/index.d.ts +287 -0
- package/node_modules/@testing-library/react/types/pure.d.ts +1 -0
- package/node_modules/@vitejs/plugin-react/README.md +159 -0
- package/node_modules/@vitejs/plugin-react/dist/index.d.ts +75 -0
- package/node_modules/@vitejs/plugin-react/dist/index.js +401 -0
- package/node_modules/@vitejs/plugin-react/dist/refresh-runtime.js +663 -0
- package/node_modules/@vitejs/plugin-react/package.json +77 -0
- package/node_modules/@vitejs/plugin-react/types/preamble.d.ts +1 -0
- package/package.json +8 -9
- package/project.json +1 -1
- package/src/ExtensionServerClient/ExtensionServerClient.test.ts +6 -5
- package/src/ExtensionServerClient/ExtensionServerClient.ts +27 -19
- package/src/ExtensionServerClient/server-types.ts +17 -7
- package/src/ExtensionServerClient/types.ts +0 -2
- package/src/context/ExtensionServerProvider.test.tsx +55 -73
- package/src/context/ExtensionServerProvider.tsx +1 -0
- package/src/i18n.ts +2 -5
- package/src/state/reducers/extensionServerReducer.test.ts +2 -2
- package/src/types.ts +11 -6
- package/src/utilities/assetToString.ts +0 -1
- package/src/utilities/isUIExtension.ts +5 -4
- package/src/utilities/isValidSurface.ts +2 -3
- package/src/utilities/replaceUpdated.ts +0 -2
- package/src/utilities/set.ts +10 -5
- package/tests/setup.ts +1 -4
- package/vite.config.mts +57 -0
- package/dist/ExtensionServerClient/ExtensionServerClient.cjs.js +0 -1
- package/dist/context/ExtensionServerProvider.cjs.js +0 -1
- package/dist/context/ExtensionServerProvider.es.js +0 -29
- package/dist/hooks/useExtensionServerContext.cjs.js +0 -1
- package/dist/testing/MockExtensionServerProvider.cjs.js +0 -1
- package/dist/testing/MockExtensionServerProvider.es.js +0 -24
- package/dist/utilities/isUIExtension.cjs.js +0 -1
- package/dist/utilities/isValidSurface.es.js +0 -7
- package/node_modules/@shopify/react-testing/README.md +0 -711
- package/node_modules/@shopify/react-testing/build/cjs/TestWrapper.js +0 -52
- package/node_modules/@shopify/react-testing/build/cjs/_virtual/_rollupPluginBabelHelpers.js +0 -47
- package/node_modules/@shopify/react-testing/build/cjs/compat.js +0 -14
- package/node_modules/@shopify/react-testing/build/cjs/destroy.js +0 -13
- package/node_modules/@shopify/react-testing/build/cjs/element.js +0 -225
- package/node_modules/@shopify/react-testing/build/cjs/index.js +0 -21
- package/node_modules/@shopify/react-testing/build/cjs/matchers/components.js +0 -46
- package/node_modules/@shopify/react-testing/build/cjs/matchers/context.js +0 -25
- package/node_modules/@shopify/react-testing/build/cjs/matchers/index.js +0 -16
- package/node_modules/@shopify/react-testing/build/cjs/matchers/props.js +0 -38
- package/node_modules/@shopify/react-testing/build/cjs/matchers/strings.js +0 -42
- package/node_modules/@shopify/react-testing/build/cjs/matchers/utilities.js +0 -110
- package/node_modules/@shopify/react-testing/build/cjs/mount.js +0 -76
- package/node_modules/@shopify/react-testing/build/cjs/root.js +0 -284
- package/node_modules/@shopify/react-testing/build/cjs/toReactString.js +0 -86
- package/node_modules/@shopify/react-testing/build/cjs/types.js +0 -28
- package/node_modules/@shopify/react-testing/build/esm/TestWrapper.mjs +0 -44
- package/node_modules/@shopify/react-testing/build/esm/_virtual/_rollupPluginBabelHelpers.mjs +0 -42
- package/node_modules/@shopify/react-testing/build/esm/compat.mjs +0 -10
- package/node_modules/@shopify/react-testing/build/esm/destroy.mjs +0 -9
- package/node_modules/@shopify/react-testing/build/esm/element.mjs +0 -221
- package/node_modules/@shopify/react-testing/build/esm/index.mjs +0 -5
- package/node_modules/@shopify/react-testing/build/esm/matchers/components.mjs +0 -41
- package/node_modules/@shopify/react-testing/build/esm/matchers/context.mjs +0 -21
- package/node_modules/@shopify/react-testing/build/esm/matchers/index.mjs +0 -14
- package/node_modules/@shopify/react-testing/build/esm/matchers/props.mjs +0 -33
- package/node_modules/@shopify/react-testing/build/esm/matchers/strings.mjs +0 -37
- package/node_modules/@shopify/react-testing/build/esm/matchers/utilities.mjs +0 -101
- package/node_modules/@shopify/react-testing/build/esm/mount.mjs +0 -70
- package/node_modules/@shopify/react-testing/build/esm/root.mjs +0 -275
- package/node_modules/@shopify/react-testing/build/esm/toReactString.mjs +0 -80
- package/node_modules/@shopify/react-testing/build/esm/types.mjs +0 -26
- package/node_modules/@shopify/react-testing/build/esnext/TestWrapper.esnext +0 -44
- package/node_modules/@shopify/react-testing/build/esnext/compat.esnext +0 -10
- package/node_modules/@shopify/react-testing/build/esnext/destroy.esnext +0 -9
- package/node_modules/@shopify/react-testing/build/esnext/element.esnext +0 -221
- package/node_modules/@shopify/react-testing/build/esnext/index.esnext +0 -5
- package/node_modules/@shopify/react-testing/build/esnext/matchers/components.esnext +0 -41
- package/node_modules/@shopify/react-testing/build/esnext/matchers/context.esnext +0 -21
- package/node_modules/@shopify/react-testing/build/esnext/matchers/index.esnext +0 -14
- package/node_modules/@shopify/react-testing/build/esnext/matchers/props.esnext +0 -33
- package/node_modules/@shopify/react-testing/build/esnext/matchers/strings.esnext +0 -37
- package/node_modules/@shopify/react-testing/build/esnext/matchers/utilities.esnext +0 -99
- package/node_modules/@shopify/react-testing/build/esnext/mount.esnext +0 -71
- package/node_modules/@shopify/react-testing/build/esnext/root.esnext +0 -275
- package/node_modules/@shopify/react-testing/build/esnext/toReactString.esnext +0 -80
- package/node_modules/@shopify/react-testing/build/esnext/types.esnext +0 -26
- package/node_modules/@shopify/react-testing/build/ts/TestWrapper.d.ts +0 -17
- package/node_modules/@shopify/react-testing/build/ts/TestWrapper.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/compat.d.ts +0 -3
- package/node_modules/@shopify/react-testing/build/ts/compat.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/destroy.d.ts +0 -2
- package/node_modules/@shopify/react-testing/build/ts/destroy.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/element.d.ts +0 -42
- package/node_modules/@shopify/react-testing/build/ts/element.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/index.d.ts +0 -7
- package/node_modules/@shopify/react-testing/build/ts/index.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/matchers/components.d.ts +0 -12
- package/node_modules/@shopify/react-testing/build/ts/matchers/components.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/matchers/context.d.ts +0 -8
- package/node_modules/@shopify/react-testing/build/ts/matchers/context.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/matchers/index.d.ts +0 -20
- package/node_modules/@shopify/react-testing/build/ts/matchers/index.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/matchers/props.d.ts +0 -10
- package/node_modules/@shopify/react-testing/build/ts/matchers/props.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/matchers/strings.d.ts +0 -11
- package/node_modules/@shopify/react-testing/build/ts/matchers/strings.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/matchers/utilities.d.ts +0 -17
- package/node_modules/@shopify/react-testing/build/ts/matchers/utilities.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/mount.d.ts +0 -39
- package/node_modules/@shopify/react-testing/build/ts/mount.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/root.d.ts +0 -55
- package/node_modules/@shopify/react-testing/build/ts/root.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/toReactString.d.ts +0 -5
- package/node_modules/@shopify/react-testing/build/ts/toReactString.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/build/ts/types.d.ts +0 -89
- package/node_modules/@shopify/react-testing/build/ts/types.d.ts.map +0 -1
- package/node_modules/@shopify/react-testing/index.esnext +0 -1
- package/node_modules/@shopify/react-testing/index.js +0 -1
- package/node_modules/@shopify/react-testing/index.mjs +0 -1
- package/node_modules/@shopify/react-testing/matchers.esnext +0 -1
- package/node_modules/@shopify/react-testing/matchers.js +0 -1
- package/node_modules/@shopify/react-testing/matchers.mjs +0 -1
- package/node_modules/@shopify/react-testing/package.json +0 -69
- package/node_modules/@shopify/ui-extensions-test-utils/CHANGELOG.md +0 -66
- package/node_modules/@shopify/ui-extensions-test-utils/dist/index.d.ts +0 -3
- package/node_modules/@shopify/ui-extensions-test-utils/dist/index.js +0 -3
- package/node_modules/@shopify/ui-extensions-test-utils/dist/render.d.ts +0 -2
- package/node_modules/@shopify/ui-extensions-test-utils/dist/render.js +0 -5
- package/node_modules/@shopify/ui-extensions-test-utils/dist/renderHook.d.ts +0 -17
- package/node_modules/@shopify/ui-extensions-test-utils/dist/renderHook.js +0 -20
- package/node_modules/@shopify/ui-extensions-test-utils/dist/withProviders.d.ts +0 -9
- package/node_modules/@shopify/ui-extensions-test-utils/dist/withProviders.js +0 -7
- package/node_modules/@shopify/ui-extensions-test-utils/package.json +0 -40
- package/node_modules/@shopify/ui-extensions-test-utils/project.json +0 -39
- package/node_modules/@vitejs/plugin-react-refresh/README.md +0 -73
- package/node_modules/@vitejs/plugin-react-refresh/index.d.ts +0 -14
- package/node_modules/@vitejs/plugin-react-refresh/index.js +0 -239
- package/node_modules/@vitejs/plugin-react-refresh/package.json +0 -35
- /package/dist/{ExtensionServerClient → packages/ui-extensions-server-kit/src/ExtensionServerClient}/types.cjs.js +0 -0
- /package/dist/{ExtensionServerClient → packages/ui-extensions-server-kit/src/ExtensionServerClient}/types.es.js +0 -0
- /package/dist/{context → packages/ui-extensions-server-kit/src/context}/constants.es.js +0 -0
- /package/dist/{hooks → packages/ui-extensions-server-kit/src/hooks}/useExtensionServerState.cjs.js +0 -0
- /package/dist/{hooks → packages/ui-extensions-server-kit/src/hooks}/useExtensionServerState.es.js +0 -0
- /package/dist/{hooks → packages/ui-extensions-server-kit/src/hooks}/useIsomorphicLayoutEffect.cjs.js +0 -0
- /package/dist/{hooks → packages/ui-extensions-server-kit/src/hooks}/useIsomorphicLayoutEffect.es.js +0 -0
- /package/dist/{i18n.cjs.js → packages/ui-extensions-server-kit/src/i18n.cjs.js} +0 -0
- /package/dist/{i18n.es.js → packages/ui-extensions-server-kit/src/i18n.es.js} +0 -0
- /package/dist/{state → packages/ui-extensions-server-kit/src/state}/actions/actions.cjs.js +0 -0
- /package/dist/{state → packages/ui-extensions-server-kit/src/state}/actions/actions.es.js +0 -0
- /package/dist/{state → packages/ui-extensions-server-kit/src/state}/reducers/constants.cjs.js +0 -0
- /package/dist/{state → packages/ui-extensions-server-kit/src/state}/reducers/constants.es.js +0 -0
- /package/dist/{state → packages/ui-extensions-server-kit/src/state}/reducers/extensionServerReducer.cjs.js +0 -0
- /package/dist/{state → packages/ui-extensions-server-kit/src/state}/reducers/extensionServerReducer.es.js +0 -0
- /package/dist/{testing → packages/ui-extensions-server-kit/src/testing}/app.cjs.js +0 -0
- /package/dist/{testing → packages/ui-extensions-server-kit/src/testing}/app.es.js +0 -0
- /package/dist/{testing → packages/ui-extensions-server-kit/src/testing}/extensions.cjs.js +0 -0
- /package/dist/{testing → packages/ui-extensions-server-kit/src/testing}/extensions.es.js +0 -0
- /package/dist/{types.cjs.js → packages/ui-extensions-server-kit/src/types.cjs.js} +0 -0
- /package/dist/{types.es.js → packages/ui-extensions-server-kit/src/types.es.js} +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/assetToString.cjs.js +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/assetToString.es.js +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/noop.cjs.js +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/noop.es.js +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/replaceUpdated.cjs.js +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/replaceUpdated.es.js +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/set.cjs.js +0 -0
- /package/dist/{utilities → packages/ui-extensions-server-kit/src/utilities}/set.es.js +0 -0
- /package/node_modules/@vitejs/{plugin-react-refresh → plugin-react}/LICENSE +0 -0
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@testing-library/react",
|
|
3
|
+
"version": "16.3.2",
|
|
4
|
+
"description": "Simple and complete React DOM testing utilities that encourage good testing practices.",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"types": "types/index.d.ts",
|
|
7
|
+
"module": "dist/@testing-library/react.esm.js",
|
|
8
|
+
"engines": {
|
|
9
|
+
"node": ">=18"
|
|
10
|
+
},
|
|
11
|
+
"scripts": {
|
|
12
|
+
"prebuild": "rimraf dist",
|
|
13
|
+
"build": "npm-run-all --parallel build:main build:bundle:main build:bundle:pure",
|
|
14
|
+
"build:bundle:main": "dotenv -e .bundle.main.env kcd-scripts build -- --bundle --no-clean --no-ts-defs",
|
|
15
|
+
"build:bundle:pure": "dotenv -e .bundle.main.env -e .bundle.pure.env kcd-scripts build -- --bundle --no-clean --no-ts-defs",
|
|
16
|
+
"build:main": "kcd-scripts build --no-clean --no-ts-defs",
|
|
17
|
+
"format": "kcd-scripts format",
|
|
18
|
+
"install:csb": "npm install",
|
|
19
|
+
"lint": "kcd-scripts lint",
|
|
20
|
+
"setup": "npm install && npm run validate -s",
|
|
21
|
+
"test": "kcd-scripts test",
|
|
22
|
+
"test:update": "npm test -- --updateSnapshot --coverage",
|
|
23
|
+
"typecheck": "tsc --project tsconfig.json",
|
|
24
|
+
"validate": "kcd-scripts validate"
|
|
25
|
+
},
|
|
26
|
+
"files": [
|
|
27
|
+
"dist",
|
|
28
|
+
"dont-cleanup-after-each.js",
|
|
29
|
+
"pure.js",
|
|
30
|
+
"pure.d.ts",
|
|
31
|
+
"types/*.d.ts"
|
|
32
|
+
],
|
|
33
|
+
"keywords": [
|
|
34
|
+
"testing",
|
|
35
|
+
"react",
|
|
36
|
+
"ui",
|
|
37
|
+
"dom",
|
|
38
|
+
"jsdom",
|
|
39
|
+
"unit",
|
|
40
|
+
"integration",
|
|
41
|
+
"functional",
|
|
42
|
+
"end-to-end",
|
|
43
|
+
"e2e"
|
|
44
|
+
],
|
|
45
|
+
"author": "Kent C. Dodds <me@kentcdodds.com> (https://kentcdodds.com)",
|
|
46
|
+
"license": "MIT",
|
|
47
|
+
"dependencies": {
|
|
48
|
+
"@babel/runtime": "^7.12.5"
|
|
49
|
+
},
|
|
50
|
+
"devDependencies": {
|
|
51
|
+
"@testing-library/dom": "^10.0.0",
|
|
52
|
+
"@testing-library/jest-dom": "^5.11.6",
|
|
53
|
+
"@types/react": "^19.0.0",
|
|
54
|
+
"@types/react-dom": "^19.0.0",
|
|
55
|
+
"chalk": "^4.1.2",
|
|
56
|
+
"dotenv-cli": "^4.0.0",
|
|
57
|
+
"jest-diff": "^29.7.0",
|
|
58
|
+
"kcd-scripts": "^13.0.0",
|
|
59
|
+
"npm-run-all2": "^6.2.6",
|
|
60
|
+
"react": "^19.0.0",
|
|
61
|
+
"react-dom": "^19.0.0",
|
|
62
|
+
"rimraf": "^3.0.2",
|
|
63
|
+
"typescript": "^5.9.3"
|
|
64
|
+
},
|
|
65
|
+
"peerDependencies": {
|
|
66
|
+
"@testing-library/dom": "^10.0.0",
|
|
67
|
+
"@types/react": "^18.0.0 || ^19.0.0",
|
|
68
|
+
"@types/react-dom": "^18.0.0 || ^19.0.0",
|
|
69
|
+
"react": "^18.0.0 || ^19.0.0",
|
|
70
|
+
"react-dom": "^18.0.0 || ^19.0.0"
|
|
71
|
+
},
|
|
72
|
+
"peerDependenciesMeta": {
|
|
73
|
+
"@types/react": {
|
|
74
|
+
"optional": true
|
|
75
|
+
},
|
|
76
|
+
"@types/react-dom": {
|
|
77
|
+
"optional": true
|
|
78
|
+
}
|
|
79
|
+
},
|
|
80
|
+
"eslintConfig": {
|
|
81
|
+
"extends": "./node_modules/kcd-scripts/eslint.js",
|
|
82
|
+
"parserOptions": {
|
|
83
|
+
"ecmaVersion": 2022
|
|
84
|
+
},
|
|
85
|
+
"globals": {
|
|
86
|
+
"globalThis": "readonly"
|
|
87
|
+
},
|
|
88
|
+
"rules": {
|
|
89
|
+
"react/prop-types": "off",
|
|
90
|
+
"react/no-adjacent-inline-elements": "off",
|
|
91
|
+
"import/no-unassigned-import": "off",
|
|
92
|
+
"import/named": "off",
|
|
93
|
+
"testing-library/no-container": "off",
|
|
94
|
+
"testing-library/no-debugging-utils": "off",
|
|
95
|
+
"testing-library/no-dom-import": "off",
|
|
96
|
+
"testing-library/no-unnecessary-act": "off",
|
|
97
|
+
"testing-library/prefer-explicit-assert": "off",
|
|
98
|
+
"testing-library/prefer-find-by": "off",
|
|
99
|
+
"testing-library/prefer-user-event": "off"
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
"eslintIgnore": [
|
|
103
|
+
"node_modules",
|
|
104
|
+
"coverage",
|
|
105
|
+
"dist",
|
|
106
|
+
"*.d.ts"
|
|
107
|
+
],
|
|
108
|
+
"repository": {
|
|
109
|
+
"type": "git",
|
|
110
|
+
"url": "https://github.com/testing-library/react-testing-library"
|
|
111
|
+
},
|
|
112
|
+
"bugs": {
|
|
113
|
+
"url": "https://github.com/testing-library/react-testing-library/issues"
|
|
114
|
+
},
|
|
115
|
+
"homepage": "https://github.com/testing-library/react-testing-library#readme"
|
|
116
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './types/pure'
|
|
@@ -0,0 +1,287 @@
|
|
|
1
|
+
// TypeScript Version: 3.8
|
|
2
|
+
import * as ReactDOMClient from 'react-dom/client'
|
|
3
|
+
import {
|
|
4
|
+
queries,
|
|
5
|
+
Queries,
|
|
6
|
+
BoundFunction,
|
|
7
|
+
prettyFormat,
|
|
8
|
+
Config as ConfigDTL,
|
|
9
|
+
} from '@testing-library/dom'
|
|
10
|
+
import {act as reactDeprecatedAct} from 'react-dom/test-utils'
|
|
11
|
+
//@ts-ignore
|
|
12
|
+
import {act as reactAct} from 'react'
|
|
13
|
+
|
|
14
|
+
export * from '@testing-library/dom'
|
|
15
|
+
|
|
16
|
+
export interface Config extends ConfigDTL {
|
|
17
|
+
reactStrictMode: boolean
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
export interface ConfigFn {
|
|
21
|
+
(existingConfig: Config): Partial<Config>
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
export function configure(configDelta: ConfigFn | Partial<Config>): void
|
|
25
|
+
|
|
26
|
+
export function getConfig(): Config
|
|
27
|
+
|
|
28
|
+
export type RenderResult<
|
|
29
|
+
Q extends Queries = typeof queries,
|
|
30
|
+
Container extends RendererableContainer | HydrateableContainer = HTMLElement,
|
|
31
|
+
BaseElement extends RendererableContainer | HydrateableContainer = Container,
|
|
32
|
+
> = {
|
|
33
|
+
container: Container
|
|
34
|
+
baseElement: BaseElement
|
|
35
|
+
debug: (
|
|
36
|
+
baseElement?:
|
|
37
|
+
| RendererableContainer
|
|
38
|
+
| HydrateableContainer
|
|
39
|
+
| Array<RendererableContainer | HydrateableContainer>
|
|
40
|
+
| undefined,
|
|
41
|
+
maxLength?: number | undefined,
|
|
42
|
+
options?: prettyFormat.OptionsReceived | undefined,
|
|
43
|
+
) => void
|
|
44
|
+
rerender: (ui: React.ReactNode) => void
|
|
45
|
+
unmount: () => void
|
|
46
|
+
asFragment: () => DocumentFragment
|
|
47
|
+
} & {[P in keyof Q]: BoundFunction<Q[P]>}
|
|
48
|
+
|
|
49
|
+
/** @deprecated */
|
|
50
|
+
export type BaseRenderOptions<
|
|
51
|
+
Q extends Queries,
|
|
52
|
+
Container extends RendererableContainer | HydrateableContainer,
|
|
53
|
+
BaseElement extends RendererableContainer | HydrateableContainer,
|
|
54
|
+
> = RenderOptions<Q, Container, BaseElement>
|
|
55
|
+
|
|
56
|
+
type RendererableContainer = ReactDOMClient.Container
|
|
57
|
+
type HydrateableContainer = Parameters<typeof ReactDOMClient['hydrateRoot']>[0]
|
|
58
|
+
/** @deprecated */
|
|
59
|
+
export interface ClientRenderOptions<
|
|
60
|
+
Q extends Queries,
|
|
61
|
+
Container extends RendererableContainer,
|
|
62
|
+
BaseElement extends RendererableContainer = Container,
|
|
63
|
+
> extends BaseRenderOptions<Q, Container, BaseElement> {
|
|
64
|
+
/**
|
|
65
|
+
* If `hydrate` is set to `true`, then it will render with `ReactDOM.hydrate`. This may be useful if you are using server-side
|
|
66
|
+
* rendering and use ReactDOM.hydrate to mount your components.
|
|
67
|
+
*
|
|
68
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#hydrate)
|
|
69
|
+
*/
|
|
70
|
+
hydrate?: false | undefined
|
|
71
|
+
}
|
|
72
|
+
/** @deprecated */
|
|
73
|
+
export interface HydrateOptions<
|
|
74
|
+
Q extends Queries,
|
|
75
|
+
Container extends HydrateableContainer,
|
|
76
|
+
BaseElement extends HydrateableContainer = Container,
|
|
77
|
+
> extends BaseRenderOptions<Q, Container, BaseElement> {
|
|
78
|
+
/**
|
|
79
|
+
* If `hydrate` is set to `true`, then it will render with `ReactDOM.hydrate`. This may be useful if you are using server-side
|
|
80
|
+
* rendering and use ReactDOM.hydrate to mount your components.
|
|
81
|
+
*
|
|
82
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#hydrate)
|
|
83
|
+
*/
|
|
84
|
+
hydrate: true
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
export interface RenderOptions<
|
|
88
|
+
Q extends Queries = typeof queries,
|
|
89
|
+
Container extends RendererableContainer | HydrateableContainer = HTMLElement,
|
|
90
|
+
BaseElement extends RendererableContainer | HydrateableContainer = Container,
|
|
91
|
+
> {
|
|
92
|
+
/**
|
|
93
|
+
* By default, React Testing Library will create a div and append that div to the document.body. Your React component will be rendered in the created div. If you provide your own HTMLElement container via this option,
|
|
94
|
+
* it will not be appended to the document.body automatically.
|
|
95
|
+
*
|
|
96
|
+
* For example: If you are unit testing a `<tbody>` element, it cannot be a child of a div. In this case, you can
|
|
97
|
+
* specify a table as the render container.
|
|
98
|
+
*
|
|
99
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#container
|
|
100
|
+
*/
|
|
101
|
+
container?: Container | undefined
|
|
102
|
+
/**
|
|
103
|
+
* Defaults to the container if the container is specified. Otherwise `document.body` is used for the default. This is used as
|
|
104
|
+
* the base element for the queries as well as what is printed when you use `debug()`.
|
|
105
|
+
*
|
|
106
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#baseelement
|
|
107
|
+
*/
|
|
108
|
+
baseElement?: BaseElement | undefined
|
|
109
|
+
/**
|
|
110
|
+
* If `hydrate` is set to `true`, then it will render with `ReactDOM.hydrate`. This may be useful if you are using server-side
|
|
111
|
+
* rendering and use ReactDOM.hydrate to mount your components.
|
|
112
|
+
*
|
|
113
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#hydrate)
|
|
114
|
+
*/
|
|
115
|
+
hydrate?: boolean | undefined
|
|
116
|
+
/**
|
|
117
|
+
* Only works if used with React 18.
|
|
118
|
+
* Set to `true` if you want to force synchronous `ReactDOM.render`.
|
|
119
|
+
* Otherwise `render` will default to concurrent React if available.
|
|
120
|
+
*/
|
|
121
|
+
legacyRoot?: boolean | undefined
|
|
122
|
+
/**
|
|
123
|
+
* Only supported in React 19.
|
|
124
|
+
* Callback called when React catches an error in an Error Boundary.
|
|
125
|
+
* Called with the error caught by the Error Boundary, and an `errorInfo` object containing the `componentStack`.
|
|
126
|
+
*
|
|
127
|
+
* @see {@link https://react.dev/reference/react-dom/client/createRoot#parameters createRoot#options}
|
|
128
|
+
*/
|
|
129
|
+
onCaughtError?: ReactDOMClient.RootOptions extends {
|
|
130
|
+
onCaughtError?: infer OnCaughtError
|
|
131
|
+
}
|
|
132
|
+
? OnCaughtError
|
|
133
|
+
: never
|
|
134
|
+
/**
|
|
135
|
+
* Callback called when React automatically recovers from errors.
|
|
136
|
+
* Called with an error React throws, and an `errorInfo` object containing the `componentStack`.
|
|
137
|
+
* Some recoverable errors may include the original error cause as `error.cause`.
|
|
138
|
+
*
|
|
139
|
+
* @see {@link https://react.dev/reference/react-dom/client/createRoot#parameters createRoot#options}
|
|
140
|
+
*/
|
|
141
|
+
onRecoverableError?: ReactDOMClient.RootOptions['onRecoverableError']
|
|
142
|
+
/**
|
|
143
|
+
* Not supported at the moment
|
|
144
|
+
*/
|
|
145
|
+
onUncaughtError?: never
|
|
146
|
+
/**
|
|
147
|
+
* Queries to bind. Overrides the default set from DOM Testing Library unless merged.
|
|
148
|
+
*
|
|
149
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#queries
|
|
150
|
+
*/
|
|
151
|
+
queries?: Q | undefined
|
|
152
|
+
/**
|
|
153
|
+
* Pass a React Component as the wrapper option to have it rendered around the inner element. This is most useful for creating
|
|
154
|
+
* reusable custom render functions for common data providers. See setup for examples.
|
|
155
|
+
*
|
|
156
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#wrapper
|
|
157
|
+
*/
|
|
158
|
+
wrapper?: React.JSXElementConstructor<{children: React.ReactNode}> | undefined
|
|
159
|
+
/**
|
|
160
|
+
* When enabled, <StrictMode> is rendered around the inner element.
|
|
161
|
+
* If defined, overrides the value of `reactStrictMode` set in `configure`.
|
|
162
|
+
*/
|
|
163
|
+
reactStrictMode?: boolean
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>
|
|
167
|
+
|
|
168
|
+
/**
|
|
169
|
+
* Render into a container which is appended to document.body. It should be used with cleanup.
|
|
170
|
+
*/
|
|
171
|
+
export function render<
|
|
172
|
+
Q extends Queries = typeof queries,
|
|
173
|
+
Container extends RendererableContainer | HydrateableContainer = HTMLElement,
|
|
174
|
+
BaseElement extends RendererableContainer | HydrateableContainer = Container,
|
|
175
|
+
>(
|
|
176
|
+
ui: React.ReactNode,
|
|
177
|
+
options: RenderOptions<Q, Container, BaseElement>,
|
|
178
|
+
): RenderResult<Q, Container, BaseElement>
|
|
179
|
+
export function render(
|
|
180
|
+
ui: React.ReactNode,
|
|
181
|
+
options?: Omit<RenderOptions, 'queries'> | undefined,
|
|
182
|
+
): RenderResult
|
|
183
|
+
|
|
184
|
+
export interface RenderHookResult<Result, Props> {
|
|
185
|
+
/**
|
|
186
|
+
* Triggers a re-render. The props will be passed to your renderHook callback.
|
|
187
|
+
*/
|
|
188
|
+
rerender: (props?: Props) => void
|
|
189
|
+
/**
|
|
190
|
+
* This is a stable reference to the latest value returned by your renderHook
|
|
191
|
+
* callback
|
|
192
|
+
*/
|
|
193
|
+
result: {
|
|
194
|
+
/**
|
|
195
|
+
* The value returned by your renderHook callback
|
|
196
|
+
*/
|
|
197
|
+
current: Result
|
|
198
|
+
}
|
|
199
|
+
/**
|
|
200
|
+
* Unmounts the test component. This is useful for when you need to test
|
|
201
|
+
* any cleanup your useEffects have.
|
|
202
|
+
*/
|
|
203
|
+
unmount: () => void
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
/** @deprecated */
|
|
207
|
+
export type BaseRenderHookOptions<
|
|
208
|
+
Props,
|
|
209
|
+
Q extends Queries,
|
|
210
|
+
Container extends RendererableContainer | HydrateableContainer,
|
|
211
|
+
BaseElement extends Element | DocumentFragment,
|
|
212
|
+
> = RenderHookOptions<Props, Q, Container, BaseElement>
|
|
213
|
+
|
|
214
|
+
/** @deprecated */
|
|
215
|
+
export interface ClientRenderHookOptions<
|
|
216
|
+
Props,
|
|
217
|
+
Q extends Queries,
|
|
218
|
+
Container extends Element | DocumentFragment,
|
|
219
|
+
BaseElement extends Element | DocumentFragment = Container,
|
|
220
|
+
> extends BaseRenderHookOptions<Props, Q, Container, BaseElement> {
|
|
221
|
+
/**
|
|
222
|
+
* If `hydrate` is set to `true`, then it will render with `ReactDOM.hydrate`. This may be useful if you are using server-side
|
|
223
|
+
* rendering and use ReactDOM.hydrate to mount your components.
|
|
224
|
+
*
|
|
225
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#hydrate)
|
|
226
|
+
*/
|
|
227
|
+
hydrate?: false | undefined
|
|
228
|
+
}
|
|
229
|
+
|
|
230
|
+
/** @deprecated */
|
|
231
|
+
export interface HydrateHookOptions<
|
|
232
|
+
Props,
|
|
233
|
+
Q extends Queries,
|
|
234
|
+
Container extends Element | DocumentFragment,
|
|
235
|
+
BaseElement extends Element | DocumentFragment = Container,
|
|
236
|
+
> extends BaseRenderHookOptions<Props, Q, Container, BaseElement> {
|
|
237
|
+
/**
|
|
238
|
+
* If `hydrate` is set to `true`, then it will render with `ReactDOM.hydrate`. This may be useful if you are using server-side
|
|
239
|
+
* rendering and use ReactDOM.hydrate to mount your components.
|
|
240
|
+
*
|
|
241
|
+
* @see https://testing-library.com/docs/react-testing-library/api/#hydrate)
|
|
242
|
+
*/
|
|
243
|
+
hydrate: true
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
export interface RenderHookOptions<
|
|
247
|
+
Props,
|
|
248
|
+
Q extends Queries = typeof queries,
|
|
249
|
+
Container extends RendererableContainer | HydrateableContainer = HTMLElement,
|
|
250
|
+
BaseElement extends RendererableContainer | HydrateableContainer = Container,
|
|
251
|
+
> extends BaseRenderOptions<Q, Container, BaseElement> {
|
|
252
|
+
/**
|
|
253
|
+
* The argument passed to the renderHook callback. Can be useful if you plan
|
|
254
|
+
* to use the rerender utility to change the values passed to your hook.
|
|
255
|
+
*/
|
|
256
|
+
initialProps?: Props | undefined
|
|
257
|
+
}
|
|
258
|
+
|
|
259
|
+
/**
|
|
260
|
+
* Allows you to render a hook within a test React component without having to
|
|
261
|
+
* create that component yourself.
|
|
262
|
+
*/
|
|
263
|
+
export function renderHook<
|
|
264
|
+
Result,
|
|
265
|
+
Props,
|
|
266
|
+
Q extends Queries = typeof queries,
|
|
267
|
+
Container extends RendererableContainer | HydrateableContainer = HTMLElement,
|
|
268
|
+
BaseElement extends RendererableContainer | HydrateableContainer = Container,
|
|
269
|
+
>(
|
|
270
|
+
render: (initialProps: Props) => Result,
|
|
271
|
+
options?: RenderHookOptions<Props, Q, Container, BaseElement> | undefined,
|
|
272
|
+
): RenderHookResult<Result, Props>
|
|
273
|
+
|
|
274
|
+
/**
|
|
275
|
+
* Unmounts React trees that were mounted with render.
|
|
276
|
+
*/
|
|
277
|
+
export function cleanup(): void
|
|
278
|
+
|
|
279
|
+
/**
|
|
280
|
+
* Simply calls React.act(cb)
|
|
281
|
+
* If that's not available (older version of react) then it
|
|
282
|
+
* simply calls the deprecated version which is ReactTestUtils.act(cb)
|
|
283
|
+
*/
|
|
284
|
+
// IfAny<typeof reactAct, reactDeprecatedAct, reactAct> from https://stackoverflow.com/a/61626123/3406963
|
|
285
|
+
export const act: 0 extends 1 & typeof reactAct
|
|
286
|
+
? typeof reactDeprecatedAct
|
|
287
|
+
: typeof reactAct
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './'
|
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
# @vitejs/plugin-react [](https://npmjs.com/package/@vitejs/plugin-react)
|
|
2
|
+
|
|
3
|
+
The default Vite plugin for React projects.
|
|
4
|
+
|
|
5
|
+
- enable [Fast Refresh](https://www.npmjs.com/package/react-refresh) in development (requires react >= 16.9)
|
|
6
|
+
- use the [automatic JSX runtime](https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html)
|
|
7
|
+
- use custom Babel plugins/presets
|
|
8
|
+
- small installation size
|
|
9
|
+
|
|
10
|
+
```js
|
|
11
|
+
// vite.config.js
|
|
12
|
+
import { defineConfig } from 'vite'
|
|
13
|
+
import react from '@vitejs/plugin-react'
|
|
14
|
+
|
|
15
|
+
export default defineConfig({
|
|
16
|
+
plugins: [react()],
|
|
17
|
+
})
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
## Options
|
|
21
|
+
|
|
22
|
+
### include
|
|
23
|
+
|
|
24
|
+
Includes `.js`, `.jsx`, `.ts` & `.tsx` by default. This option can be used to add fast refresh to `.mdx` files:
|
|
25
|
+
|
|
26
|
+
```js
|
|
27
|
+
import { defineConfig } from 'vite'
|
|
28
|
+
import react from '@vitejs/plugin-react'
|
|
29
|
+
import mdx from '@mdx-js/rollup'
|
|
30
|
+
|
|
31
|
+
export default defineConfig({
|
|
32
|
+
plugins: [
|
|
33
|
+
{ enforce: 'pre', ...mdx() },
|
|
34
|
+
react({ include: /\.(mdx|js|jsx|ts|tsx)$/ }),
|
|
35
|
+
],
|
|
36
|
+
})
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
### exclude
|
|
40
|
+
|
|
41
|
+
The default value is `/node_modules/`. You may use it to exclude JSX/TSX files that runs in a worker or are not React files.
|
|
42
|
+
Except if explicitly desired, you should keep `node_modules` in the exclude list:
|
|
43
|
+
|
|
44
|
+
```js
|
|
45
|
+
import { defineConfig } from 'vite'
|
|
46
|
+
import react from '@vitejs/plugin-react'
|
|
47
|
+
|
|
48
|
+
export default defineConfig({
|
|
49
|
+
plugins: [
|
|
50
|
+
react({ exclude: [/\/pdf\//, /\.solid\.tsx$/, /\/node_modules\//] }),
|
|
51
|
+
],
|
|
52
|
+
})
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
### jsxImportSource
|
|
56
|
+
|
|
57
|
+
Control where the JSX factory is imported from. By default, this is inferred from `jsxImportSource` from corresponding a tsconfig file for a transformed file.
|
|
58
|
+
|
|
59
|
+
```js
|
|
60
|
+
react({ jsxImportSource: '@emotion/react' })
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
### jsxRuntime
|
|
64
|
+
|
|
65
|
+
By default, the plugin uses the [automatic JSX runtime](https://legacy.reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html). However, if you encounter any issues, you may opt out using the `jsxRuntime` option.
|
|
66
|
+
|
|
67
|
+
```js
|
|
68
|
+
react({ jsxRuntime: 'classic' })
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
### babel
|
|
72
|
+
|
|
73
|
+
The `babel` option lets you add plugins, presets, and [other configuration](https://babeljs.io/docs/en/options) to the Babel transformation performed on each included file.
|
|
74
|
+
|
|
75
|
+
```js
|
|
76
|
+
react({
|
|
77
|
+
babel: {
|
|
78
|
+
presets: [...],
|
|
79
|
+
// Your plugins run before any built-in transform (eg: Fast Refresh)
|
|
80
|
+
plugins: [...],
|
|
81
|
+
// Use .babelrc files
|
|
82
|
+
babelrc: true,
|
|
83
|
+
// Use babel.config.js files
|
|
84
|
+
configFile: true,
|
|
85
|
+
}
|
|
86
|
+
})
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
Note: When not using plugins, only esbuild is used for production builds, resulting in faster builds.
|
|
90
|
+
|
|
91
|
+
#### Proposed syntax
|
|
92
|
+
|
|
93
|
+
If you are using ES syntax that are still in proposal status (e.g. class properties), you can selectively enable them with the `babel.parserOpts.plugins` option:
|
|
94
|
+
|
|
95
|
+
```js
|
|
96
|
+
react({
|
|
97
|
+
babel: {
|
|
98
|
+
parserOpts: {
|
|
99
|
+
plugins: ['decorators-legacy'],
|
|
100
|
+
},
|
|
101
|
+
},
|
|
102
|
+
})
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
This option does not enable _code transformation_. That is handled by esbuild.
|
|
106
|
+
|
|
107
|
+
**Note:** TypeScript syntax is handled automatically.
|
|
108
|
+
|
|
109
|
+
Here's the [complete list of Babel parser plugins](https://babeljs.io/docs/en/babel-parser#ecmascript-proposalshttpsgithubcombabelproposals).
|
|
110
|
+
|
|
111
|
+
### reactRefreshHost
|
|
112
|
+
|
|
113
|
+
The `reactRefreshHost` option is only necessary in a module federation context. It enables HMR to work between a remote & host application. In your remote Vite config, you would add your host origin:
|
|
114
|
+
|
|
115
|
+
```js
|
|
116
|
+
react({ reactRefreshHost: 'http://localhost:3000' })
|
|
117
|
+
```
|
|
118
|
+
|
|
119
|
+
Under the hood, this simply updates the React Fash Refresh runtime URL from `/@react-refresh` to `http://localhost:3000/@react-refresh` to ensure there is only one Refresh runtime across the whole application. Note that if you define `base` option in the host application, you need to include it in the option, like: `http://localhost:3000/{base}`.
|
|
120
|
+
|
|
121
|
+
## `@vitejs/plugin-react/preamble`
|
|
122
|
+
|
|
123
|
+
The package provides `@vitejs/plugin-react/preamble` to initialize HMR runtime from client entrypoint for SSR applications which don't use [`transformIndexHtml` API](https://vite.dev/guide/api-javascript.html#vitedevserver). For example:
|
|
124
|
+
|
|
125
|
+
```js
|
|
126
|
+
// [entry.client.js]
|
|
127
|
+
import '@vitejs/plugin-react/preamble'
|
|
128
|
+
```
|
|
129
|
+
|
|
130
|
+
Alternatively, you can manually call `transformIndexHtml` during SSR, which sets up equivalent initialization code. Here's an example for an Express server:
|
|
131
|
+
|
|
132
|
+
```js
|
|
133
|
+
app.get('/', async (req, res, next) => {
|
|
134
|
+
try {
|
|
135
|
+
let html = fs.readFileSync(path.resolve(root, 'index.html'), 'utf-8')
|
|
136
|
+
|
|
137
|
+
// Transform HTML using Vite plugins.
|
|
138
|
+
html = await viteServer.transformIndexHtml(req.url, html)
|
|
139
|
+
|
|
140
|
+
res.send(html)
|
|
141
|
+
} catch (e) {
|
|
142
|
+
return next(e)
|
|
143
|
+
}
|
|
144
|
+
})
|
|
145
|
+
```
|
|
146
|
+
|
|
147
|
+
Otherwise, you'll get the following error:
|
|
148
|
+
|
|
149
|
+
```
|
|
150
|
+
Uncaught Error: @vitejs/plugin-react can't detect preamble. Something is wrong.
|
|
151
|
+
```
|
|
152
|
+
|
|
153
|
+
## Consistent components exports
|
|
154
|
+
|
|
155
|
+
For React refresh to work correctly, your file should only export React components. You can find a good explanation in the [Gatsby docs](https://www.gatsbyjs.com/docs/reference/local-development/fast-refresh/#how-it-works).
|
|
156
|
+
|
|
157
|
+
If an incompatible change in exports is found, the module will be invalidated and HMR will propagate. To make it easier to export simple constants alongside your component, the module is only invalidated when their value changes.
|
|
158
|
+
|
|
159
|
+
You can catch mistakes and get more detailed warning with this [eslint rule](https://github.com/ArnaudBarre/eslint-plugin-react-refresh).
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { Plugin, ResolvedConfig } from "vite";
|
|
2
|
+
import { ParserOptions, TransformOptions } from "@babel/core";
|
|
3
|
+
|
|
4
|
+
//#region src/index.d.ts
|
|
5
|
+
interface Options {
|
|
6
|
+
/**
|
|
7
|
+
* Can be used to process extra files like `.mdx`
|
|
8
|
+
* @example include: /\.(mdx|js|jsx|ts|tsx)$/
|
|
9
|
+
* @default /\.[tj]sx?$/
|
|
10
|
+
*/
|
|
11
|
+
include?: string | RegExp | Array<string | RegExp>;
|
|
12
|
+
/**
|
|
13
|
+
* Can be used to exclude JSX/TSX files that runs in a worker or are not React files.
|
|
14
|
+
* Except if explicitly desired, you should keep node_modules in the exclude list
|
|
15
|
+
* @example exclude: [/\/pdf\//, /\.solid\.tsx$/, /\/node_modules\//]
|
|
16
|
+
* @default /\/node_modules\//
|
|
17
|
+
*/
|
|
18
|
+
exclude?: string | RegExp | Array<string | RegExp>;
|
|
19
|
+
/**
|
|
20
|
+
* Control where the JSX factory is imported from.
|
|
21
|
+
* https://esbuild.github.io/api/#jsx-import-source
|
|
22
|
+
* @default 'react'
|
|
23
|
+
*/
|
|
24
|
+
jsxImportSource?: string;
|
|
25
|
+
/**
|
|
26
|
+
* Note: Skipping React import with classic runtime is not supported from v4
|
|
27
|
+
* @default "automatic"
|
|
28
|
+
*/
|
|
29
|
+
jsxRuntime?: 'classic' | 'automatic';
|
|
30
|
+
/**
|
|
31
|
+
* Babel configuration applied in both dev and prod.
|
|
32
|
+
*/
|
|
33
|
+
babel?: BabelOptions | ((id: string, options: {
|
|
34
|
+
ssr?: boolean;
|
|
35
|
+
}) => BabelOptions);
|
|
36
|
+
/**
|
|
37
|
+
* React Fast Refresh runtime URL prefix.
|
|
38
|
+
* Useful in a module federation context to enable HMR by specifying
|
|
39
|
+
* the host application URL in the Vite config of a remote application.
|
|
40
|
+
* @example
|
|
41
|
+
* reactRefreshHost: 'http://localhost:3000'
|
|
42
|
+
*/
|
|
43
|
+
reactRefreshHost?: string;
|
|
44
|
+
}
|
|
45
|
+
type BabelOptions = Omit<TransformOptions, 'ast' | 'filename' | 'root' | 'sourceFileName' | 'sourceMaps' | 'inputSourceMap'>;
|
|
46
|
+
/**
|
|
47
|
+
* The object type used by the `options` passed to plugins with
|
|
48
|
+
* an `api.reactBabel` method.
|
|
49
|
+
*/
|
|
50
|
+
interface ReactBabelOptions extends BabelOptions {
|
|
51
|
+
plugins: Extract<BabelOptions['plugins'], any[]>;
|
|
52
|
+
presets: Extract<BabelOptions['presets'], any[]>;
|
|
53
|
+
overrides: Extract<BabelOptions['overrides'], any[]>;
|
|
54
|
+
parserOpts: ParserOptions & {
|
|
55
|
+
plugins: Extract<ParserOptions['plugins'], any[]>;
|
|
56
|
+
};
|
|
57
|
+
}
|
|
58
|
+
type ReactBabelHook = (babelConfig: ReactBabelOptions, context: ReactBabelHookContext, config: ResolvedConfig) => void;
|
|
59
|
+
type ReactBabelHookContext = {
|
|
60
|
+
ssr: boolean;
|
|
61
|
+
id: string;
|
|
62
|
+
};
|
|
63
|
+
type ViteReactPluginApi = {
|
|
64
|
+
/**
|
|
65
|
+
* Manipulate the Babel options of `@vitejs/plugin-react`
|
|
66
|
+
*/
|
|
67
|
+
reactBabel?: ReactBabelHook;
|
|
68
|
+
};
|
|
69
|
+
declare function viteReact(opts?: Options): Plugin[];
|
|
70
|
+
declare namespace viteReact {
|
|
71
|
+
var preambleCode: string;
|
|
72
|
+
}
|
|
73
|
+
declare function viteReactForCjs(this: unknown, options: Options): Plugin[];
|
|
74
|
+
//#endregion
|
|
75
|
+
export { BabelOptions, Options, ReactBabelOptions, ViteReactPluginApi, viteReact as default, viteReactForCjs as "module.exports" };
|