@stencil/vitest 0.1.0 → 0.1.2

package/dist/bin/stencil-test.js

@@ -1,8 +1,5 @@
 #!/usr/bin/env node
 import { spawn } from 'child_process';
-import { existsSync, unlinkSync, writeFileSync } from 'fs';
-import { join } from 'path';
-import { createJiti } from 'jiti';
 function parseArgs(argv) {
     const parsed = {
         watch: false,
@@ -40,10 +37,6 @@ function parseArgs(argv) {
                 parsed.port = argv[i + 1];
                 i += 2;
                 break;
-            case '--stencil-config':
-                parsed.stencilConfig = argv[i + 1];
-                i += 2;
-                break;
             case '--verbose':
             case '-v':
                 parsed.verbose = true;
@@ -123,13 +116,12 @@ Default (no flags): Build Stencil in dev mode and run tests once
 Watch mode: Build Stencil in watch mode and run Vitest with interactive features
 
 Stencil Options:
-  --watch                  Run Stencil in watch mode (enables Vitest interactive mode)
-  --prod                   Build in production mode (default: dev mode)
-  --serve                  Start dev server (requires --watch)
-  --port <number>          Dev server port (default: 3333)
-  --stencil-config <path>  Path to stencil config file
-  --verbose, -v            Show detailed logging
-  --debug                  Enable Stencil debug mode
+  --watch              Run Stencil in watch mode (enables Vitest interactive mode)
+  --prod               Build in production mode (default: dev mode)
+  --serve              Start dev server (requires --watch)
+  --port <number>      Dev server port (default: 3333)
+  --verbose, -v        Show detailed logging
+  --debug              Enable Stencil debug mode
 
 Vitest Options:
   --project <name>     Run tests for specific project
@@ -264,161 +256,6 @@ function handleStencilOutput(data) {
         }
     }
 }
-/**
- * Extracts screenshot directory patterns from vitest config to ignore in Stencil watch
- */
-async function getScreenshotPatternsFromVitestConfig(customVitestConfig) {
-    const patterns = [];
-    try {
-        let vitestConfigPath;
-        // Use custom config if provided via --config flag
-        if (customVitestConfig) {
-            const resolvedPath = join(cwd, customVitestConfig);
-            if (existsSync(resolvedPath)) {
-                vitestConfigPath = resolvedPath;
-            }
-            else if (verbose) {
-                log(`Specified vitest config not found: ${customVitestConfig}, falling back to defaults`);
-            }
-        }
-        // Look for vitest.config.ts/js in common locations if no custom config
-        if (!vitestConfigPath) {
-            const possibleConfigs = [
-                join(cwd, 'vitest.config.ts'),
-                join(cwd, 'vitest.config.js'),
-                join(cwd, 'vitest.config.mjs'),
-            ];
-            vitestConfigPath = possibleConfigs.find(existsSync);
-        }
-        if (!vitestConfigPath) {
-            if (verbose) {
-                log('No vitest config found, using default screenshot patterns');
-            }
-            // Return sensible defaults
-            return [/__screenshots__/, /__snapshots__/, /\.(png|jpg|jpeg|webp|gif)$/];
-        }
-        if (verbose) {
-            log(`Loading vitest config from ${vitestConfigPath}`);
-        }
-        // Use jiti to load TypeScript/ESM config
-        const jiti = createJiti(cwd, { interopDefault: true });
-        const vitestConfig = await jiti.import(vitestConfigPath);
-        // Extract screenshot directory from browser test config
-        const projects = vitestConfig?.default?.test?.projects || vitestConfig?.test?.projects || [];
-        const customScreenshotDirs = new Set();
-        for (const project of projects) {
-            const browserConfig = project?.test?.browser;
-            if (browserConfig?.enabled) {
-                const screenshotDir = browserConfig.expect?.toMatchScreenshot?.screenshotDirectory;
-                if (screenshotDir) {
-                    customScreenshotDirs.add(screenshotDir);
-                }
-            }
-        }
-        // Add custom screenshot directories if found
-        for (const dir of customScreenshotDirs) {
-            patterns.push(new RegExp(`/${dir.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}/`));
-        }
-        // Always add default screenshot and snapshot directories
-        patterns.push(/__screenshots__/);
-        patterns.push(/__snapshots__/);
-        patterns.push(/\.vitest-attachments/);
-        // Always add common image extensions
-        patterns.push(/\.(png|jpg|jpeg|webp|gif)$/);
-        if (verbose && patterns.length > 0) {
-            log(`Extracted ${patterns.length} screenshot patterns from vitest config`);
-        }
-    }
-    catch (error) {
-        if (verbose) {
-            log(`Failed to parse vitest config: ${error instanceof Error ? error.message : String(error)}`);
-            log('Using default screenshot patterns');
-        }
-        // Fallback to sensible defaults
-        return [/__screenshots__/, /__snapshots__/, /\.(png|jpg|jpeg|webp|gif)$/];
-    }
-    return patterns.length > 0 ? patterns : [/__screenshots__/, /__snapshots__/, /\.(png|jpg|jpeg|webp|gif)$/];
-}
-/**
- * Creates a temporary stencil config that extends the user's config
- * and adds watchIgnoredRegex patterns for screenshots
- */
-async function createTemporaryStencilConfig(userSpecifiedConfig, vitestConfigPath) {
-    try {
-        let userConfigPath;
-        // Use user-specified config if provided
-        if (userSpecifiedConfig) {
-            const resolvedPath = join(cwd, userSpecifiedConfig);
-            if (existsSync(resolvedPath)) {
-                userConfigPath = resolvedPath;
-            }
-            else {
-                if (verbose) {
-                    log(`Specified config file not found: ${userSpecifiedConfig}`);
-                }
-                return null;
-            }
-        }
-        else {
-            // Find the user's stencil config using default locations
-            const possibleConfigs = [
-                join(cwd, 'stencil.config.ts'),
-                join(cwd, 'stencil.config.js'),
-                join(cwd, 'stencil.config.mjs'),
-            ];
-            userConfigPath = possibleConfigs.find(existsSync);
-            if (!userConfigPath) {
-                if (verbose) {
-                    log('No stencil config found, skipping watchIgnoredRegex injection');
-                }
-                return null;
-            }
-        }
-        // Get screenshot patterns to ignore
-        const screenshotPatterns = await getScreenshotPatternsFromVitestConfig(vitestConfigPath);
-        // Load the user's config using jiti
-        const jiti = createJiti(cwd, { interopDefault: true });
-        const userConfig = await jiti.import(userConfigPath);
-        // Extract the actual config object
-        const actualConfig = userConfig.config || userConfig.default?.config || userConfig.default || userConfig;
-        // Merge with watchIgnoredRegex
-        const mergedConfig = {
-            ...actualConfig,
-            watchIgnoredRegex: [...(actualConfig?.watchIgnoredRegex || []), ...screenshotPatterns],
-        };
-        // Create temp file as sibling of stencil.config so tsconfig.json can be found
-        // Stencil looks for tsconfig.json relative to the config file location
-        const tempConfigPath = join(cwd, `.stencil-test-${Date.now()}.config.mjs`);
-        // Serialize the config - convert RegExp objects to strings for the output
-        const patternsArray = mergedConfig.watchIgnoredRegex.map((pattern) => pattern.toString()).join(',\n    ');
-        // Create config without watchIgnoredRegex first
-        const { _watchIgnoredRegex, ...configWithoutWatch } = mergedConfig;
-        // Generate a simple config that doesn't need imports
-        const tempConfigContent = `
-// Auto-generated temporary config by stencil-test
-// This extends your stencil config and adds watchIgnoredRegex for screenshot files
-export const config = {
-${JSON.stringify(configWithoutWatch, null, 2).slice(2, -2)},
-  "watchIgnoredRegex": [
-    ${patternsArray}
-  ]
-};
-`;
-        writeFileSync(tempConfigPath, tempConfigContent, 'utf-8');
-        if (verbose) {
-            log(`Created temporary stencil config at ${tempConfigPath}`);
-            log(`Added ${screenshotPatterns.length} watch ignore patterns`);
-        }
-        return tempConfigPath;
-    }
-    catch (error) {
-        if (verbose) {
-            log(`Failed to create temporary config: ${error instanceof Error ? error.message : String(error)}`);
-        }
-        return null;
-    }
-}
-let tempStencilConfigPath = null;
 /**
  * Clean up child processes and optionally exit with code.
  */
@@ -435,18 +272,6 @@ function cleanup(exitCode) {
         stencilProcess.kill();
         stencilProcess = null;
     }
-    // Clean up temporary config file
-    if (tempStencilConfigPath && existsSync(tempStencilConfigPath)) {
-        try {
-            unlinkSync(tempStencilConfigPath);
-            if (verbose) {
-                log('Cleaned up temporary stencil config');
-            }
-        }
-        catch {
-            // Ignore cleanup errors
-        }
-    }
     if (typeof exitCode === 'number') {
         process.exit(exitCode);
     }
@@ -454,94 +279,63 @@ function cleanup(exitCode) {
 // Set up signal handlers for clean shutdown
 process.on('SIGINT', () => cleanup());
 process.on('SIGTERM', () => cleanup());
-// Main async function to setup and start the processes
-(async () => {
-    // Extract vitest --config path if provided
-    let vitestConfigPath;
-    const configIndex = args.vitestArgs.indexOf('--config');
-    if (configIndex !== -1 && configIndex + 1 < args.vitestArgs.length) {
-        vitestConfigPath = args.vitestArgs[configIndex + 1];
-    }
-    // Create temporary stencil config in watch mode to prevent screenshot infinite loops
-    if (args.watch) {
-        tempStencilConfigPath = await createTemporaryStencilConfig(args.stencilConfig, vitestConfigPath);
-    }
-    // Build Stencil arguments
-    const stencilArgs = ['stencil', 'build'];
-    // Add --dev by default, unless --prod is explicitly passed
-    if (args.prod) {
-        stencilArgs.push('--prod');
-    }
-    else {
-        stencilArgs.push('--dev');
-    }
-    if (args.watch) {
-        stencilArgs.push('--watch');
-        log('Starting Stencil in watch mode...');
-        // Use temporary config if created, otherwise use user-specified config
-        if (tempStencilConfigPath) {
-            stencilArgs.push('--config', tempStencilConfigPath);
-            if (verbose) {
-                log('Using temporary config with screenshot ignore patterns');
-            }
-        }
-        else if (args.stencilConfig) {
-            // If temp config creation failed but user specified a config, use it directly
-            stencilArgs.push('--config', args.stencilConfig);
-        }
-        if (args.serve) {
-            stencilArgs.push('--serve');
-            if (args.port) {
-                stencilArgs.push('--port', args.port);
-            }
+// Build Stencil arguments
+const stencilArgs = ['stencil', 'build'];
+// Add --dev by default, unless --prod is explicitly passed
+if (args.prod) {
+    stencilArgs.push('--prod');
+}
+else {
+    stencilArgs.push('--dev');
+}
+if (args.watch) {
+    stencilArgs.push('--watch');
+    log('Starting Stencil in watch mode...');
+    if (args.serve) {
+        stencilArgs.push('--serve');
+        if (args.port) {
+            stencilArgs.push('--port', args.port);
         }
     }
-    else {
-        log('Building Stencil...');
-        // In non-watch mode, just pass through the user's config if specified
-        if (args.stencilConfig) {
-            stencilArgs.push('--config', args.stencilConfig);
-        }
+}
+else {
+    log('Building Stencil...');
+}
+if (args.debug) {
+    stencilArgs.push('--debug');
+}
+// Add any additional stencil args
+stencilArgs.push(...args.stencilArgs);
+stencilProcess = spawn('npx', stencilArgs, {
+    cwd,
+    shell: true,
+});
+// Pipe stdout and watch for build completion
+stencilProcess.stdout?.on('data', handleStencilOutput);
+stencilProcess.stderr?.on('data', (data) => {
+    process.stderr.write(data);
+});
+stencilProcess.on('error', (error) => {
+    console.error('[stencil-test] Failed to start Stencil:', error);
+    process.exit(1);
+});
+stencilProcess.on('exit', (code) => {
+    if (verbose) {
+        log(`Stencil exited with code ${code}`);
     }
-    if (args.debug) {
-        stencilArgs.push('--debug');
+    // In one-time build mode, stencil exits after build
+    // Don't cleanup immediately - let tests finish first
+    if (!args.watch) {
+        stencilProcess = null;
     }
-    // Add any additional stencil args
-    stencilArgs.push(...args.stencilArgs);
-    stencilProcess = spawn('npx', stencilArgs, {
-        cwd,
-        shell: true,
-    });
-    // Pipe stdout and watch for build completion
-    stencilProcess.stdout?.on('data', handleStencilOutput);
-    stencilProcess.stderr?.on('data', (data) => {
-        process.stderr.write(data);
-    });
-    stencilProcess.on('error', (error) => {
-        console.error('[stencil-test] Failed to start Stencil:', error);
-        process.exit(1);
-    });
-    stencilProcess.on('exit', (code) => {
-        if (verbose) {
-            log(`Stencil exited with code ${code}`);
-        }
-        // In one-time build mode, stencil exits after build
-        // Don't cleanup immediately - let tests finish first
-        if (!args.watch) {
-            stencilProcess = null;
-        }
-        else {
-            // In watch mode, stencil shouldn't exit - if it does, something went wrong
-            log(`Stencil exited unexpectedly with code ${code}`);
-            cleanup(code || 1);
-        }
-    });
-    // Watch mode: Vitest handles test file watching automatically
-    // Stencil handles component file watching automatically
-    if (args.watch && verbose) {
-        log('Watch mode enabled - Vitest will watch test files and Stencil will watch component files');
+    else {
+        // In watch mode, stencil shouldn't exit - if it does, something went wrong
+        log(`Stencil exited unexpectedly with code ${code}`);
+        cleanup(code || 1);
     }
-})().catch((error) => {
-    console.error('[stencil-test] Fatal error:', error);
-    cleanup(1);
 });
+// Watch mode: Vitest handles test file watching automatically
+// Stencil handles component file watching automatically
+if (args.watch && verbose) {
+    log('Watch mode enabled - Vitest will watch test files and Stencil will watch component files');
+}

package/dist/testing/happy-dom-setup.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Setup file for happy-dom environment
+ * Auto-loaded when using a project named 'happy-dom' or containing 'happy-dom'
+ *
+ * Configures happy-dom with Stencil-specific setup
+ * happy-dom generally has better built-in support than jsdom, so fewer polyfills are needed
+ */
+/**
+ * Main setup function for happy-dom environment
+ */
+export declare function setup(): Promise<void>;
+//# sourceMappingURL=happy-dom-setup.d.ts.map

package/dist/testing/happy-dom-setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"happy-dom-setup.d.ts","sourceRoot":"","sources":["../../src/testing/happy-dom-setup.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH;;GAEG;AACH,wBAAsB,KAAK,kBAG1B"}

package/dist/testing/happy-dom-setup.js

@@ -0,0 +1,16 @@
+/**
+ * Setup file for happy-dom environment
+ * Auto-loaded when using a project named 'happy-dom' or containing 'happy-dom'
+ *
+ * Configures happy-dom with Stencil-specific setup
+ * happy-dom generally has better built-in support than jsdom, so fewer polyfills are needed
+ */
+/**
+ * Main setup function for happy-dom environment
+ */
+export async function setup() {
+    // happy-dom is generally more complete than jsdom out of the box
+    // Add polyfills here as needed when issues are discovered
+}
+// Auto-run setup
+setup();

package/dist/testing/jsdom-setup.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Setup jsdom environment for Stencil component testing
+ *
+ * This module provides polyfills and initialization for testing Stencil components
+ * in a jsdom environment. It handles:
+ * - Polyfilling adoptedStyleSheets for Shadow DOM
+ * - Polyfilling CSS support detection
+ * - Polyfilling requestAnimationFrame and related APIs
+ * - Loading and initializing Stencil lazy loader
+ *
+ * @example
+ * ```ts
+ * // vitest.config.ts
+ * export default defineVitestConfig({
+ *   test: {
+ *     setupFiles: ['@stencil/test-utils/jsdom-setup'],
+ *   },
+ * });
+ * ```
+ */
+/**
+ * Apply polyfills to a jsdom window object for Stencil components
+ * This function is reused by both the setup file and the custom environment
+ */
+export declare function applyJsdomPolyfills(window: Window & typeof globalThis): void;
+/**
+ * Initialize jsdom environment for Stencil testing
+ */
+export declare function setup(): Promise<void>;
+//# sourceMappingURL=jsdom-setup.d.ts.map

package/dist/testing/jsdom-setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"jsdom-setup.d.ts","sourceRoot":"","sources":["../../src/testing/jsdom-setup.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,UAAU,QA2DrE;AAED;;GAEG;AACH,wBAAsB,KAAK,kBAa1B"}

package/dist/testing/jsdom-setup.js

@@ -0,0 +1,95 @@
+/**
+ * Setup jsdom environment for Stencil component testing
+ *
+ * This module provides polyfills and initialization for testing Stencil components
+ * in a jsdom environment. It handles:
+ * - Polyfilling adoptedStyleSheets for Shadow DOM
+ * - Polyfilling CSS support detection
+ * - Polyfilling requestAnimationFrame and related APIs
+ * - Loading and initializing Stencil lazy loader
+ *
+ * @example
+ * ```ts
+ * // vitest.config.ts
+ * export default defineVitestConfig({
+ *   test: {
+ *     setupFiles: ['@stencil/test-utils/jsdom-setup'],
+ *   },
+ * });
+ * ```
+ */
+/**
+ * Apply polyfills to a jsdom window object for Stencil components
+ * This function is reused by both the setup file and the custom environment
+ */
+export function applyJsdomPolyfills(window) {
+    // Polyfill adoptedStyleSheets for Shadow DOM
+    if (!window.document.adoptedStyleSheets) {
+        Object.defineProperty(window.document, 'adoptedStyleSheets', {
+            value: [],
+            writable: true,
+            configurable: true,
+        });
+    }
+    if (typeof window.ShadowRoot !== 'undefined' &&
+        !Object.prototype.hasOwnProperty.call(window.ShadowRoot.prototype, 'adoptedStyleSheets')) {
+        Object.defineProperty(window.ShadowRoot.prototype, 'adoptedStyleSheets', {
+            get() {
+                if (!this._adoptedStyleSheets) {
+                    this._adoptedStyleSheets = [];
+                }
+                return this._adoptedStyleSheets;
+            },
+            set(value) {
+                this._adoptedStyleSheets = value;
+            },
+            configurable: true,
+        });
+    }
+    // Polyfill CSS support
+    if (!window.CSS) {
+        window.CSS = {
+            supports: () => true,
+        };
+    }
+    // Polyfill scrollTo
+    window.scrollTo = () => { };
+    // Add requestAnimationFrame and related APIs
+    if (!window.requestAnimationFrame) {
+        window.requestAnimationFrame = (cb) => {
+            return setTimeout(cb, 0);
+        };
+    }
+    if (!window.cancelAnimationFrame) {
+        window.cancelAnimationFrame = (id) => {
+            clearTimeout(id);
+        };
+    }
+    if (!window.requestIdleCallback) {
+        window.requestIdleCallback = (cb) => {
+            return setTimeout(cb, 0);
+        };
+    }
+    if (!window.cancelIdleCallback) {
+        window.cancelIdleCallback = (id) => {
+            clearTimeout(id);
+        };
+    }
+}
+/**
+ * Initialize jsdom environment for Stencil testing
+ */
+export async function setup() {
+    // Only run in jsdom environment (Node.js with DOM)
+    if (typeof window === 'undefined' || typeof document === 'undefined') {
+        return;
+    }
+    // Skip if running in actual browser (Playwright, WebdriverIO, etc.)
+    // In actual browsers, process is undefined or doesn't have cwd
+    if (typeof process === 'undefined' || typeof process.cwd !== 'function') {
+        return;
+    }
+    applyJsdomPolyfills(window);
+}
+// Auto-run setup when imported
+setup();

package/dist/testing/mock-doc-setup.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Setup for mock-doc environment
+ * This file is automatically loaded when using the mock-doc environment in Node.js
+ *
+ * IMPORTANT: This should only be imported/executed in Node.js runtime, not in browsers.
+ * The projects-based config ensures this is only loaded for node:mock-doc projects.
+ */
+import { setupGlobal, teardownGlobal } from '@stencil/core/mock-doc';
+/**
+ * Apply polyfills to a window object for Stencil components
+ * This function is reused by both the setup file and the custom environment
+ */
+export declare function applyMockDocPolyfills(win: any): void;
+declare let win: any;
+declare let doc: any;
+export { win, doc, setupGlobal, teardownGlobal };
+//# sourceMappingURL=mock-doc-setup.d.ts.map

package/dist/testing/mock-doc-setup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mock-doc-setup.d.ts","sourceRoot":"","sources":["../../src/testing/mock-doc-setup.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAc,WAAW,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAEjF;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,GAAG,EAAE,GAAG,QAmD7C;AAOD,QAAA,IAAI,GAAG,EAAE,GAAG,CAAC;AACb,QAAA,IAAI,GAAG,EAAE,GAAG,CAAC;AA6Bb,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,WAAW,EAAE,cAAc,EAAE,CAAC"}

package/dist/testing/mock-doc-setup.js

@@ -0,0 +1,90 @@
+/**
+ * Setup for mock-doc environment
+ * This file is automatically loaded when using the mock-doc environment in Node.js
+ *
+ * IMPORTANT: This should only be imported/executed in Node.js runtime, not in browsers.
+ * The projects-based config ensures this is only loaded for node:mock-doc projects.
+ */
+import { MockWindow, setupGlobal, teardownGlobal } from '@stencil/core/mock-doc';
+/**
+ * Apply polyfills to a window object for Stencil components
+ * This function is reused by both the setup file and the custom environment
+ */
+export function applyMockDocPolyfills(win) {
+    // Set baseURI manually
+    Object.defineProperty(win.document, 'baseURI', {
+        value: 'http://localhost:3000/',
+        writable: false,
+        configurable: true,
+    });
+    // Setup global with mock-doc globals
+    setupGlobal(win);
+    // Add MessageEvent if it doesn't exist (needed by Node's undici)
+    if (!win.MessageEvent) {
+        win.MessageEvent = class MessageEvent extends win.Event {
+            constructor(type, eventInitDict) {
+                super(type, eventInitDict);
+            }
+        };
+    }
+    // Add AbortController if it doesn't exist
+    if (!win.AbortController) {
+        win.AbortController = class AbortController {
+            constructor() {
+                this.signal = {
+                    aborted: false,
+                    addEventListener: () => { },
+                    removeEventListener: () => { },
+                    dispatchEvent: () => true,
+                };
+            }
+            abort() {
+                this.signal.aborted = true;
+            }
+        };
+    }
+    // Add requestAnimationFrame and related APIs
+    win.requestAnimationFrame = (cb) => {
+        return setTimeout(cb, 0);
+    };
+    win.cancelAnimationFrame = (id) => {
+        clearTimeout(id);
+    };
+    win.requestIdleCallback = (cb) => {
+        return setTimeout(cb, 0);
+    };
+    win.cancelIdleCallback = (id) => {
+        clearTimeout(id);
+    };
+}
+// Only setup mock-doc if we're actually in Node.js (not a real browser)
+// Check for Node.js-specific globals that don't exist in browsers
+const isNodeEnvironment = typeof process !== 'undefined' && process?.versions?.node !== undefined && typeof window === 'undefined';
+let win;
+let doc;
+if (!isNodeEnvironment) {
+    // We're in a real browser, skip mock-doc setup and export real globals
+    win = typeof window !== 'undefined' ? window : undefined;
+    doc = typeof document !== 'undefined' ? document : undefined;
+}
+else {
+    // We're in Node.js, setup mock-doc
+    // Create mock window with URL
+    win = new MockWindow('http://localhost:3000/');
+    doc = win.document;
+    // Apply polyfills
+    applyMockDocPolyfills(win);
+    // Assign to globalThis
+    globalThis.window = win;
+    globalThis.document = doc;
+    globalThis.HTMLElement = win.HTMLElement;
+    globalThis.CustomEvent = win.CustomEvent;
+    globalThis.Event = win.Event;
+    globalThis.Element = win.Element;
+    globalThis.Node = win.Node;
+    globalThis.DocumentFragment = win.DocumentFragment;
+    globalThis.requestAnimationFrame = win.requestAnimationFrame;
+    globalThis.cancelAnimationFrame = win.cancelAnimationFrame;
+}
+// Export the mock window for use in custom setup
+export { win, doc, setupGlobal, teardownGlobal };

package/dist/utils/config-loader.d.ts

@@ -0,0 +1,19 @@
+import type { Config as StencilConfig } from '@stencil/core/internal';
+/**
+ * Load Stencil configuration from a file path
+ * Uses jiti to handle TypeScript files in Node.js
+ */
+export declare function loadStencilConfig(configPath: string): Promise<StencilConfig | undefined>;
+/**
+ * Get the source directory from Stencil config
+ */
+export declare function getStencilSrcDir(config?: StencilConfig): string;
+/**
+ * Get all output directories from Stencil config for exclusion
+ */
+export declare function getStencilOutputDirs(config?: StencilConfig): string[];
+/**
+ * Create resolve aliases from Stencil config
+ */
+export declare function getStencilResolveAliases(config?: StencilConfig): Record<string, string>;
+//# sourceMappingURL=config-loader.d.ts.map

package/dist/utils/config-loader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"config-loader.d.ts","sourceRoot":"","sources":["../../src/utils/config-loader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAItE;;;GAGG;AACH,wBAAsB,iBAAiB,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC,aAAa,GAAG,SAAS,CAAC,CAsB9F;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,CAAC,EAAE,aAAa,GAAG,MAAM,CAE/D;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,MAAM,CAAC,EAAE,aAAa,GAAG,MAAM,EAAE,CAyCrE;AAED;;GAEG;AACH,wBAAgB,wBAAwB,CAAC,MAAM,CAAC,EAAE,aAAa,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAmBvF"}

package/dist/utils/config-loader.js

@@ -0,0 +1,92 @@
+import { existsSync } from 'fs';
+import { resolve } from 'path';
+/**
+ * Load Stencil configuration from a file path
+ * Uses jiti to handle TypeScript files in Node.js
+ */
+export async function loadStencilConfig(configPath) {
+    const resolvedPath = resolve(process.cwd(), configPath);
+    if (!existsSync(resolvedPath)) {
+        console.warn(`Stencil config not found at ${resolvedPath}`);
+        return undefined;
+    }
+    try {
+        // Use jiti for loading TypeScript configs in Node.js
+        const { createJiti } = await import('jiti');
+        const jiti = createJiti(process.cwd(), {
+            interopDefault: true,
+            moduleCache: false,
+        });
+        const configModule = (await jiti.import(resolvedPath));
+        return configModule.config || configModule.default || configModule;
+    }
+    catch (error) {
+        console.error(`Failed to load Stencil config from ${resolvedPath}:`, error);
+        return undefined;
+    }
+}
+/**
+ * Get the source directory from Stencil config
+ */
+export function getStencilSrcDir(config) {
+    return config?.srcDir || 'src';
+}
+/**
+ * Get all output directories from Stencil config for exclusion
+ */
+export function getStencilOutputDirs(config) {
+    if (!config?.outputTargets) {
+        return ['dist', 'www', 'build', '.stencil'];
+    }
+    const outputDirs = new Set();
+    config.outputTargets.forEach((target) => {
+        // Add common output directories based on target type
+        if (target.dir) {
+            outputDirs.add(target.dir);
+        }
+        if (target.buildDir) {
+            outputDirs.add(target.buildDir);
+        }
+        // Handle Stencil default directories for output types that don't specify dir
+        // Based on Stencil's default behavior:
+        if (target.type === 'dist' || target.type === 'dist-custom-elements' || target.type === 'dist-hydrate-script') {
+            // These all default to 'dist' directory
+            if (!target.dir && !target.buildDir) {
+                outputDirs.add('dist');
+            }
+        }
+        if (target.type === 'www') {
+            // www defaults to 'www' directory
+            if (!target.dir && !target.buildDir) {
+                outputDirs.add('www');
+            }
+        }
+        // Note: esmLoaderPath is a relative import path like '../loader', not a directory
+        // We should NOT extract this as an exclude pattern
+    });
+    // Always include common output directories
+    outputDirs.add('.stencil');
+    // Filter out invalid paths (those that navigate up with ..)
+    const validDirs = Array.from(outputDirs).filter((dir) => !dir.includes('..'));
+    return validDirs.length > 0 ? validDirs : ['dist', 'www', 'build', '.stencil'];
+}
+/**
+ * Create resolve aliases from Stencil config
+ */
+export function getStencilResolveAliases(config) {
+    const srcDir = getStencilSrcDir(config);
+    const aliases = {
+        '@': resolve(process.cwd(), srcDir),
+    };
+    // Add component alias if components directory exists
+    const componentsDir = resolve(process.cwd(), srcDir, 'components');
+    if (existsSync(componentsDir)) {
+        aliases['@components'] = componentsDir;
+    }
+    // Add utils alias if utils directory exists
+    const utilsDir = resolve(process.cwd(), srcDir, 'utils');
+    if (existsSync(utilsDir)) {
+        aliases['@utils'] = utilsDir;
+    }
+    return aliases;
+}

package/package.json

@@ -4,7 +4,7 @@
     "type": "git",
     "url": "https://github.com/stenciljs/vitest"
   },
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "First-class testing utilities for Stencil design systems with Vitest",
   "license": "MIT",
   "type": "module",
@@ -56,22 +56,6 @@
     "web components",
     "component testing"
   ],
-  "scripts": {
-    "build": "tsc && tsc -p tsconfig.bin.json",
-    "dev": "tsc --watch",
-    "test:e2e": "pnpm --filter test-project test",
-    "test:unit": "vitest run",
-    "test:unit:watch": "vitest",
-    "test:engines": "pnpm installed-check --no-workspaces --ignore-dev",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "format": "prettier --check .",
-    "format:fix": "prettier --write .",
-    "knip": "knip",
-    "quality": "pnpm format && pnpm lint && pnpm knip",
-    "quality:fix": "pnpm format:fix && pnpm lint:fix && pnpm knip",
-    "release": "semantic-release"
-  },
   "publishConfig": {
     "access": "public"
   },
@@ -108,7 +92,7 @@
   "dependencies": {
     "jiti": "^2.6.1",
     "local-pkg": "^1.1.2",
-    "vitest-environment-stencil": "workspace:*"
+    "vitest-environment-stencil": "0.1.2"
   },
   "devDependencies": {
     "@eslint/js": "^9.39.2",
@@ -132,5 +116,18 @@
   "engines": {
     "node": "^20.0.0 || ^22.0.0 || >=24.0.0"
   },
-  "packageManager": "pnpm@10.26.0"
-}
+  "scripts": {
+    "build": "tsc && tsc -p tsconfig.bin.json",
+    "dev": "tsc --watch",
+    "test": "pnpm --filter test-project test",
+    "test:engines": "pnpm installed-check --no-workspaces --ignore-dev",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "format": "prettier --check .",
+    "format:fix": "prettier --write .",
+    "knip": "knip",
+    "quality": "pnpm format && pnpm lint && pnpm knip",
+    "quality:fix": "pnpm format:fix && pnpm lint:fix && pnpm knip",
+    "release": "semantic-release"
+  }
+}