upgrade rspack to 0.5.8 (#23)

* upgrade rspack to 0.5.8

typescript to 5.4.5

* test: fix the test

* update deps

* update the node version to 20 in actions

* update the rspack config for cypress testing

* update pnpm-lock.yaml

* revert the node version in github actions to lts

* try to solve the test in action

* update the test snapshot

cypress/config/cypress.config.ts

@@ -4,6 +4,7 @@ import { devServer } from '../../dist/devServer'
 export default defineConfig({
   component: {
     video: false,
+    screenshotOnRunFailure: false,
     supportFile: './support/component.ts',
     specPattern: './component/*.cy.{tsx,jsx,js,ts}',
     indexHtmlFile: '../support/component-index.html',

cypress/config/rspack.config.js

@@ -2,4 +2,21 @@ const rspack = require('@rspack/core')
 
 module.exports = {
   plugins: [new rspack.ProvidePlugin({ process: 'process' })],
+  module: {
+    rules: [
+      {
+        test: /\.[tj]sx?$/,
+        loader: 'builtin:swc-loader',
+        options: {
+          parser: {
+            syntax: 'typescript',
+            tsx: true,
+          },
+        },
+      },
+    ],
+  },
+  resolve: {
+    extensions: ['.ts', '.tsx', '.js', '.jsx'],
+  },
 }

dist/CypressCTRspackPlugin.js

@@ -20,7 +20,7 @@ class CypressCTRspackPlugin {
     constructor(options) {
         this.files = [];
         this.compilation = null;
-        this.addLoaderContext = (loaderContext, module) => {
+        this.addLoaderContext = (loaderContext) => {
             ;
             loaderContext._cypress = {
                 files: this.files,

dist/createRspackDevServer.js

@@ -7,11 +7,10 @@ const makeRspackConfig_1 = require("./makeRspackConfig");
 const debug = (0, debug_1.default)('cypress-rspack-dev-server:start');
 async function createRspackDevServer(config) {
     var _a;
-    const { sourceRspackModulesResult: { rspack: { module: rspack }, }, devServerConfig: { cypressConfig: { devServerPublicPathRoute }, }, } = config;
+    const { sourceRspackModulesResult: { rspack: { module: rspack }, rspackDevServer: { module: RspackDevServer }, }, devServerConfig: { cypressConfig: { devServerPublicPathRoute, isTextTerminal }, }, } = config;
     const finalRspackConfig = await (0, makeRspackConfig_1.makeRspackConfig)(config);
     const rspackCompiler = rspack(finalRspackConfig);
-    const isOpenMode = !config.devServerConfig.cypressConfig.isTextTerminal;
-    const RspackDevServer = config.sourceRspackModulesResult.rspackDevServer.module;
+    const isOpenMode = !isTextTerminal;
     const rspackDevServerConfig = Object.assign(Object.assign({ host: '127.0.0.1', port: 'auto' }, finalRspackConfig.devServer), { devMiddleware: {
             publicPath: devServerPublicPathRoute,
             stats: (_a = finalRspackConfig.stats) !== null && _a !== void 0 ? _a : 'minimal',

dist/devServer.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="cypress" />
-/// <reference types="cypress" />
 /// <reference types="node" />
+import type { EventEmitter } from 'events';
 import type { RspackDevServer } from '@rspack/dev-server';
 import type { Configuration } from '@rspack/core';
 import { SourceRelativeRspackResult } from './helpers/sourceRelativeRspackModules';
@@ -19,7 +19,7 @@ export type ConfigHandler = Partial<Configuration> | (() => Partial<Configuratio
 export type DevServerConfig = {
     specs: Cypress.Spec[];
     cypressConfig: Cypress.PluginConfigOptions;
-    devServerEvents: NodeJS.EventEmitter;
+    devServerEvents: EventEmitter;
     onConfigNotFound?: (devServer: 'rspack', cwd: string, lookedIn: string[]) => void;
     rspackConfig?: ConfigHandler;
 } & FrameworkConfig;

dist/loader.js

@@ -19,7 +19,7 @@ const makeImport = (file, filename, chunkName, projectRoot) => {
     shouldLoad: () => {
       const newLoad = new URLSearchParams(document.location.search).get("specPath") === "${file.absolute}";
       const oldLoad = decodeURI(document.location.pathname).includes("${file.absolute}");
-      return newLoad | oldLoad;
+      return newLoad || oldLoad;
     },
     load: () => import(${magicComments} "${file.absolute}"),
     absolute: "${file.absolute.split(path.sep).join(path.posix.sep)}",

dist/makeRspackConfig.js

@@ -29,7 +29,8 @@ exports.CYPRESS_RSPACK_ENTRYPOINT = path.resolve(__dirname, 'browser.js');
  */
 function modifyRspackConfigForCypress(rspackConfig) {
     if (rspackConfig === null || rspackConfig === void 0 ? void 0 : rspackConfig.plugins) {
-        rspackConfig.plugins = rspackConfig.plugins.filter((plugin) => !removeList.includes('raw' in plugin ? plugin.raw().name : plugin.constructor.name));
+        rspackConfig.plugins = rspackConfig.plugins.filter((plugin) => plugin &&
+            !removeList.includes('raw' in plugin ? plugin.raw().name : plugin.constructor.name));
     }
     delete rspackConfig.entry;
     delete rspackConfig.output;
@@ -40,8 +41,7 @@ async function getRspackConfigFromProjectRoot(projectRoot) {
     return await findUp(constants_1.configFiles, { cwd: projectRoot });
 }
 /**
- * Creates a rspack compatible rspack "configuration"
- * to pass to the sourced rspack function
+ * Creates a rspack compatible rspack "configuration" to pass to the sourced rspack function
  */
 async function makeRspackConfig(config) {
     var _a, _b, _c;
@@ -68,7 +68,8 @@ async function makeRspackConfig(config) {
                 process.exit(0);
             }
             else {
-                throw new Error(`Your Cypress devServer config is missing a required rspackConfig property, since we could not automatically detect one.\nPlease add one to your ${config.devServerConfig.cypressConfig.configFile}`);
+                throw new Error(`Your Cypress devServer config is missing a required rspackConfig property, since we could not automatically detect one.\n
+          Please add one to your ${config.devServerConfig.cypressConfig.configFile}`);
             }
         }
     }
@@ -86,7 +87,7 @@ async function makeRspackConfig(config) {
     (_c = mergedConfig.output) === null || _c === void 0 ? true : delete _c.chunkFilename;
     // Angular loads global styles and polyfills via script injection in the index.html
     if (framework === 'angular') {
-        mergedConfig.entry = Object.assign(Object.assign({}, (mergedConfig.entry || {})), { 'cypress-entry': exports.CYPRESS_RSPACK_ENTRYPOINT });
+        mergedConfig.entry = Object.assign(Object.assign({}, mergedConfig.entry), { 'cypress-entry': exports.CYPRESS_RSPACK_ENTRYPOINT });
     }
     else {
         mergedConfig.entry = exports.CYPRESS_RSPACK_ENTRYPOINT;

package.json

@@ -17,33 +17,33 @@
     "test": "jest"
   },
   "dependencies": {
-    "@rspack/cli": "^0.4.5",
+    "@rspack/cli": "0.5.8",
     "find-up": "6.3.0",
     "local-pkg": "0.4.1",
     "tslib": "^2.3.1",
     "webpack-merge": "^5.10.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.5",
-    "@babel/preset-env": "^7.23.5",
-    "@babel/preset-typescript": "^7.23.3",
+    "@babel/core": "^7.24.4",
+    "@babel/preset-env": "^7.24.4",
+    "@babel/preset-typescript": "^7.24.1",
     "@jest/globals": "^29.7.0",
-    "@rspack/core": "^0.4.5",
-    "@rspack/dev-server": "^0.4.5",
+    "@rspack/core": "0.5.8",
+    "@rspack/dev-server": "0.5.8",
     "@types/debug": "^4.1.12",
-    "@types/fs-extra": "^11.0.1",
-    "@types/jest": "^29.5.10",
-    "@types/lodash": "^4.14.201",
-    "@types/proxyquire": "^1.3.28",
+    "@types/fs-extra": "^11.0.4",
+    "@types/jest": "^29.5.12",
+    "@types/lodash": "^4.17.0",
+    "@types/proxyquire": "^1.3.31",
     "@types/watchpack": "^2.4.4",
     "@types/webpack-sources": "^3.2.3",
-    "@typescript-eslint/parser": "^6.11.0",
+    "@typescript-eslint/parser": "^6.21.0",
     "babel-jest": "^29.7.0",
     "cross-env": "^7.0.3",
-    "cypress": "^13.6.1",
+    "cypress": "^13.8.0",
     "debug": "^4.3.4",
     "dedent": "^0.7.0",
-    "eslint": "^8.54.0",
+    "eslint": "^8.57.0",
     "eslint-config-prettier": "^9.0.0",
     "fs-extra": "9.1.0",
     "jest": "^29.7.0",
@@ -56,7 +56,7 @@
     "sinon": "^13.0.1",
     "snap-shot-it": "^7.9.6",
     "ts-node": "^10.9.1",
-    "typescript": "^5.2.2"
+    "typescript": "^5.4.5"
   },
   "files": [
     "dist"