Skip to content

Webpack config for Svelte component testing not loading as ESM #32493

@scottohara

Description

@scottohara

Current behavior

I have a project that uses component testing using Svelte 5, Typescript and Webpack 5.

The root package.json file specifies "type": "module", therefore all *.js files are treated as ESM, including my webpack.config.js file; which includes ESM-only code such as:

const root = import.meta.dirname;

My cypress.config.ts file loads the webpack.dev.js as follows:

import type { Configuration } from "webpack";
import { defineConfig } from "cypress";
import webpackConfig from "./webpack.dev";

export default defineConfig({
	component: {
		devServer: {
			framework: "svelte",
			bundler: "webpack",
			webpackConfig: webpackConfig as Configuration,
		},
	},
	defaultBrowser: "chrome",
	viewportHeight: 500,
	viewportWidth: 800,
});

Using Cypress 14.5.4, the cypress config loads successfully and I can successfully run all component specs.

Using Cypress 15.2.0, I get an error indicating the config file is invalid.

The issue seems to be that when Cypress 15 loads this config, import.meta.dirname is undefined, where as Cypress 14 and the exact same config (and same Nodejs version) correctly loads the file as an ESM file such that import.meta.dirname contains the directory of the script.

Desired behavior

Cypress 15 should load the webpack config file as ESM, and import.meta.dirname in the webpack config should equal the name of the scripts directory, same as Cypress 14 does.

Test code to reproduce

package.json

{
  "type": "module"
}

webpack.config.js

import { resolve } from "node:path";

const root = import.meta.dirname;

export default {
  output: {
    path: resolve(root, "dist")
  }
};

cypress.config.ts

import type { Configuration } from "webpack";
import { defineConfig } from "cypress";
import webpackConfig from "./webpack.dev";

export default defineConfig({
	component: {
		devServer: {
			framework: "svelte",
			bundler: "webpack",
			webpackConfig: webpackConfig as Configuration,
		},
	},
});

Cypress Version

15.2.0

Node version

22.14.0

Operating System

macOS 15

Debug Logs

Other

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions