@describe-me/vitest 0.5.4 → 0.6.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/README.md +10 -8
- package/dist/browser-profile.d.ts +3 -0
- package/dist/browser-profile.js +27 -0
- package/dist/build-live.d.ts +26 -0
- package/dist/build-live.js +106 -0
- package/dist/check-live-enabled.d.ts +3 -0
- package/dist/check-live-enabled.js +10 -0
- package/dist/collect-live-suites.d.ts +7 -0
- package/dist/collect-live-suites.js +25 -0
- package/dist/create-live-server.d.ts +29 -0
- package/dist/create-live-server.js +55 -0
- package/dist/detect-environment.d.ts +4 -0
- package/dist/detect-environment.js +4 -0
- package/dist/dom-profile.d.ts +3 -0
- package/dist/dom-profile.js +38 -0
- package/dist/environment-profile.d.ts +41 -0
- package/dist/environment-profile.js +1 -0
- package/dist/find-live-config-file.d.ts +2 -0
- package/dist/find-live-config-file.js +16 -0
- package/dist/find-live-test.d.ts +13 -0
- package/dist/find-live-test.js +31 -0
- package/dist/free-live-port.d.ts +5 -0
- package/dist/free-live-port.js +16 -0
- package/dist/import-live-vite.d.ts +7 -0
- package/dist/import-live-vite.js +46 -0
- package/dist/install-live-globals.d.ts +5 -0
- package/dist/install-live-globals.js +33 -0
- package/dist/is-adapter-module.d.ts +6 -0
- package/dist/is-adapter-module.js +11 -0
- package/dist/live-arg-label.d.ts +5 -0
- package/dist/live-arg-label.js +38 -0
- package/dist/live-build-plugin.d.ts +18 -0
- package/dist/live-build-plugin.js +89 -0
- package/dist/live-each-name.d.ts +6 -0
- package/dist/live-each-name.js +146 -0
- package/dist/live-entry-source.d.ts +9 -0
- package/dist/live-entry-source.js +46 -0
- package/dist/live-env.d.ts +6 -0
- package/dist/live-env.js +6 -0
- package/dist/live-error-detail.d.ts +2 -0
- package/dist/live-error-detail.js +16 -0
- package/dist/live-export.d.ts +10 -0
- package/dist/live-export.js +48 -0
- package/dist/live-fixture-props.d.ts +12 -0
- package/dist/live-fixture-props.js +87 -0
- package/dist/live-fixture-registrations.d.ts +21 -0
- package/dist/live-fixture-registrations.js +69 -0
- package/dist/live-fixture-values.d.ts +9 -0
- package/dist/live-fixture-values.js +125 -0
- package/dist/live-format-placeholder.d.ts +6 -0
- package/dist/live-format-placeholder.js +70 -0
- package/dist/live-hook.d.ts +8 -0
- package/dist/live-hook.js +12 -0
- package/dist/live-inspect.d.ts +7 -0
- package/dist/live-inspect.js +240 -0
- package/dist/live-loupe-inspect.d.ts +6 -0
- package/dist/live-loupe-inspect.js +330 -0
- package/dist/live-mock.d.ts +18 -0
- package/dist/live-mock.js +105 -0
- package/dist/live-module-ids.d.ts +8 -0
- package/dist/live-module-ids.js +8 -0
- package/dist/live-optimize-deps.d.ts +13 -0
- package/dist/live-optimize-deps.js +67 -0
- package/dist/live-page-html.d.ts +5 -0
- package/dist/live-page-html.js +21 -0
- package/dist/live-page-middleware.d.ts +6 -0
- package/dist/live-page-middleware.js +28 -0
- package/dist/live-page-settings.d.ts +20 -0
- package/dist/live-page-settings.js +24 -0
- package/dist/live-plugin-protocol.d.ts +3 -0
- package/dist/live-plugin-protocol.js +13 -0
- package/dist/live-plugin.d.ts +13 -0
- package/dist/live-plugin.js +148 -0
- package/dist/live-project-plugins.d.ts +8 -0
- package/dist/live-project-plugins.js +23 -0
- package/dist/live-registrar.d.ts +10 -0
- package/dist/live-registrar.js +174 -0
- package/dist/live-registry.d.ts +14 -0
- package/dist/live-registry.js +14 -0
- package/dist/live-runtime.d.ts +2 -0
- package/dist/live-runtime.js +3 -0
- package/dist/live-setup-files.d.ts +15 -0
- package/dist/live-setup-files.js +56 -0
- package/dist/live-shim-source.d.ts +6 -0
- package/dist/live-shim-source.js +9 -0
- package/dist/live-spy-on.d.ts +7 -0
- package/dist/live-spy-on.js +27 -0
- package/dist/live-step.d.ts +2 -0
- package/dist/live-step.js +4 -0
- package/dist/live-string-literal.d.ts +2 -0
- package/dist/live-string-literal.js +7 -0
- package/dist/live-suite.d.ts +28 -0
- package/dist/live-suite.js +18 -0
- package/dist/live-test-context.d.ts +24 -0
- package/dist/live-test-context.js +26 -0
- package/dist/live-test-files-source.d.ts +6 -0
- package/dist/live-test-files-source.js +10 -0
- package/dist/live-vi.d.ts +7 -0
- package/dist/live-vi.js +50 -0
- package/dist/live.d.ts +2 -0
- package/dist/live.js +3 -0
- package/dist/load-live-config.d.ts +9 -0
- package/dist/load-live-config.js +25 -0
- package/dist/load-profile.d.ts +4 -0
- package/dist/load-profile.js +9 -0
- package/dist/notice-live-module-mock.d.ts +5 -0
- package/dist/notice-live-module-mock.js +25 -0
- package/dist/package-name-of.d.ts +5 -0
- package/dist/package-name-of.js +7 -0
- package/dist/plugin.d.ts +11 -2
- package/dist/plugin.js +40 -86
- package/dist/read-live-browser-names.d.ts +5 -0
- package/dist/read-live-browser-names.js +19 -0
- package/dist/read-live-params.d.ts +18 -0
- package/dist/read-live-params.js +63 -0
- package/dist/read-live-vitest-major.d.ts +6 -0
- package/dist/read-live-vitest-major.js +20 -0
- package/dist/read-live-vitest-names.d.ts +5 -0
- package/dist/read-live-vitest-names.js +40 -0
- package/dist/register-recording-hooks.d.ts +2 -1
- package/dist/register-recording-hooks.js +8 -7
- package/dist/report-live-errors.d.ts +5 -0
- package/dist/report-live-errors.js +24 -0
- package/dist/reporter.d.ts +3 -0
- package/dist/reporter.js +9 -0
- package/dist/run-live-test.d.ts +10 -0
- package/dist/run-live-test.js +118 -0
- package/dist/set-up-project.d.ts +12 -0
- package/dist/set-up-project.js +39 -0
- package/dist/start-live-page.d.ts +29 -0
- package/dist/start-live-page.js +62 -0
- package/dist/validate-live-option.d.ts +11 -0
- package/dist/validate-live-option.js +29 -0
- package/package.json +11 -3
package/README.md
CHANGED
|
@@ -15,7 +15,7 @@ story, and each step is a frame you can scrub through. Stories cannot rot,
|
|
|
15
15
|
because they are tests. If one drifts from the component, CI goes red.
|
|
16
16
|
|
|
17
17
|
Status: prototype. React 18 and 19, Vitest 4 and 5 in browser mode or jsdom,
|
|
18
|
-
|
|
18
|
+
recorded frames and Live in the viewer.
|
|
19
19
|
|
|
20
20
|
## Which package do I need
|
|
21
21
|
|
|
@@ -58,13 +58,15 @@ lists every change it makes to your config, and
|
|
|
58
58
|
[Options](https://grzehub.github.io/describe-me/configuration.html#options)
|
|
59
59
|
every option it takes.
|
|
60
60
|
|
|
61
|
-
| Entry point
|
|
62
|
-
|
|
|
63
|
-
| `@describe-me/vitest/plugin`
|
|
64
|
-
| `@describe-me/vitest`
|
|
65
|
-
| `@describe-me/vitest/setup`
|
|
66
|
-
| `@describe-me/vitest/setup-dom`
|
|
67
|
-
| `@describe-me/vitest/reporter`
|
|
61
|
+
| Entry point | What it holds |
|
|
62
|
+
| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------------- |
|
|
63
|
+
| `@describe-me/vitest/plugin` | [`describeMe()`](https://grzehub.github.io/describe-me/api.html#entry-vitest-plugin) |
|
|
64
|
+
| `@describe-me/vitest` | [`step()` and `recorder`](https://grzehub.github.io/describe-me/api.html#entry-vitest) |
|
|
65
|
+
| `@describe-me/vitest/setup` | [the browser-mode setup file](https://grzehub.github.io/describe-me/api.html#entry-vitest-setup) |
|
|
66
|
+
| `@describe-me/vitest/setup-dom` | [the jsdom setup file](https://grzehub.github.io/describe-me/api.html#entry-vitest-setup-dom) |
|
|
67
|
+
| `@describe-me/vitest/reporter` | [the reporter, to wire by hand](https://grzehub.github.io/describe-me/api.html#entry-vitest-reporter) |
|
|
68
|
+
| `@describe-me/vitest/live` | [`createLiveServer()` and `buildLive()`, for the CLI](https://grzehub.github.io/describe-me/api.html#entry-vitest-live) |
|
|
69
|
+
| `@describe-me/vitest/live-runtime` | [the runtime of the live page](https://grzehub.github.io/describe-me/api.html#entry-vitest-live-runtime) |
|
|
68
70
|
|
|
69
71
|
`typescript` and `@testing-library/user-event` are optional peers. Without
|
|
70
72
|
TypeScript the docs have no props tables. user-event is needed only when your
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/** Vitest browser mode, where tests render in a real browser. */
|
|
2
|
+
export const browserProfile = {
|
|
3
|
+
renderModules: {
|
|
4
|
+
react: {
|
|
5
|
+
original: 'vitest-browser-react',
|
|
6
|
+
adapter: '@describe-me/react',
|
|
7
|
+
live: '@describe-me/react/live',
|
|
8
|
+
},
|
|
9
|
+
},
|
|
10
|
+
setupFile: '@describe-me/vitest/setup',
|
|
11
|
+
env: {},
|
|
12
|
+
configFor({ renderModule }) {
|
|
13
|
+
return {
|
|
14
|
+
config: {
|
|
15
|
+
// Vite's dependency scanner runs before our `resolveId` redirect, so it
|
|
16
|
+
// never sees the adapter. Discovering it mid-run makes Vite re-optimize
|
|
17
|
+
// and reload, and the test ends up with two copies of the bundled deps
|
|
18
|
+
// ("Vitest failed to find the runner"). Declaring the adapter up front
|
|
19
|
+
// keeps a single optimization pass.
|
|
20
|
+
optimizeDeps: {
|
|
21
|
+
include: [renderModule.adapter, renderModule.original],
|
|
22
|
+
},
|
|
23
|
+
},
|
|
24
|
+
setupWarnings: [],
|
|
25
|
+
};
|
|
26
|
+
},
|
|
27
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/** What `buildLive()` builds, and where it writes the page. */
|
|
2
|
+
export interface LiveBuildOptions {
|
|
3
|
+
/** The project root. */
|
|
4
|
+
root: string;
|
|
5
|
+
/** The Vitest config file, relative to `root` or absolute. Default: the one Vitest picks. */
|
|
6
|
+
configFile?: string;
|
|
7
|
+
/** Where the live page goes, relative to the current directory or absolute. Emptied first. */
|
|
8
|
+
outDir: string;
|
|
9
|
+
/** The test files the page can import: module ids of the manifest, paths relative to `root`. */
|
|
10
|
+
testFiles: string[];
|
|
11
|
+
}
|
|
12
|
+
/** A finished live build. */
|
|
13
|
+
export interface LiveBuild {
|
|
14
|
+
/** `api.live.protocol` of the project's describeMe() plugin. */
|
|
15
|
+
protocol: number;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* Builds the live preview into `outDir` as static files: `live.html`, the
|
|
19
|
+
* setup files and a lazy import of each test file, with a relative base, so
|
|
20
|
+
* it works under any path of a static host. It loads the project's config
|
|
21
|
+
* the way `createLiveServer()` does, with the project's own Vite, and builds
|
|
22
|
+
* the page the dev server serves. When the project's describeMe() has
|
|
23
|
+
* `live: false`, it writes nothing and rejects with an error whose `code` is
|
|
24
|
+
* `DESCRIBE_ME_LIVE_OFF`.
|
|
25
|
+
*/
|
|
26
|
+
export declare function buildLive(options: LiveBuildOptions): Promise<LiveBuild>;
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
import { existsSync, realpathSync } from 'node:fs';
|
|
2
|
+
import { isAbsolute, join, relative, resolve, sep } from 'node:path';
|
|
3
|
+
import { findLiveConfigFile } from './find-live-config-file.js';
|
|
4
|
+
import { importLiveVite } from './import-live-vite.js';
|
|
5
|
+
import { liveBuildPlugin } from './live-build-plugin.js';
|
|
6
|
+
import { liveProjectPlugins } from './live-project-plugins.js';
|
|
7
|
+
import { loadLiveConfig } from './load-live-config.js';
|
|
8
|
+
function isInRoot(file, root) {
|
|
9
|
+
const fromRoot = relative(root, file);
|
|
10
|
+
return fromRoot !== '' && fromRoot.split(sep)[0] !== '..' && !isAbsolute(fromRoot);
|
|
11
|
+
}
|
|
12
|
+
/** The test files with `/` separators, without those that are not under the root, which it names once. */
|
|
13
|
+
function liveTestFiles(testFiles, root) {
|
|
14
|
+
const kept = new Set();
|
|
15
|
+
const missing = [];
|
|
16
|
+
for (const file of testFiles.map((testFile) => testFile.replaceAll('\\', '/'))) {
|
|
17
|
+
const path = resolve(root, file);
|
|
18
|
+
if (isInRoot(path, root) && existsSync(path)) {
|
|
19
|
+
kept.add(file);
|
|
20
|
+
}
|
|
21
|
+
else {
|
|
22
|
+
missing.push(file);
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
if (missing.length > 0) {
|
|
26
|
+
console.warn(`describe-me: the live build leaves out test files that are not in ${root}: ${missing.join(', ')}`);
|
|
27
|
+
}
|
|
28
|
+
return [...kept];
|
|
29
|
+
}
|
|
30
|
+
function liveBuildOptions(viteVersion, root, outDir) {
|
|
31
|
+
// Vite 8 does not resolve a relative input against the root.
|
|
32
|
+
const bundlerOptions = { input: join(root, 'live.html'), shimMissingExports: true };
|
|
33
|
+
// Vite 8 bundles with Rolldown and older majors with Rollup, each under its own key.
|
|
34
|
+
const bundler = Number.parseInt(viteVersion, 10) >= 8
|
|
35
|
+
? { rolldownOptions: bundlerOptions }
|
|
36
|
+
: { rollupOptions: bundlerOptions };
|
|
37
|
+
return {
|
|
38
|
+
outDir: resolve(outDir),
|
|
39
|
+
// Vite empties an outDir outside the root only when asked.
|
|
40
|
+
emptyOutDir: true,
|
|
41
|
+
// Suite and test names come from `fn.name`, as in Vitest. A minifier would rename
|
|
42
|
+
// `describe(Button, …)` and `%s` rows of functions, so the page would not find tests that
|
|
43
|
+
// dev mounts. Dev allows top-level await, which Vite 6's default target rejects.
|
|
44
|
+
minify: false,
|
|
45
|
+
target: 'esnext',
|
|
46
|
+
// Unminified, React's development build alone is above Vite's default limit.
|
|
47
|
+
chunkSizeWarningLimit: 10_000,
|
|
48
|
+
...bundler,
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
/** Runs `build` with `NODE_ENV=development`, as on the dev server, and puts back what was there. */
|
|
52
|
+
async function inDevelopment(build) {
|
|
53
|
+
const previous = process.env.NODE_ENV;
|
|
54
|
+
process.env.NODE_ENV = 'development';
|
|
55
|
+
try {
|
|
56
|
+
return await build();
|
|
57
|
+
}
|
|
58
|
+
finally {
|
|
59
|
+
if (previous === undefined) {
|
|
60
|
+
delete process.env.NODE_ENV;
|
|
61
|
+
}
|
|
62
|
+
else {
|
|
63
|
+
process.env.NODE_ENV = previous;
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
/**
|
|
68
|
+
* Builds the live preview into `outDir` as static files: `live.html`, the
|
|
69
|
+
* setup files and a lazy import of each test file, with a relative base, so
|
|
70
|
+
* it works under any path of a static host. It loads the project's config
|
|
71
|
+
* the way `createLiveServer()` does, with the project's own Vite, and builds
|
|
72
|
+
* the page the dev server serves. When the project's describeMe() has
|
|
73
|
+
* `live: false`, it writes nothing and rejects with an error whose `code` is
|
|
74
|
+
* `DESCRIBE_ME_LIVE_OFF`.
|
|
75
|
+
*/
|
|
76
|
+
export async function buildLive(options) {
|
|
77
|
+
// Vite 8 takes the real path of the root, and the page must lie under it to land in outDir.
|
|
78
|
+
const root = realpathSync(resolve(options.root));
|
|
79
|
+
const configFile = options.configFile === undefined ? findLiveConfigFile(root) : resolve(root, options.configFile);
|
|
80
|
+
const testFiles = liveTestFiles(options.testFiles, root);
|
|
81
|
+
const vite = await importLiveVite(root);
|
|
82
|
+
const loaded = await loadLiveConfig(vite, configFile, root);
|
|
83
|
+
const configName = relative(root, configFile) || configFile;
|
|
84
|
+
let protocol = 0;
|
|
85
|
+
const config = vite.mergeConfig(loaded.config, {
|
|
86
|
+
root,
|
|
87
|
+
mode: 'test',
|
|
88
|
+
base: './',
|
|
89
|
+
logLevel: 'warn',
|
|
90
|
+
clearScreen: false,
|
|
91
|
+
});
|
|
92
|
+
// Dev never reads the project's build section, nor runs its build-only plugins.
|
|
93
|
+
config.build = liveBuildOptions(vite.version, root, options.outDir);
|
|
94
|
+
config.plugins = [
|
|
95
|
+
...(await liveProjectPlugins(loaded.config.plugins)),
|
|
96
|
+
liveBuildPlugin({
|
|
97
|
+
configName,
|
|
98
|
+
testFiles,
|
|
99
|
+
onProtocol: (value) => {
|
|
100
|
+
protocol = value;
|
|
101
|
+
},
|
|
102
|
+
}),
|
|
103
|
+
];
|
|
104
|
+
await inDevelopment(() => vite.build({ ...config, configFile: false }));
|
|
105
|
+
return { protocol };
|
|
106
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/** The code of the error for a project whose describeMe() has `live: false`. */
|
|
2
|
+
const LIVE_OFF = 'DESCRIBE_ME_LIVE_OFF';
|
|
3
|
+
/** Throws with the code `DESCRIBE_ME_LIVE_OFF` when the project's describeMe() has `live: false`. */
|
|
4
|
+
export function checkLiveEnabled(plugins, configName) {
|
|
5
|
+
const plugin = plugins.find((candidate) => candidate.name === 'describe-me');
|
|
6
|
+
if (plugin?.api?.live?.enabled !== false) {
|
|
7
|
+
return;
|
|
8
|
+
}
|
|
9
|
+
throw Object.assign(new Error(`describe-me: live: false in ${configName} switches the live preview off`), { code: LIVE_OFF });
|
|
10
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { LiveSuite } from './live-suite.js';
|
|
2
|
+
/**
|
|
3
|
+
* Runs the factories of the registered suites once the test file has
|
|
4
|
+
* imported, as Vitest collects: depth first in registration order, each one
|
|
5
|
+
* awaited. A factory's own `describe` calls are collected after it returns.
|
|
6
|
+
*/
|
|
7
|
+
export declare function collectLiveSuites(suite?: LiveSuite): Promise<void>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { liveRegistry } from './live-registry.js';
|
|
2
|
+
/**
|
|
3
|
+
* Runs the factories of the registered suites once the test file has
|
|
4
|
+
* imported, as Vitest collects: depth first in registration order, each one
|
|
5
|
+
* awaited. A factory's own `describe` calls are collected after it returns.
|
|
6
|
+
*/
|
|
7
|
+
export async function collectLiveSuites(suite = liveRegistry().root) {
|
|
8
|
+
const registry = liveRegistry();
|
|
9
|
+
for (const child of suite.children) {
|
|
10
|
+
if (child.kind !== 'suite') {
|
|
11
|
+
continue;
|
|
12
|
+
}
|
|
13
|
+
if (child.factory !== undefined) {
|
|
14
|
+
const previous = registry.current;
|
|
15
|
+
registry.current = child;
|
|
16
|
+
try {
|
|
17
|
+
await child.factory();
|
|
18
|
+
}
|
|
19
|
+
finally {
|
|
20
|
+
registry.current = previous;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
await collectLiveSuites(child);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/** Where the live preview finds the project. */
|
|
2
|
+
export interface LiveServerOptions {
|
|
3
|
+
/** The project root. */
|
|
4
|
+
root: string;
|
|
5
|
+
/**
|
|
6
|
+
* The Vitest config file, relative to `root` or absolute. Default: the one
|
|
7
|
+
* Vitest picks, the first `vitest.config.*`, then `vite.config.*`.
|
|
8
|
+
*/
|
|
9
|
+
configFile?: string;
|
|
10
|
+
/** The port on localhost. Default: a free one. */
|
|
11
|
+
port?: number;
|
|
12
|
+
}
|
|
13
|
+
/** A running live preview server. */
|
|
14
|
+
export interface LiveServer {
|
|
15
|
+
/** The URL the live page is under, such as `http://localhost:5173/__describe-me/`. */
|
|
16
|
+
base: string;
|
|
17
|
+
/** `api.live.protocol` of the project's describeMe() plugin. */
|
|
18
|
+
protocol: number;
|
|
19
|
+
/** Stops the server. */
|
|
20
|
+
close(): Promise<void>;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Starts the live preview: a second Vite dev server on the project's own
|
|
24
|
+
* config, in mode `test` and on localhost only, whose page mounts one test
|
|
25
|
+
* at a time. A change to the config file takes a new server. When the
|
|
26
|
+
* project's describeMe() has `live: false`, it closes the server and rejects
|
|
27
|
+
* with an error whose `code` is `DESCRIBE_ME_LIVE_OFF`.
|
|
28
|
+
*/
|
|
29
|
+
export declare function createLiveServer(options: LiveServerOptions): Promise<LiveServer>;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { relative, resolve } from 'node:path';
|
|
2
|
+
import { checkLiveEnabled } from './check-live-enabled.js';
|
|
3
|
+
import { findLiveConfigFile } from './find-live-config-file.js';
|
|
4
|
+
import { freeLivePort } from './free-live-port.js';
|
|
5
|
+
import { importLiveVite } from './import-live-vite.js';
|
|
6
|
+
import { livePluginProtocol } from './live-plugin-protocol.js';
|
|
7
|
+
import { loadLiveConfig } from './load-live-config.js';
|
|
8
|
+
/** Closes the server when `run` throws, so a failed start leaves no server behind. */
|
|
9
|
+
async function closingOnError(server, run) {
|
|
10
|
+
try {
|
|
11
|
+
return await run();
|
|
12
|
+
}
|
|
13
|
+
catch (error) {
|
|
14
|
+
await server.close();
|
|
15
|
+
throw error;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Starts the live preview: a second Vite dev server on the project's own
|
|
20
|
+
* config, in mode `test` and on localhost only, whose page mounts one test
|
|
21
|
+
* at a time. A change to the config file takes a new server. When the
|
|
22
|
+
* project's describeMe() has `live: false`, it closes the server and rejects
|
|
23
|
+
* with an error whose `code` is `DESCRIBE_ME_LIVE_OFF`.
|
|
24
|
+
*/
|
|
25
|
+
export async function createLiveServer(options) {
|
|
26
|
+
const root = resolve(options.root);
|
|
27
|
+
const configFile = options.configFile === undefined ? findLiveConfigFile(root) : resolve(root, options.configFile);
|
|
28
|
+
const vite = await importLiveVite(root);
|
|
29
|
+
const loaded = await loadLiveConfig(vite, configFile, root);
|
|
30
|
+
const port = options.port ?? (await freeLivePort());
|
|
31
|
+
// With `configFile: false` Vite does not watch the config. An edit would
|
|
32
|
+
// restart the server and run the config again without the flag, in recording mode.
|
|
33
|
+
const server = await vite.createServer({
|
|
34
|
+
...vite.mergeConfig(loaded.config, {
|
|
35
|
+
root,
|
|
36
|
+
mode: 'test',
|
|
37
|
+
base: '/',
|
|
38
|
+
clearScreen: false,
|
|
39
|
+
logLevel: 'warn',
|
|
40
|
+
server: { host: 'localhost', port, strictPort: true, open: false },
|
|
41
|
+
}),
|
|
42
|
+
configFile: false,
|
|
43
|
+
});
|
|
44
|
+
const configName = relative(root, configFile) || configFile;
|
|
45
|
+
const { plugins } = server.config;
|
|
46
|
+
const protocol = await closingOnError(server, () => livePluginProtocol(plugins, configName));
|
|
47
|
+
await closingOnError(server, () => checkLiveEnabled(plugins, configName));
|
|
48
|
+
await closingOnError(server, () => server.listen());
|
|
49
|
+
const local = server.resolvedUrls?.local[0] ?? `http://localhost:${port}/`;
|
|
50
|
+
return {
|
|
51
|
+
base: new URL('__describe-me/', local).href,
|
|
52
|
+
protocol,
|
|
53
|
+
close: () => server.close(),
|
|
54
|
+
};
|
|
55
|
+
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { ViteUserConfig } from 'vitest/config';
|
|
2
|
+
import type { DescribeMeEnvironment } from './plugin.js';
|
|
3
|
+
/** The environment the tests run in, when the `environment` option does not say. */
|
|
4
|
+
export declare function detectEnvironment(userConfig: ViteUserConfig): DescribeMeEnvironment;
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { styledComponentsBrowserBuild } from './styled-components-browser-build.js';
|
|
2
|
+
/** DOM environments such as jsdom, where tests render through Testing Library. */
|
|
3
|
+
export const domProfile = {
|
|
4
|
+
renderModules: {
|
|
5
|
+
react: {
|
|
6
|
+
original: '@testing-library/react',
|
|
7
|
+
adapter: '@describe-me/react/testing-library',
|
|
8
|
+
live: '@describe-me/react/live-testing-library',
|
|
9
|
+
},
|
|
10
|
+
},
|
|
11
|
+
setupFile: '@describe-me/vitest/setup-dom',
|
|
12
|
+
// Testing Library would otherwise unmount in its own afterEach, before the
|
|
13
|
+
// closing frame is taken. The adapter unmounts through the recorder instead.
|
|
14
|
+
env: { RTL_SKIP_AUTO_CLEANUP: 'true' },
|
|
15
|
+
configFor({ userConfig, options }) {
|
|
16
|
+
const build = options.styledComponentsBrowserBuild === false
|
|
17
|
+
? undefined
|
|
18
|
+
: styledComponentsBrowserBuild(userConfig.root ?? process.cwd());
|
|
19
|
+
const userTest = userConfig.test;
|
|
20
|
+
const test = {};
|
|
21
|
+
// Vitest stubs CSS imports by default, which would leave every imported
|
|
22
|
+
// stylesheet out of the snapshots. An explicit choice by the user wins.
|
|
23
|
+
if (userTest?.css === undefined) {
|
|
24
|
+
test.css = true;
|
|
25
|
+
}
|
|
26
|
+
else if (userTest.css === false) {
|
|
27
|
+
console.warn('describe-me: `test.css` is false, so imported stylesheets are stubbed and will be missing from the snapshots.');
|
|
28
|
+
}
|
|
29
|
+
if (!build) {
|
|
30
|
+
return { config: { test }, setupWarnings: [] };
|
|
31
|
+
}
|
|
32
|
+
console.info('describe-me: using the browser build of styled-components, for createGlobalStyle');
|
|
33
|
+
return {
|
|
34
|
+
config: { resolve: build.config.resolve, test: { ...test, ...build.config.test } },
|
|
35
|
+
setupWarnings: build.warning ? [build.warning] : [],
|
|
36
|
+
};
|
|
37
|
+
},
|
|
38
|
+
};
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import type { ViteUserConfig } from 'vitest/config';
|
|
2
|
+
import type { DescribeMeOptions } from './plugin.js';
|
|
3
|
+
/** The render module tests import, and the modules that replace it. */
|
|
4
|
+
export interface RenderModule {
|
|
5
|
+
/** The module tests import `render` from. */
|
|
6
|
+
original: string;
|
|
7
|
+
/** Our recording adapter for it. */
|
|
8
|
+
adapter: string;
|
|
9
|
+
/** The live preview's stand-in for it, which mounts at the first render and stops the test. */
|
|
10
|
+
live: string;
|
|
11
|
+
}
|
|
12
|
+
/** What the plugin hands a profile when it asks for its config. */
|
|
13
|
+
export interface ProfileContext {
|
|
14
|
+
userConfig: ViteUserConfig;
|
|
15
|
+
options: DescribeMeOptions;
|
|
16
|
+
renderModule: RenderModule;
|
|
17
|
+
}
|
|
18
|
+
/** One environment's config, and the setup problems found while building it. */
|
|
19
|
+
export interface ProfileConfig {
|
|
20
|
+
config: ViteUserConfig;
|
|
21
|
+
/** Handed to the reporter, which writes them to the manifest. */
|
|
22
|
+
setupWarnings: string[];
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Everything describe-me does differently in one environment. The plugin
|
|
26
|
+
* picks a profile and adds what every environment shares.
|
|
27
|
+
*/
|
|
28
|
+
export interface EnvironmentProfile {
|
|
29
|
+
/** For each framework, the render module tests import and our adapter for it. */
|
|
30
|
+
renderModules: Record<NonNullable<DescribeMeOptions['framework']>, RenderModule>;
|
|
31
|
+
/** The setup file that patches interactions and registers the recording hooks. */
|
|
32
|
+
setupFile: string;
|
|
33
|
+
/**
|
|
34
|
+
* Variables the tests of a project with the setup file need. The plugin sets
|
|
35
|
+
* them per project and never in the root's `test.env`, which Vitest hands to
|
|
36
|
+
* every project, also to one without describe-me.
|
|
37
|
+
*/
|
|
38
|
+
env: Record<string, string>;
|
|
39
|
+
/** The rest of the environment's config, built in the plugin's `config` hook. */
|
|
40
|
+
configFor(context: ProfileContext): ProfileConfig;
|
|
41
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { existsSync } from 'node:fs';
|
|
2
|
+
import { join } from 'node:path';
|
|
3
|
+
const NAMES = ['vitest.config', 'vite.config'];
|
|
4
|
+
const EXTENSIONS = ['ts', 'mts', 'cts', 'js', 'mjs', 'cjs'];
|
|
5
|
+
/** The config file Vitest picks in `root` when none is named: `vitest.config.*`, then `vite.config.*`. */
|
|
6
|
+
export function findLiveConfigFile(root) {
|
|
7
|
+
for (const name of NAMES) {
|
|
8
|
+
for (const extension of EXTENSIONS) {
|
|
9
|
+
const file = join(root, `${name}.${extension}`);
|
|
10
|
+
if (existsSync(file)) {
|
|
11
|
+
return file;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
throw new Error(`describe-me: no Vitest or Vite config file in ${root}`);
|
|
16
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { LiveSuite, LiveTest } from './live-suite.js';
|
|
2
|
+
/** A registered test, with the suites around it from the root down. */
|
|
3
|
+
export interface LiveTestMatch {
|
|
4
|
+
test: LiveTest;
|
|
5
|
+
suites: LiveSuite[];
|
|
6
|
+
/** The suite names, outermost first, then the test name. The root has no name. */
|
|
7
|
+
path: string[];
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* The `occurrence`-th test whose suite path and name equal `path`, counted
|
|
11
|
+
* 1-based over the whole file like the stable test id, or null.
|
|
12
|
+
*/
|
|
13
|
+
export declare function findLiveTest(path: string[], occurrence: number): LiveTestMatch | null;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { liveRegistry } from './live-registry.js';
|
|
2
|
+
/** Every test, depth first in registration order, the order Vitest reports them in. */
|
|
3
|
+
function* testsIn(suite, suites, names) {
|
|
4
|
+
for (const child of suite.children) {
|
|
5
|
+
if (child.kind === 'test') {
|
|
6
|
+
yield { test: child, suites, path: [...names, child.name] };
|
|
7
|
+
}
|
|
8
|
+
else {
|
|
9
|
+
yield* testsIn(child, [...suites, child], [...names, child.name]);
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* The `occurrence`-th test whose suite path and name equal `path`, counted
|
|
15
|
+
* 1-based over the whole file like the stable test id, or null.
|
|
16
|
+
*/
|
|
17
|
+
export function findLiveTest(path, occurrence) {
|
|
18
|
+
const root = liveRegistry().root;
|
|
19
|
+
const wanted = JSON.stringify(path);
|
|
20
|
+
let seen = 0;
|
|
21
|
+
for (const match of testsIn(root, [root], [])) {
|
|
22
|
+
if (JSON.stringify(match.path) !== wanted) {
|
|
23
|
+
continue;
|
|
24
|
+
}
|
|
25
|
+
seen += 1;
|
|
26
|
+
if (seen === occurrence) {
|
|
27
|
+
return match;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
return null;
|
|
31
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { createServer } from 'node:net';
|
|
2
|
+
/**
|
|
3
|
+
* A port that is free on localhost right now. Older Vite majors keep `port: 0`
|
|
4
|
+
* in their resolved config, which breaks the address HMR falls back to.
|
|
5
|
+
*/
|
|
6
|
+
export function freeLivePort() {
|
|
7
|
+
return new Promise((resolvePort, reject) => {
|
|
8
|
+
const probe = createServer();
|
|
9
|
+
probe.once('error', reject);
|
|
10
|
+
probe.listen(0, 'localhost', () => {
|
|
11
|
+
const address = probe.address();
|
|
12
|
+
const port = typeof address === 'object' && address !== null ? address.port : 0;
|
|
13
|
+
probe.close(() => resolvePort(port));
|
|
14
|
+
});
|
|
15
|
+
});
|
|
16
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Vite } from 'vitest/node';
|
|
2
|
+
/**
|
|
3
|
+
* The project's own Vite, so its plugins run on the version they were made
|
|
4
|
+
* for. Always the ES module build: `require.resolve('vite')` can pick the
|
|
5
|
+
* CommonJS one of older majors.
|
|
6
|
+
*/
|
|
7
|
+
export declare function importLiveVite(root: string): Promise<typeof Vite>;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { readFileSync } from 'node:fs';
|
|
2
|
+
import { createRequire } from 'node:module';
|
|
3
|
+
import { dirname, join } from 'node:path';
|
|
4
|
+
import { pathToFileURL } from 'node:url';
|
|
5
|
+
/** The `package.json` of the project's Vite, or of the Vite its Vitest runs on. */
|
|
6
|
+
function vitePackageJson(root) {
|
|
7
|
+
const projectRequire = createRequire(join(root, 'package.json'));
|
|
8
|
+
try {
|
|
9
|
+
return projectRequire.resolve('vite/package.json');
|
|
10
|
+
}
|
|
11
|
+
catch {
|
|
12
|
+
// Not a direct dependency of the project. Vitest's own Vite runs the tests.
|
|
13
|
+
}
|
|
14
|
+
try {
|
|
15
|
+
const vitest = projectRequire.resolve('vitest/package.json');
|
|
16
|
+
return createRequire(vitest).resolve('vite/package.json');
|
|
17
|
+
}
|
|
18
|
+
catch {
|
|
19
|
+
throw new Error(`describe-me: cannot find vite from ${root}`);
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
/** The ES module entry of `exports['.']`: its `import` condition, or the string itself. */
|
|
23
|
+
function esmEntry(target) {
|
|
24
|
+
if (typeof target === 'string') {
|
|
25
|
+
return target;
|
|
26
|
+
}
|
|
27
|
+
if (typeof target !== 'object' || target === null) {
|
|
28
|
+
return null;
|
|
29
|
+
}
|
|
30
|
+
const conditions = target;
|
|
31
|
+
return esmEntry(conditions.import ?? conditions.default);
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* The project's own Vite, so its plugins run on the version they were made
|
|
35
|
+
* for. Always the ES module build: `require.resolve('vite')` can pick the
|
|
36
|
+
* CommonJS one of older majors.
|
|
37
|
+
*/
|
|
38
|
+
export async function importLiveVite(root) {
|
|
39
|
+
const packageJson = vitePackageJson(root);
|
|
40
|
+
const { exports } = JSON.parse(readFileSync(packageJson, 'utf8'));
|
|
41
|
+
const entry = esmEntry(exports?.['.']);
|
|
42
|
+
if (entry === null) {
|
|
43
|
+
throw new Error(`describe-me: cannot find the ES module entry of vite in ${packageJson}`);
|
|
44
|
+
}
|
|
45
|
+
return (await import(pathToFileURL(join(dirname(packageJson), entry)).href));
|
|
46
|
+
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { liveExport } from './live-export.js';
|
|
2
|
+
/** The names Vitest puts on `globalThis` with `test.globals`. */
|
|
3
|
+
const GLOBALS = [
|
|
4
|
+
'suite',
|
|
5
|
+
'test',
|
|
6
|
+
'describe',
|
|
7
|
+
'it',
|
|
8
|
+
'chai',
|
|
9
|
+
'expect',
|
|
10
|
+
'assert',
|
|
11
|
+
'expectTypeOf',
|
|
12
|
+
'assertType',
|
|
13
|
+
'vitest',
|
|
14
|
+
'vi',
|
|
15
|
+
'beforeAll',
|
|
16
|
+
'afterAll',
|
|
17
|
+
'beforeEach',
|
|
18
|
+
'afterEach',
|
|
19
|
+
'onTestFinished',
|
|
20
|
+
'onTestFailed',
|
|
21
|
+
'aroundEach',
|
|
22
|
+
'aroundAll',
|
|
23
|
+
];
|
|
24
|
+
/**
|
|
25
|
+
* Puts the shimmed globals on `globalThis`, as `test.globals` does. It runs
|
|
26
|
+
* before the test file imports, so Testing Library finds the hooks too.
|
|
27
|
+
*/
|
|
28
|
+
export function installLiveGlobals() {
|
|
29
|
+
const scope = globalThis;
|
|
30
|
+
for (const name of GLOBALS) {
|
|
31
|
+
scope[name] = liveExport('vitest', name);
|
|
32
|
+
}
|
|
33
|
+
}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Whether a module is one of the adapter's own files, whose imports of the
|
|
3
|
+
* original module must stay unredirected. `/node_modules/<package>/` is the
|
|
4
|
+
* fallback for when the project root could not resolve the package.
|
|
5
|
+
*/
|
|
6
|
+
export declare function isAdapterModule(id: string, adapterRoot: string | null, adapterPackage: string): boolean;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Whether a module is one of the adapter's own files, whose imports of the
|
|
3
|
+
* original module must stay unredirected. `/node_modules/<package>/` is the
|
|
4
|
+
* fallback for when the project root could not resolve the package.
|
|
5
|
+
*/
|
|
6
|
+
export function isAdapterModule(id, adapterRoot, adapterPackage) {
|
|
7
|
+
if (adapterRoot !== null && id.startsWith(adapterRoot)) {
|
|
8
|
+
return true;
|
|
9
|
+
}
|
|
10
|
+
return id.includes(`/node_modules/${adapterPackage}/`);
|
|
11
|
+
}
|