@stencil/vitest 1.2.0 → 1.3.0

package/dist/core.d.ts

@@ -1,7 +1,7 @@
 import './testing/matchers.js';
 import './testing/snapshot-serializer.js';
 export { h } from '@stencil/core';
-export { render } from './testing/render.js';
+export { render, waitForStable } from './testing/render.js';
 export { serializeHtml, prettifyHtml, SerializeOptions } from './testing/html-serializer.js';
 export type { RenderOptions, RenderResult } from './types.js';
 //# sourceMappingURL=core.d.ts.map

package/dist/core.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../src/core.ts"],"names":[],"mappings":"AACA,OAAO,uBAAuB,CAAC;AAC/B,OAAO,kCAAkC,CAAC;AAE1C,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAC7F,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../src/core.ts"],"names":[],"mappings":"AACA,OAAO,uBAAuB,CAAC;AAC/B,OAAO,kCAAkC,CAAC;AAE1C,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAClC,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAC7F,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC"}

package/dist/core.js

@@ -2,5 +2,5 @@
 import './testing/matchers.js';
 import './testing/snapshot-serializer.js';
 export { h } from '@stencil/core';
-export { render } from './testing/render.js';
+export { render, waitForStable } from './testing/render.js';
 export { serializeHtml, prettifyHtml } from './testing/html-serializer.js';

package/dist/testing/render.d.ts

@@ -15,6 +15,12 @@ interface RenderOptions {
      */
     waitForReady?: boolean;
 }
+/**
+ * Poll until element has dimensions (is rendered/visible in real browser).
+ * Accepts either an Element or a CSS selector string.
+ * If a selector is provided, waits for the element to appear in the DOM first.
+ */
+export declare function waitForStable(elementOrSelector: Element | string, timeout?: number): Promise<void>;
 /**
  * Render using Stencil's render
  */

package/dist/testing/render.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/testing/render.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAY,MAAM,aAAa,CAAC;AAE1D,UAAU,aAAa;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAwCD;;GAEG;AACH,wBAAsB,MAAM,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,CAAC,GAAG,GAAG,EACvE,KAAK,EAAE,GAAG,EACV,OAAO,GAAE,aAGR,GACA,OAAO,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CA6I7B"}
+{"version":3,"file":"render.d.ts","sourceRoot":"","sources":["../../src/testing/render.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAY,MAAM,aAAa,CAAC;AAE1D,UAAU,aAAa;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACpC;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAyBD;;;;GAIG;AACH,wBAAsB,aAAa,CAAC,iBAAiB,EAAE,OAAO,GAAG,MAAM,EAAE,OAAO,SAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAiCtG;AAED;;GAEG;AACH,wBAAsB,MAAM,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,CAAC,GAAG,GAAG,EACvE,KAAK,EAAE,GAAG,EACV,OAAO,GAAE,aAGR,GACA,OAAO,CAAC,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CA6I7B"}

package/dist/testing/render.js

@@ -22,18 +22,37 @@ function isRealBrowser() {
     return true;
 }
 /**
- * Poll until element has dimensions (is rendered/visible in real browser)
+ * Poll until element has dimensions (is rendered/visible in real browser).
+ * Accepts either an Element or a CSS selector string.
+ * If a selector is provided, waits for the element to appear in the DOM first.
  */
-async function waitForRendered(element, timeout = 5000) {
+export async function waitForStable(elementOrSelector, timeout = 5000) {
+    if (!isRealBrowser()) {
+        console.warn('[waitForStable] Only works in real browser environments');
+        return;
+    }
     const start = Date.now();
+    // Resolve element from selector if needed
+    let element = typeof elementOrSelector === 'string' ? null : elementOrSelector;
+    // If an Element was passed, verify it's in the DOM
+    if (element && !document.contains(element)) {
+        console.warn('[waitForStable] Element is not attached to the DOM');
+    }
     while (Date.now() - start < timeout) {
-        const rect = element.getBoundingClientRect();
-        if (rect.width > 0 && rect.height > 0) {
-            return;
+        // If we have a selector, try to find the element
+        if (typeof elementOrSelector === 'string' && !element) {
+            element = document.querySelector(elementOrSelector);
+        }
+        // If we have an element, check if it has dimensions
+        if (element) {
+            const rect = element.getBoundingClientRect();
+            if (rect.width > 0 && rect.height > 0) {
+                return;
+            }
         }
         await new Promise((r) => requestAnimationFrame(r));
     }
-    // Don't throw on timeout - element might be intentionally zero-sized
+    // Don't throw on timeout - element might be intentionally zero-sized or not found
 }
 /**
  * Render using Stencil's render
@@ -99,7 +118,7 @@ export async function render(vnode, options = {
     if (options.waitForReady !== false) {
         if (isRealBrowser()) {
             // In real browser, poll until element has dimensions
-            await waitForRendered(element);
+            await waitForStable(element);
         }
         // Always wait for Stencil's update cycle to complete
         await waitForChanges();

package/package.json

@@ -4,7 +4,7 @@
     "type": "git",
     "url": "https://github.com/stenciljs/vitest"
   },
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "First-class testing utilities for Stencil design systems with Vitest",
   "license": "MIT",
   "type": "module",
@@ -97,7 +97,7 @@
   "dependencies": {
     "jiti": "^2.6.1",
     "local-pkg": "^1.1.2",
-    "vitest-environment-stencil": "1.2.0"
+    "vitest-environment-stencil": "1.3.0"
   },
   "devDependencies": {
     "@eslint/js": "^9.39.2",