@describe-me/vitest 0.5.2 → 0.5.3

package/README.md

@@ -11,7 +11,7 @@ pnpm add -D @describe-me/vitest @describe-me/react describe-me
 ```
 
 All describe-me packages must be on the same version
-([Add it to your project](https://github.com/grzehub/describe-me#add-it-to-your-project)).
+([One version for all packages](https://grzehub.github.io/describe-me/installation.html#lockstep)).
 
 ## Usage
 
@@ -26,13 +26,16 @@ plugin detects where the tests run:
   `@testing-library/user-event` call, turns on `test.css` so imported
   stylesheets reach the snapshots, and sets `RTL_SKIP_AUTO_CLEANUP` so the
   component is unmounted only after the closing frame. The setup file sets
-  React's `IS_REACT_ACT_ENVIRONMENT` where Testing Library would and turns it
-  off while the recorder waits, so act warnings match a run without
-  describe-me. It also works without user-event installed.
+  React's `IS_REACT_ACT_ENVIRONMENT` where Testing Library would. With
+  `@testing-library/react`, it takes user-event frames without a wait. The
+  flag is off for the few waits that remain, which can still move an act
+  warning
+  ([jsdom](https://grzehub.github.io/describe-me/environments.html#jsdom)). It
+  also works without user-event installed.
 
 jsdom has no layout, so positioned popovers show in the top-left corner and
 canvas stays blank
-([Limitations in jsdom](https://github.com/grzehub/describe-me#limitations-in-jsdom)).
+([Limitations in jsdom](https://grzehub.github.io/describe-me/environments.html#jsdom-limits)).
 
 ```ts
 import { describeMe } from '@describe-me/vitest/plugin'
@@ -68,12 +71,12 @@ plugin the setup file does not know them.
 every frame's `<head>`, like Storybook's `preview-head.html`: typically the
 font links that the app shell loads and tests never do. It never reaches the
 test page, and the local files it links are copied into the output directory
