@arcgis/lumina-compiler 4.33.0-next.9 → 4.33.0-next.90

package/dist/jsxToLitHtml/autoAddNothing.d.ts

@@ -1,5 +1,5 @@
-import type { TemplatePart } from "./templateParts";
-import { type JsxContext } from "./types";
+import { TemplatePart } from './templateParts';
+import { JsxContext } from './types';
 /**
  * If JSX prop value could possibly be `undefined`, we add `?? nothing` to it.
  *

package/dist/jsxToLitHtml/comments.d.ts

@@ -1,10 +1,10 @@
-import ts from "typescript";
-import type { JsxContext } from "./types";
-import type { TemplatePart } from "./templateParts";
+import { default as ts } from 'typescript';
+import { JsxContext } from './types';
+import { TemplatePart } from './templateParts';
 /**
  * Extract comments and whitespace from a node (called "trivia" in TypeScript)
  */
-export declare const getNodeTrivia: (node: ts.Node, context: JsxContext) => string;
+export declare const getNodeTrivia: (node: ts.Node, context: Pick<JsxContext, "sourceFile">) => string;
 /**
  * Attach trivia comments to a node.
  *

package/dist/jsxToLitHtml/convertProps.d.ts

@@ -1,9 +1,8 @@
-import ts from "typescript";
-import type { TemplatePart } from "./templateParts";
-import type { JsxContext } from "./types";
-import type { JsxPropType } from "./inferPropType";
-import { dynamicHtmlSymbol } from "./config";
-import { type dynamicSvgSymbol } from "./config";
+import { default as ts } from 'typescript';
+import { TemplatePart } from './templateParts';
+import { JsxContext } from './types';
+import { JsxPropType } from './inferPropType';
+import { dynamicHtmlSymbol, dynamicSvgSymbol } from './config';
 /**
  * Handle the conversion for each JSX prop type
  */

package/dist/jsxToLitHtml/imports.d.ts

@@ -1,5 +1,5 @@
-import ts from "typescript";
-import { type JsxContext } from "./types";
+import { default as ts } from 'typescript';
+import { JsxContext } from './types';
 export declare const dynamicallyInsertedImportPaths: Set<string>;
 /**
  * This runs before we know what imports will be needed.

package/dist/jsxToLitHtml/index.d.ts

@@ -1,4 +1,4 @@
-import type { FileTransformer } from "../publicTypes";
+import { FileTransformer } from '../publicTypes';
 /**
  * Let developers author components in JSX for better type checking and developer
  * experience, but convert JSX to lit-html at build time for better performance.

package/dist/jsxToLitHtml/inferPropType.d.ts

@@ -1,5 +1,5 @@
-import ts from "typescript";
-import { dynamicHtmlSymbol, dynamicSvgSymbol } from "./config";
+import { default as ts } from 'typescript';
+import { dynamicHtmlSymbol, dynamicSvgSymbol } from './config';
 /**
  * Check if prop initializer has bindProperty(), bindAttribute(),
  * bindBooleanAttribute() or bindEvent() call - these explicitly indicate the
@@ -34,7 +34,7 @@ export declare function checkExplicitPropType(initializer: ts.JsxAttributeValue
  * explicitly want to overwrite the below prop type inference logic.
  */
 export declare function inferPropType(propName: string, initializer: ts.JsxAttributeValue | undefined, tagName: string | typeof dynamicHtmlSymbol | typeof dynamicSvgSymbol): JsxPropType;
-declare const specialPropsArray: readonly ["class", "style", "ref", "directives", "key"];
+declare const specialPropsArray: readonly ["class", "style", "ref", "directives", "key", "deferLoad"];
 type SpecialProp = (typeof specialPropsArray)[number];
 export type JsxPropType = SpecialProp | "attribute" | "booleanAttribute" | "event" | "property";
 export {};

package/dist/jsxToLitHtml/insertRepeatCall.d.ts

