@cypress/vite-dev-server 3.1.1 → 3.3.0

package/README.md

@@ -58,7 +58,7 @@ We then merge the sourced config with the user's vite config, and layer on our o
 
 ## License
 
-[![license](https://img.shields.io/badge/license-MIT-green.svg)](https://github.com/cypress-io/cypress/blob/master/LICENSE)
+[![license](https://img.shields.io/badge/license-MIT-green.svg)](https://github.com/cypress-io/cypress/blob/develop/LICENSE)
 
 This project is licensed under the terms of the [MIT license](/LICENSE).
 

package/client/initCypressTests.js

@@ -24,12 +24,22 @@ if (supportFile) {
 
   // We need a slash before /cypress/supportFile.js, this happens by default
   // with the current string replacement logic.
-  importsToLoad.push(() => import(`${devServerPublicPathRoute}${supportRelativeToProjectRoot}`))
+  importsToLoad.push({
+    load: () => import(`${devServerPublicPathRoute}${supportRelativeToProjectRoot}`),
+    absolute: supportFile,
+    relative: supportRelativeToProjectRoot,
+    relativeUrl: `${devServerPublicPathRoute}${supportRelativeToProjectRoot}`,
+  })
 }
 
 /* Spec file import logic */
 // We need a slash before /src/my-spec.js, this does not happen by default.
-importsToLoad.push(() => import(`${devServerPublicPathRoute}/${CypressInstance.spec.relative}`))
+importsToLoad.push({
+  load: () => import(`${devServerPublicPathRoute}/${CypressInstance.spec.relative}`),
+  absolute: CypressInstance.spec.absolute,
+  relative: CypressInstance.spec.relative,
+  relativeUrl: `${devServerPublicPathRoute}/${CypressInstance.spec.relative}`,
+})
 
 if (!CypressInstance) {
   throw new Error('Tests cannot run without a reference to Cypress!')

package/dist/devServer.d.ts

@@ -1,6 +1,9 @@
 /// <reference types="cypress" />
+/// <reference types="cypress" />
 /// <reference types="node" />
+import type { UserConfig } from 'vite';
 declare const ALL_FRAMEWORKS: readonly ["react", "vue"];
+declare type ConfigHandler = UserConfig | (() => UserConfig | Promise<UserConfig>);
 export declare type ViteDevServerConfig = {
     specs: Cypress.Spec[];
     cypressConfig: Cypress.PluginConfigOptions;
@@ -8,7 +11,7 @@ export declare type ViteDevServerConfig = {
     onConfigNotFound?: (devServer: 'vite', cwd: string, lookedIn: string[]) => void;
 } & {
     framework?: typeof ALL_FRAMEWORKS[number];
-    viteConfig?: unknown;
+    viteConfig?: ConfigHandler;
 };
 export declare function devServer(config: ViteDevServerConfig): Promise<Cypress.ResolvedDevServerConfig>;
 export declare namespace devServer {

package/dist/devServer.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.devServer = void 0;
 const tslib_1 = require("tslib");
-const debug_1 = (0, tslib_1.__importDefault)(require("debug"));
+const debug_1 = tslib_1.__importDefault(require("debug"));
 const getVite_1 = require("./getVite");
 const resolveConfig_1 = require("./resolveConfig");
 const debug = (0, debug_1.default)('cypress:vite-dev-server:devServer');

package/dist/getVite.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getVite = void 0;
 const tslib_1 = require("tslib");
-const debug_1 = (0, tslib_1.__importDefault)(require("debug"));
+const debug_1 = tslib_1.__importDefault(require("debug"));
 const debug = (0, debug_1.default)('cypress:vite-dev-server:getVite');
 // "vite-dev-server" is bundled in the binary, so we need to require.resolve "vite"
 // from root of the active project since we don't bundle vite internally but rather

package/dist/plugins/cypress.js

@@ -2,11 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Cypress = void 0;
 const tslib_1 = require("tslib");
-const debug_1 = (0, tslib_1.__importDefault)(require("debug"));
+const debug_1 = tslib_1.__importDefault(require("debug"));
 const pathe_1 = require("pathe");
 const node_html_parser_1 = require("node-html-parser");
-const fs_1 = (0, tslib_1.__importDefault)(require("fs"));
-const path_1 = (0, tslib_1.__importDefault)(require("path"));
+const fs_1 = tslib_1.__importDefault(require("fs"));
+const path_1 = tslib_1.__importDefault(require("path"));
 const debug = (0, debug_1.default)('cypress:vite-dev-server:plugins:cypress');
 const INIT_FILEPATH = (0, pathe_1.resolve)(__dirname, '../../client/initCypressTests.js');
 const HMR_DEPENDENCY_LOOKUP_MAX_ITERATION = 50;

package/dist/plugins/index.d.ts

@@ -1,2 +1,3 @@
 export * from './inspect';
 export * from './cypress';
+export * from './sourcemap';

package/dist/plugins/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-(0, tslib_1.__exportStar)(require("./inspect"), exports);
-(0, tslib_1.__exportStar)(require("./cypress"), exports);
+tslib_1.__exportStar(require("./inspect"), exports);
+tslib_1.__exportStar(require("./cypress"), exports);
+tslib_1.__exportStar(require("./sourcemap"), exports);

package/dist/plugins/inspect.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CypressInspect = void 0;
 const tslib_1 = require("tslib");
-const debug_1 = (0, tslib_1.__importDefault)(require("debug"));
+const debug_1 = tslib_1.__importDefault(require("debug"));
 const debug = (0, debug_1.default)('cypress:vite-dev-server:plugins:inspect');
 const CypressInspect = (config) => {
     var _a;

package/dist/plugins/sourcemap.d.ts

@@ -0,0 +1,4 @@
+import type { Plugin } from 'vite';
+import type { Vite } from '../getVite';
+import type { ViteDevServerConfig } from '../devServer';
+export declare const CypressSourcemap: (options: ViteDevServerConfig, vite: Vite) => Plugin;

package/dist/plugins/sourcemap.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CypressSourcemap = void 0;
+const tslib_1 = require("tslib");
+const debug_1 = tslib_1.__importDefault(require("debug"));
+const debug = (0, debug_1.default)('cypress:vite-dev-server:plugins:sourcemap');
+const CypressSourcemap = (options, vite) => {
+    return {
+        name: 'cypress:sourcemap',
+        enforce: 'post',
+        transform(code, id, options) {
+            try {
+                if (/\.js$/i.test(id) && !/\/\/# sourceMappingURL=/i.test(code)) {
+                    /*
+                    The Vite dev server and plugins automatically generate sourcemaps for most files, but they are
+                    only included in the served files if any transpilation actually occurred (JSX, TS, etc). This
+                    means that files that are "pure" JS won't include sourcemaps, so JS spec files that don't require
+                    transpilation won't get code frames in the runner.
+          
+                    A sourcemap for these files is generated (just not served) which is in effect an "identity"
+                    sourcemap mapping 1-to-1 to the output file. We can grab this and pass it along as a sourcemap
+                    we want Vite to embed into the output, giving Cypress a sourcemap to use for codeFrame lookups.
+                    @see https://rollupjs.org/guide/en/#thisgetcombinedsourcemap
+          
+                    We utilize a 'post' plugin here and manually append the sourcemap content to the code. We *should*
+                    be able to pass the sourcemap along using the `map` attribute in the return value, but Babel-based
+                    plugins don't work with this which causes sourcemaps to break for files that go through common
+                    plugins like `@vitejs/plugin-react`. By manually appending the sourcemap at this point in time
+                    Babel-transformed files end up with correct sourcemaps.
+                    */
+                    const sourcemap = this.getCombinedSourcemap();
+                    code += `\n//# sourceMappingURL=${sourcemap.toUrl()}`;
+                    return {
+                        code,
+                        map: { mappings: '' },
+                    };
+                }
+            }
+            catch (_err) {
+                debug('Failed to propagate sourcemap for %s: %o', id, _err);
+            }
+        },
+    };
+};
+exports.CypressSourcemap = CypressSourcemap;

package/dist/resolveConfig.d.ts

@@ -1,3 +1,4 @@
+import type { InlineConfig } from 'vite';
 import type { ViteDevServerConfig } from './devServer';
 import type { Vite } from './getVite';
-export declare const createViteDevServerConfig: (config: ViteDevServerConfig, vite: Vite) => Promise<Record<string, any>>;
+export declare const createViteDevServerConfig: (config: ViteDevServerConfig, vite: Vite) => Promise<InlineConfig>;

package/dist/resolveConfig.js

@@ -7,10 +7,10 @@ const tslib_1 = require("tslib");
  * Vitest's own config resolution logic.
  * You can find it here https://github.com/vitest-dev/vitest/blob/main/packages/vitest/src/node/create.ts
  */
-const debug_1 = (0, tslib_1.__importDefault)(require("debug"));
+const debug_1 = tslib_1.__importDefault(require("debug"));
 const local_pkg_1 = require("local-pkg");
 const pathe_1 = require("pathe");
-const path_1 = (0, tslib_1.__importDefault)(require("path"));
+const path_1 = tslib_1.__importDefault(require("path"));
 const constants_1 = require("./constants");
 const index_1 = require("./plugins/index");
 const debug = (0, debug_1.default)('cypress:vite-dev-server:resolve-config');
@@ -84,9 +84,24 @@ const createViteDevServerConfig = async (config, vite) => {
         plugins: [
             (0, index_1.Cypress)(config, vite),
             (0, index_1.CypressInspect)(config),
+            (0, index_1.CypressSourcemap)(config, vite),
         ].filter((p) => p != null),
     };
-    const finalConfig = vite.mergeConfig(viteBaseConfig, viteOverrides);
+    if (config.cypressConfig.isTextTerminal) {
+        viteBaseConfig.server = Object.assign(Object.assign({}, (viteBaseConfig.server || {})), { 
+            // Disable file watching and HMR when executing tests in `run` mode
+            watch: {
+                ignored: '**/*',
+            }, hmr: false });
+    }
+    let resolvedOverrides = {};
+    if (typeof viteOverrides === 'function') {
+        resolvedOverrides = await viteOverrides();
+    }
+    else if (typeof viteOverrides === 'object') {
+        resolvedOverrides = viteOverrides;
+    }
+    const finalConfig = vite.mergeConfig(viteBaseConfig, resolvedOverrides);
     debug('The resolved server config is', JSON.stringify(finalConfig, null, 2));
     return finalConfig;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cypress/vite-dev-server",
-  "version": "3.1.1",
+  "version": "3.3.0",
   "description": "Launches Vite Dev Server for Component Testing",
   "main": "index.js",
   "scripts": {
@@ -26,8 +26,8 @@
     "dedent": "^0.7.0",
     "mocha": "^9.2.2",
     "sinon": "^13.0.1",
-    "ts-node": "^10.2.1",
-    "vite": "3.0.3",
+    "ts-node": "^10.9.1",
+    "vite": "3.1.0",
     "vite-plugin-inspect": "0.4.3"
   },
   "files": [
@@ -41,7 +41,7 @@
     "type": "git",
     "url": "https://github.com/cypress-io/cypress.git"
   },
-  "homepage": "https://github.com/cypress-io/cypress/tree/master/npm/vite-dev-server#readme",
+  "homepage": "https://github.com/cypress-io/cypress/tree/develop/npm/vite-dev-server#readme",
   "bugs": "https://github.com/cypress-io/cypress/issues/new?template=1-bug-report.md",
   "module": "dist/index.js",
   "publishConfig": {