-([Fonts](https://github.com/grzehub/describe-me#fonts) in the root README).
+([Fonts](https://grzehub.github.io/describe-me/styles-and-fonts.html#fonts) in the docs).
 
 `describeMe({ renderFrame })` chooses when the render frame is taken:
 `'eager'` (default) right after mount, `'lazy'` right before the next
 interaction, or `{ pending: '<selector>' }` once a loader is gone. See
-[Render frame timing](https://github.com/grzehub/describe-me#render-frame-timing).
+[Render frame timing](https://grzehub.github.io/describe-me/configuration.html#render-frame).
 
 The plugin adds its reporter to the ones your config names. If it names
 none, the reporter joins the ones Vitest picks on its own, such as `minimal`
@@ -102,5 +105,4 @@ export default defineConfig({
 the props tables are left out. `@testing-library/user-event` is an optional
 peer too, needed only in DOM environments.
 
-See the [root README](https://github.com/grzehub/describe-me#readme) for the
-full picture.
+See the [docs](https://grzehub.github.io/describe-me/) for the full picture.

package/dist/patch-testing-library-user-event.d.ts

@@ -3,7 +3,8 @@
  * It comes in two shapes, the direct API (`userEvent.click(el)`) and an
  * instance from `userEvent.setup()`, and the first delegates to the second,
  * so both are patched and `recordAction`'s depth guard keeps one gesture to
- * one frame. When the optional peer is not installed, there is nothing to
- * patch. Safe to call more than once.
+ * one frame. Under @testing-library/react a frame is taken as soon as the
+ * call resolves, otherwise after one settle. When the optional peer is not
+ * installed, there is nothing to patch. Safe to call more than once.
  */
 export declare function patchTestingLibraryUserEvent(): Promise<void>;

package/dist/patch-testing-library-user-event.js

@@ -1,6 +1,7 @@
 import { elementLabel } from '@describe-me/core';
 import { describeArg } from './describe-arg.js';
 import { recordAction } from './record-action.js';
+import { testingLibraryWrapsInAct } from './testing-library-wraps-in-act.js';
 /** Every interaction of user-event 14 that can change what the page shows. */
 const METHODS = [
     'click',
@@ -31,7 +32,11 @@ function patchMethods(target) {
         if (typeof original !== 'function' || original[PATCHED]) {
             continue;
         }
-        const wrapped = (...args) => recordAction(labelFor(method, args), async () => original.apply(target, args));
+        // Testing Library's wrappers commit the DOM before the call resolves. A settle
+        // would only move React updates into a wait with the act flag off.
+        const wrapped = (...args) => recordAction(labelFor(method, args), async () => original.apply(target, args), {
+            settle: !testingLibraryWrapsInAct(),
+        });
         wrapped[PATCHED] = true;
         target[method] = wrapped;
     }
@@ -41,8 +46,9 @@ function patchMethods(target) {
  * It comes in two shapes, the direct API (`userEvent.click(el)`) and an
  * instance from `userEvent.setup()`, and the first delegates to the second,
  * so both are patched and `recordAction`'s depth guard keeps one gesture to
- * one frame. When the optional peer is not installed, there is nothing to
- * patch. Safe to call more than once.
+ * one frame. Under @testing-library/react a frame is taken as soon as the
+ * call resolves, otherwise after one settle. When the optional peer is not
+ * installed, there is nothing to patch. Safe to call more than once.
  */
 export async function patchTestingLibraryUserEvent() {
     let userEvent;

package/dist/record-action.d.ts

@@ -1,2 +1,6 @@
-/** Run one user interaction and record a frame for it, but only for the outermost call. */
-export declare function recordAction<T>(label: string, run: () => Promise<T>): Promise<T>;
+import type { CaptureOptions } from '@describe-me/core';
+/**
+ * Run one user interaction and record a frame for it, but only for the outermost call.
+ * `settle: false` takes the frame as soon as the interaction resolves, without a wait.
+ */
+export declare function recordAction<T>(label: string, run: () => Promise<T>, options?: Pick<CaptureOptions, 'settle'>): Promise<T>;

package/dist/record-action.js

@@ -7,8 +7,11 @@ import { recorder } from '@describe-me/core';
  * test left running cannot swallow the next test's frame.
  */
 const nesting = { generation: -1, depth: 0 };
-/** Run one user interaction and record a frame for it, but only for the outermost call. */
-export async function recordAction(label, run) {
+/**
+ * Run one user interaction and record a frame for it, but only for the outermost call.
+ * `settle: false` takes the frame as soon as the interaction resolves, without a wait.
+ */
+export async function recordAction(label, run, options = {}) {
     const generation = recorder.generation;
     if (generation !== nesting.generation) {
         nesting.generation = generation;
@@ -26,7 +29,7 @@ export async function recordAction(label, run) {
         }
     }
     if (generation === nesting.generation && nesting.depth === 0) {
-        await recorder.capture('action', label, undefined, { generation });
+        await recorder.capture('action', label, undefined, { generation, settle: options.settle });
     }
     return result;
 }

package/dist/testing-library-wraps-in-act.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Whether @testing-library/dom still runs user-event calls through the
+ * `asyncWrapper` that @testing-library/react installed, so the DOM is committed
+ * when a call resolves. False when @describe-me/react/testing-library never loaded.
+ */
+export declare function testingLibraryWrapsInAct(): boolean;

package/dist/testing-library-wraps-in-act.js

@@ -0,0 +1,11 @@
+// `publish-testing-library-act.ts` in @describe-me/react writes this key.
+const ACT_CHECK = Symbol.for('describe-me.testing-library-act');
+/**
+ * Whether @testing-library/dom still runs user-event calls through the
+ * `asyncWrapper` that @testing-library/react installed, so the DOM is committed
+ * when a call resolves. False when @describe-me/react/testing-library never loaded.
+ */
+export function testingLibraryWrapsInAct() {
+    const check = globalThis[ACT_CHECK];
+    return typeof check === 'function' && check() === true;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@describe-me/vitest",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "description": "Vitest integration for describe-me: plugin, setup file and reporter",
   "keywords": [
     "vitest",
@@ -60,13 +60,13 @@
   "dependencies": {
     "picomatch": "^4.0.3",
     "std-env": "^4.0.0",
-    "@describe-me/core": "^0.5.2"
+    "@describe-me/core": "^0.5.3"
   },
   "peerDependencies": {
     "vitest": "^4.0.0 || ^5.0.0",
     "typescript": "^5.0.0 || ^6.0.0",
     "@testing-library/user-event": "^14.0.0",
-    "describe-me": "^0.5.2"
+    "describe-me": "^0.5.3"
   },
   "peerDependenciesMeta": {
     "typescript": {