@@ -1,5 +1,5 @@
-import ts from "typescript";
-import type { JsxContext } from "./types";
+import { default as ts } from 'typescript';
+import { JsxContext } from './types';
 /**
  * By default, when we see a `key=""` prop, we convert it like this:
  * ```tsx

package/dist/jsxToLitHtml/jsxVisitor.d.ts

@@ -1,7 +1,6 @@
-import ts from "typescript";
-import type { TemplatePart } from "./templateParts";
-import type { JsxHost } from "./types";
-import { type JsxContext } from "./types";
+import { default as ts } from 'typescript';
+import { TemplatePart } from './templateParts';
+import { JsxHost, JsxContext } from './types';
 /**
  * Recursively traverse the entire AST top-down, converting JSX to lit-html.
  */

package/dist/jsxToLitHtml/templateParts.d.ts

@@ -1,5 +1,5 @@
-import ts from "typescript";
-import { type JsxContext, type LitTag, type ambiguousSvgTag } from "./types";
+import { default as ts } from 'typescript';
+import { JsxContext, LitTag, ambiguousSvgTag } from './types';
 /**
  * Template part is a convenient intermediate representation for template
  * literal expressions.

package/dist/jsxToLitHtml/throwOnImportingExternalized.d.ts

@@ -1,4 +1,4 @@
-import type { JsxContext } from "./types";
+import { JsxContext } from './types';
 /**
  * Throw if encountered an explicit non-type-only import for a Calcite component
  * or some `@arcgis/*` component package - such packages should be externalized,

package/dist/jsxToLitHtml/types.d.ts

@@ -1,6 +1,6 @@
-import ts from "typescript";
-import type { ResolvedDependencyComponents } from "../dependencies/discover";
-import type { CompilerContext } from "../context";
+import { default as ts } from 'typescript';
+import { ResolvedDependencyComponents } from '../dependencies/discover';
+import { CompilerContext } from '../context';
 export type JsxContext = {
     readonly compiler: CompilerContext;
     /** Source file before the _JSX to lit-html_ transformation */
@@ -16,6 +16,7 @@ export type JsxContext = {
      * remove it from the map to not confuse any following resolvers.
      */
     readonly customElementsToImport: Set<string>;
+    readonly customElementsToImportDeferred: Set<string>;
     /**
      * Existing imported modules.
      *
@@ -64,7 +65,7 @@ export declare const mathMlTag = "mathml";
 declare const litTagsArray: readonly ["css", "html", "mathml", "staticHtml", "staticSvg", "svg"];
 export declare const litTags: Set<"html" | "css" | "mathml" | "staticHtml" | "staticSvg" | "svg">;
 export type LitTag = (typeof litTagsArray)[number];
-export declare const jsxImportNames: readonly ["keyed", "ref", "repeat", "live", "css", "html", "mathml", "staticHtml", "staticSvg", "svg", "safeClassMap", "safeStyleMap", "nothing"];
+export declare const jsxImportNames: readonly ["keyed", "ref", "repeat", "live", "css", "html", "mathml", "staticHtml", "staticSvg", "svg", "safeClassMap", "safeStyleMap", "deferLoad", "nothing"];
 export type JsxImportName = (typeof jsxImportNames)[number];
 export type JsxHost = ts.JsxElement | ts.JsxFragment | ts.JsxSelfClosingElement;
 export declare const isJsxHost: (node: ts.Node) => node is JsxHost;

package/dist/jsxToLitHtml/utils.d.ts

@@ -11,3 +11,4 @@ export declare function safeTrimText(text: string): string;
 export declare const escapeForTemplateLiteral: (string: string) => string;
 export declare const shouldQuoteAttributeValue: (value: string) => boolean;
 export declare const escapeForHtml: (string: string) => string;
+export declare const isCustomElement: (tagName: string | symbol) => tagName is string;

package/dist/loader/hideUntilHydrated.d.ts

@@ -1,4 +1,4 @@
-import type { CompilerContext } from "../context";
+import { CompilerContext } from '../context';
 export declare function addGlobalCss(context: CompilerContext): string;
 export declare const defaultHydratedAttribute = "hydrated";
 /**

package/dist/loader/index.d.ts

@@ -1,5 +1,5 @@
-import type { Plugin as VitePlugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin as VitePlugin } from 'vite';
+import { CompilerContext } from '../context';
 /**
  * Generate virtual files:
  * - loader.ts (for lazy loading components)

package/dist/loader/lazy.d.ts

@@ -1,6 +1,6 @@
-import type { CompilerContext } from "../context";
-import type { HmrComponentMeta } from "@arcgis/lumina/hmrSupport";
-import type { ApiCustomElementDeclaration } from "@arcgis/api-extractor";
+import { CompilerContext } from '../context';
+import { HmrComponentMeta } from '@arcgis/lumina/hmrSupport';
+import { ApiCustomElementDeclaration } from '@arcgis/api-extractor';
 /**
  * To power bundle splitting for lazy loadable components, as well as to support
  * calling async methods before the component loaded, and to ensure frameworks

package/dist/loader/storybookApiJson.d.ts

@@ -1,4 +1,4 @@
-import type { ApiJson } from "@arcgis/api-extractor";
+import { ApiJson } from '@arcgis/api-extractor';
 /**
  * Providing api.json to Storybook.
  * See https://github.com/storybookjs/storybook/tree/next/code/addons/docs/web-components

package/dist/plugins/buildCdn.d.ts

@@ -1,5 +1,5 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 /**
  * Restricted due to collisions with Lumina's dist/ folder names or
  * Stencil's dist/ folder names
@@ -12,10 +12,76 @@ export declare const defaultNamespace = "cdn";
  * are assumed to be defined in the environment separately)
  */
 export declare function buildCdn(context: CompilerContext): Plugin | undefined;
-declare function transformAsyncCoreImports(code: string): string;
-declare function transformSyncCoreImports(code: string): string;
+type Chunk = {
+    code: string;
+    isAsync: boolean | undefined;
+};
+/**
+ * Transform each core-importing chunk to use $arcgis.t for loading core in
+ * order to be both ESM and AMD CDN compatible.
+ *
+ * Previous solution
+ * (https://devtopia.esri.com/WebGIS/arcgis-web-components/pull/2995) relied on
+ * top-level await. However, due to a Safari bug
+ * (see https://devtopia.esri.com/WebGIS/arcgis-web-components/issues/3933
+ * and https://bugs.webkit.org/show_bug.cgi?id=242740), we are no longer using
+ * top-level await.
+ *
+ * Instead, we insert a top-level await polyfill - a promise called $$ is
+ * exported by core-containing modules - such promise needs to be awaited by the
+ * consuming modules before the imported variables are available.
+ *
+ * List of other solutions considered:
+ * https://devtopia.esri.com/WebGIS/arcgis-web-components/discussions/3999
+ *
+ * @example
+ * ```js
+ * /// BEFORE
+ * import { b } from "./U7MU7PMX.js";
+ * import { when as M } from "@arcgis/core/core/reactiveUtils.js";
+ * var s = class extends v {
+ *   // ...
+ * };
+ * export { s as ArcgisNavigationToggle };
+ *
+ * /// AFTER
+ * // $$ is a promise we need to await before imports from that module are available
+ * import { $$ as _0, b } from "./U7MU7PMX.js";
+ * var _1,
+ *   $$ = $arcgis.t(
+ *     ([{ when: M }]) => {
+ *       // The "meat" of the file is kept unchanged by the transform
+ *       // (we only touch the imports, and the very last export line)
+ *         s = class extends v {
+ *           // ...
+ *         };
+ *       // Assign exported variables to global scope variables
+ *       _1 = s;
+ *     },
+ *     "core/reactiveUtils",
+ *     _0,
+ *   );
+ * // _1 will only be assigned once $$ resolves
+ * export { $$, _1 as ArcgisNavigationToggle };
+ * ```
+ */
+declare function transformChunk(chunk: Chunk, chunks: Map<string, Chunk>): void;
+/**
+ * @example Dynamic core import
+ * ```diff
+ * - import("core/Handles");
+ * + $arcgis.t(_=>_[0],"core/Handles")
+ * ```
+ *
+ * @example Dynamic import of a chunk with top-level await
+ * ```diff
+ * - import("./chunk.js");
+ * + import("./chunk.js").then(m=>m.$$.then(_=>m))
+ * ```
+ */
+declare function transformDynamicCoreImports(code: string, chunks: Map<string, Chunk>): string;
 export declare const exportsForTests: {
-    transformAsyncCoreImports: typeof transformAsyncCoreImports;
-    transformSyncCoreImports: typeof transformSyncCoreImports;
+    transformDynamicCoreImports: typeof transformDynamicCoreImports;
+    transformChunk: typeof transformChunk;
 };
 export {};

package/dist/plugins/buildStencilHydrate.d.ts

@@ -1,5 +1,5 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 /**
  * Emit output compatible with Stencil's dist-hydrate-script build.
  *

package/dist/plugins/buildWebApp.d.ts

@@ -0,0 +1,3 @@
+import { CompilerContext } from '../context';
+/** @deprecated */
+export declare function buildWebApp(context: CompilerContext, rawDestination: string, cdnEntryName: string): Promise<void>;

package/dist/plugins/buildWrappers.d.ts

@@ -1,3 +1,3 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 export declare function buildWrappers(context: CompilerContext): Plugin;

package/dist/plugins/configureVite.d.ts

@@ -1,7 +1,7 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
-import type { PuppeteerLaunchOptions } from "puppeteer";
-import type { InlineConfig } from "vitest/node";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
+import { PuppeteerLaunchOptions } from 'puppeteer';
+import { InlineConfig } from 'vitest/node';
 export type PuppeteerVitestConfigOptions = InlineConfig & {
     puppeteerLaunchOptions?: PuppeteerLaunchOptions;
     puppeteerWaitForChangesDelay?: number;

package/dist/plugins/externalizeDependencies.d.ts

@@ -1,6 +1,5 @@
-import type { Plugin } from "vite";
-import type { Nil } from "@arcgis/components-utils";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 /**
  * By default, Rollup will bundle-in all dependencies.
  *
@@ -29,6 +28,3 @@ import type { CompilerContext } from "../context";
  * be externalized (because all peerDependencies are externalized).
  */
 export declare function externalizeDependencies(context: CompilerContext): Plugin;
-export declare const exportsForTests: {
-    normalizeGlobs: (option: Nil | RegExp | string | false) => RegExp | undefined;
-};

package/dist/plugins/handleDynamicAssets.d.ts

@@ -1,3 +1,3 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 export declare const handleDynamicAssets: (context: CompilerContext) => Plugin;

package/dist/plugins/handleStaticAssets.d.ts

@@ -1,5 +1,5 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 /**
  * This is similar to Stencil's assets hosting, but to improve DX, the assets
  * belonging to each component are moved into a folder named after the component

package/dist/plugins/loadLitCss.d.ts

@@ -1,9 +1,5 @@
-/**
- * This file has a companion `@arcgis/lumina/typings/loadLitCss.d.ts`. Edits
- * to this file may need to be reflected there too
- */
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 export declare const cssLangsRe: RegExp;
 /**
  * The `.adoptedStyleSheets` API is very convenient, but it has one issue: it

package/dist/plugins/printTotalBuildSize.d.ts

@@ -1,5 +1,5 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 /**
  * Augmenting vite's default reporter to not just report bundle sizes, but to
  * also print the total size

package/dist/plugins/provideAssets.d.ts

@@ -1,23 +1,6 @@
-/**
- * Utilities for making Vite copy assets to the output folder during build or
- * serve them when in serve mode
- *
- * This is similar to Vite's public directory, except that you can provide
- * multiple directories and re-map the path at which the files are served.
- *
- * @remarks
- * The functionality is similar to
- * https://github.com/nguyenbatranvan/vite-multiple-assets/blob/main/packages/libs/index.ts
- *
- * But with improvements:
- * - support scoping assets
- * - copy files in parallel rather than sequentially
- * - greater type safety and uses modern Node.js features
- * - transform the assets (i.e minify JSON)
- */
-import type { CompilerContext } from "../context";
-import type { AssetSpec, AssetTransformer } from "../publicTypes";
-import type { ContextDirectories } from "../context/types";
+import { CompilerContext } from '../context';
+import { AssetSpec, AssetTransformer } from '../publicTypes';
+import { ContextDirectories } from '../context/types';
 export declare function serveAssets(context: CompilerContext, assets: AssetSpec[], transformers?: AssetTransformer[]): void;
 export declare function writeAssets(context: CompilerContext, assets: AssetSpec[], transformers?: AssetTransformer[]): Promise<void>;
 /**

package/dist/plugins/setAssetsPath.d.ts

@@ -1,5 +1,5 @@
-import type { Plugin } from "vite";
-import type { CompilerContext } from "../context";
+import { Plugin } from 'vite';
+import { CompilerContext } from '../context';
 /**
  * Plugin to set the base URL for assets in the package
  *

package/dist/plugins/updatePackageJson.d.ts

@@ -1,6 +1,6 @@
-import type { MiniPackageJson } from "@arcgis/components-build-utils";
-import type { CompilerContext } from "../context";
-import type { Plugin } from "vite";
+import { MiniPackageJson } from '@arcgis/components-build-utils';
+import { CompilerContext } from '../context';
+import { Plugin } from 'vite';
 export declare const updatePackageJson: (context: CompilerContext) => Plugin;
 declare function doPackageJsonUpdate(packageJson: MiniPackageJson, context: Pick<CompilerContext, "_documentationFileNames" | "dir">): MiniPackageJson | undefined;
 export declare const exportsForTests: {

package/dist/publicTypes.d.ts

@@ -1,14 +1,14 @@
-import type ts from "typescript";
-import type { Plugin } from "vite";
-import type { build as esbuildBuild } from "esbuild";
-import type { CompilerContext } from "./context";
-import type { PluginOptions as VitePluginDtsOptions } from "vite-plugin-dts";
-import type { ExternalsOptions as RollupPluginNodeExternalsOptions } from "rollup-plugin-node-externals";
-import type { PuppeteerLaunchOptions } from "puppeteer";
-import type { WebTypesOptions } from "./docs/webTypes/types";
-import type { VsCodeDocOptions } from "./docs/vsCodeCustomData/types";
-import type { ApiJson, ApiModule } from "@arcgis/api-extractor";
-import type { LuminaApiExtractor } from "./extractor/extractor";
+import { default as ts } from 'typescript';
+import { Plugin } from 'vite';
+import { build as esbuildBuild } from 'esbuild';
+import { CompilerContext } from './context';
+import { PluginOptions as VitePluginDtsOptions } from 'vite-plugin-dts';
+import { ExternalsOptions as RollupPluginNodeExternalsOptions } from 'rollup-plugin-node-externals';
+import { PuppeteerLaunchOptions } from 'puppeteer';
+import { WebTypesOptions } from './docs/webTypes/types';
+import { VsCodeDocOptions } from './docs/vsCodeCustomData/types';
+import { ApiJson, ApiModule } from '@arcgis/api-extractor';
+import { LuminaApiExtractor } from './extractor/extractor';
 /**
  * `useLumina()` returns an array of Vite plugins. The array additionally
  * has a `context` property for accessing the compiler context.
@@ -71,6 +71,18 @@ export type BuildOptions = {
      * Configuration for CDN build.
      */
     readonly cdn?: BuildCdnOptions;
+    readonly webApp?: {
+        /**
+         * If set, will produce a web app build, based on index.html files and
+         * cdn build.
+         *
+         * @default undefined
+         * @example "www"
+         * @see [Based on Stencil's www build](https://stenciljs.com/docs/www)
+         * @deprecated Use Storybook build or separate test app package.
+         */
+        readonly destination?: string;
+    };
     /**
      * Options for externalizing or bundling in dependencies.
      */
@@ -276,13 +288,13 @@ export type GenerateDocumentationOptions = {
      * This URL will be visible in VS Code and IntelliJ when hovering over a
      * component tag in an .html file
      */
-    readonly getComponentDocsUrl?: (tag: string, name: string) => string;
+    readonly getComponentDocsUrl?: (tag: string, name: string) => string | undefined;
     /**
      * Provide a URL to a page that documents the component.
      * This URL will be visible in VS Code and IntelliJ when hovering over a
      * component tag in an .html file
      */
-    readonly getComponentDemoUrl?: (tag: string, name: string) => string;
+    readonly getComponentDemoUrl?: (tag: string, name: string) => string | undefined;
     /**
      * Additional options for web component documentation for VS Code. This
      * documentation provides intellisense when editing .html and .css files.

package/dist/puppeteerTesting/globalSetup.d.ts

@@ -1,5 +1,5 @@
-import type { GlobalSetupContext } from "vitest/dist/node.js";
-import { type ConnectOptions } from "puppeteer";
+import { GlobalSetupContext } from 'vitest/dist/node.js';
+import { ConnectOptions } from 'puppeteer';
 declare module "vitest" {
     interface ProvidedContext {
         isDevToolsEnabled?: boolean;

package/dist/puppeteerTesting/globalSetup.js

@@ -1,4 +1,95 @@
-import"../chunk-JFKSI6I7.js";import{launch as l}from"puppeteer";import{createServer as a}from"vite";async function m(t){process.cwd()!==t.config.root&&process.chdir(t.config.root);let[r,e]=await Promise.all([p(t),d(t)]);return async()=>{await Promise.all([e.close(),r.close()]),setInterval(()=>{e.watcher.close()},100).unref()}}async function p(t){let r=t.config,e=r.puppeteerLaunchOptions??{},o=1e3*60*60,s={acceptInsecureCerts:!0,protocolTimeout:e.devtools?o:void 0,args:["--force-prefers-no-reduced-motion",...e.args??[]],...e,headless:e.headless??(e.devtools?void 0:"shell")},n=await l(s),i={...s,browserWSEndpoint:n.wsEndpoint()};return t.provide("puppeteerConnectOptions",i),t.provide("isDevToolsEnabled",s.devtools??!1),t.provide("isHeadlessBrowser",e.headless===void 0?e.devtools!==!0:e.headless!==!1),t.provide("puppeteerWaitForChangesDelay",r.puppeteerWaitForChangesDelay),n}async function d(t){let r={__IS_IN_PUPPETEER__:!0},e=await a({logLevel:"error",server:{open:!1,hmr:!1},root:t.config.root,mode:t.config.mode,clearScreen:!1,define:r});return await e.listen(),await v(t,e),c(t,e),e}async function v(t,r){let e=await r.transformIndexHtml("/",`<!doctype html>
+import { launch as i } from "puppeteer";
+import { createServer as l } from "vite";
+async function h(r) {
+  process.cwd() !== r.config.root && process.chdir(r.config.root);
+  const [o, e] = await Promise.all([c(r), d(r)]);
+  return async () => {
+    await Promise.all([e.close(), o.close()]), setInterval(() => {
+      e.watcher.close();
+    }, 100).unref();
+  };
+}
+async function c(r) {
+  const o = r.config, e = o.puppeteerLaunchOptions ?? {}, t = 1e3 * 60 * 60, s = {
+    acceptInsecureCerts: !0,
+    /**
+     * Allow stopping on a "debugger;" breakpoint for 30 min. Default was 3min.
+     */
+    protocolTimeout: e.devtools ? t : void 0,
+    /**
+     * Force animations to be enabled to run tests consistently regardless of OS
+     * settings.
+     */
+    args: ["--force-prefers-no-reduced-motion", ...e.args ?? []],
+    ...e,
+    /**
+     * The "new" headless mode is running very slow when you have multiple
+     * browser tabs open (running tests concurrently). The slowdown seems to be
+     * most prominent around `requestAnimationFrame()`, which sometimes takes
+     * up to 15s! It indeed appears that `requestAnimationFrame()` is one tab
+     * is blocked until several other tabs complete and close.
+     *
+     * All these issues are fixed by using the old headless mode. It is marked
+     * to be removed from Puppeteer in 2024. However, we are looking to migrate
+     * away from Puppeteer toward Vitest Browser Mode (Playwright) anyway.
+     *
+     * See:
+     * - https://github.com/puppeteer/puppeteer/issues/11944#issuecomment-1967860373
+     * - https://github.com/puppeteer/puppeteer/issues/10109
+     * - https://github.com/puppeteer/puppeteer/issues/12982
+     */
+    headless: e.headless ?? (e.devtools ? void 0 : "shell")
+  }, n = await i(s), a = { ...s, browserWSEndpoint: n.wsEndpoint() };
+  return r.provide("puppeteerConnectOptions", a), r.provide("isDevToolsEnabled", s.devtools ?? !1), r.provide(
+    "isHeadlessBrowser",
+    /**
+     * Default value for headless depends on devtools argument:
+     * https://github.com/puppeteer/puppeteer/blob/b5f08d55401dcfbcfd5d885920ec5098f96ab249/packages/puppeteer-core/src/node/ChromeLauncher.ts#L241-L242
+     */
+    e.headless === void 0 ? e.devtools !== !0 : e.headless !== !1
+  ), r.provide("puppeteerWaitForChangesDelay", o.puppeteerWaitForChangesDelay), n;
+}
+async function d(r) {
+  const o = {
+    // eslint-disable-next-line @typescript-eslint/naming-convention
+    __IS_IN_PUPPETEER__: !0
+  }, e = await l({
+    /**
+     * Do not clutter tests console with Vite logs.
+     * Also, this matches the setting that Vitest uses when it starts up Vite.
+     */
+    logLevel: "error",
+    server: {
+      /**
+       * Vitest should not auto-open the page (as it would do so in the default
+       * browser). Instead, if you want to see the page, you should start
+       * puppeteer in headed mode, which will open the browser for you.
+       */
+      open: !1,
+      /**
+       * On code changes, browser page reloading will cause a Puppeteer page
+       * navigation, which will fail the test. Instead of HMR, use Vitest
+       * watch mode.
+       */
+      hmr: !1
+    },
+    /**
+     * This should be process.cwd() in most cases, but setting in here just in
+     * case
+     */
+    root: r.config.root,
+    // Set mode to "test"
+    mode: r.config.mode,
+    // This interferes with the Vitest output
+    clearScreen: !1,
+    define: o
+  });
+  return await e.listen(), await v(r, e), p(r, e), e;
+}
+async function v(r, o) {
+  const e = await o.transformIndexHtml(
+    "/",
+    `<!doctype html>
 <html lang="en">
 <head>
   <meta charset="utf-8" />
@@ -8,4 +99,16 @@ import"../chunk-JFKSI6I7.js";import{launch as l}from"puppeteer";import{createSer
 </head>
 <body>
 </body>
-</html>`);t.provide("devServerHtml",e)}function c(t,r){let e=r.resolvedUrls,o=e?.local.at(0)??e?.network.at(0);if(o===void 0)throw new Error("Failed to resolve the dev server URL");t.provide("devServerUrl",o)}export{m as setup};
+</html>`
+  );
+  r.provide("devServerHtml", e);
+}
+function p(r, o) {
+  const e = o.resolvedUrls, t = e?.local.at(0) ?? e?.network.at(0);
+  if (t === void 0)
+    throw new Error("Failed to resolve the dev server URL");
+  r.provide("devServerUrl", t);
+}
+export {
+  h as setup
+};

package/dist/puppeteerTesting/index.d.ts

@@ -1,11 +1,10 @@
-import "vitest";
-import type { PuppeteerMatchers } from "./vitest/matchers";
-export type * from "./puppeteer/types";
-export type { NewE2EPageOptions } from "./puppeteer/page";
-export { newE2EPage } from "./puppeteer/page";
-export type { E2EElement } from "./puppeteer/element";
-export type { EventSpy } from "./puppeteer/events";
-export { setupPuppeteerTest } from "./vitest/setupFile";
+import { PuppeteerMatchers } from './vitest/matchers';
+export type * from './puppeteer/types';
+export type { NewE2EPageOptions } from './puppeteer/page';
+export { newE2EPage } from './puppeteer/page';
+export type { E2EElement } from './puppeteer/element';
+export type { EventSpy } from './puppeteer/events';
+export { setupPuppeteerTest } from './vitest/setupFile';
 declare module "vitest" {
     interface Assertion<T = any> extends PuppeteerMatchers<T> {
     }