cypress-rspack-dev-server

Based off the amazing work of the cypress team at https://github.com/cypress-io/cypress/blob/develop/npm/webpack-dev-server/

Implements the APIs for Cypress Component-testing with Rust-based web bundler Rspack's dev server.

Installation

Install the library to your devDependencies

npm install -D cypress-rspack-dev-server

Requires Cypress >= 15.17.0. Rspack v2 relies on import.meta.dirname, which is only handled correctly by the tsx version bundled with Cypress 15.17.0 and later. On older Cypress releases the dev server will fail to start. If you must stay on Cypress < 15.17.0, use [email protected].

Usage

import { devServer } from 'cypress-rspack-dev-server'
import { defineConfig } from 'cypress'

export default defineConfig({
  component: {
    devServer(devServerConfig) {
      return devServer({
        ...devServerConfig,
        framework: 'react',
        rspackConfig: require('./rspack.config.js'),
      })
    },
  },
})

Dev server parameters

| Option | NOTES | | --------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | framework | react, currently only react, will support other frameworks | | cypressConfig | Cypress Plugin Configuration | | specs | Array of Cypress Spec | | devServerEvents | Nodejs EventEmitter | | rspackConfig (Optional) | Rspack Configuration, can be require from rspack config file | | onConfigNotFound (Optional) | The callback function when config not found |

Rsbuild Support

import config from './rsbuild.config.ts';

async devServer(devServerConfig) {
  const rsbuild = await createRsbuild({ rsbuildConfig: config });
  const rsbuildConfigs = await rsbuild.initConfigs();

  const rspackConfig = rsbuildConfigs[0];

  rspackConfig?.module?.rules?.push({
    test: /\.(ts|tsx)$/,
    exclude: /node_modules/,
    use: {
      loader: 'babel-loader',
      options: {
        plugins: ['istanbul'],
      },
    },
    enforce: 'post',
  });
  return devServer({
    ...devServerConfig,
    framework: 'react',
    rspackConfig: rspackConfig,
  });
}

Migration

v1 (Cypress 14+)

In version 1, we support the Cypress 14 's justInTimeCompile, the specs structure has been updated. If you still use Cypress <= 13, please use the version 0.0.x.

v2 (Rspack v2 support)

In version 2, we support Rspack v2 (2.0.0-rc and above). If you are using Rspack v1, please use the version 1.x.x.

v2.1 (Cypress 15.17+ required)

Version 2.1.0 removed an internal workaround for a tsx import.meta.dirname bug. The fix now lives in Cypress itself (which bundles tsx >= 4.21.1 starting in Cypress 15.17.0), so this package now requires Cypress >= 15.17.0. If you are on an older Cypress, stay on [email protected] until you can upgrade Cypress.

License

This project is licensed under the terms of the MIT license.