Release 6.0.0 (#48)

## What's Changed
* feat: ignore playwright folder in jest config by @puehringer in
#45
* deps: pin @swc/core to 1.3.95 by @dvmartinweigl in
#47
* feat: add ability to build ts|tsx from node_modules by @puehringer in
#46

## New Contributors
* @dvmartinweigl made their first contribution in
#47

**Full Changelog**:
v5.1.0...v6.0.0

Author: thinkh

bin/commands/lint.js

@@ -8,6 +8,7 @@ module.exports = {
     type: 'boolean',
   }),
   handler: (args) => {
-    call('eslint', `${args.cache ? '--cache' : ''} --no-error-on-unmatched-pattern ${(args.strings || []).join(' ')} "src/**/*.ts{,x}" "tests/**/*.ts{,x}" "cypress/**/*.ts{,x}"`);
+    // TODO: Remove --fix to ensure all linting errors are reported in CI. Disable until a codebase is fully migrated, as otherwise formatting causes merge conflicts.
+    call('eslint', `--fix ${args.cache ? '--cache' : ''} --no-error-on-unmatched-pattern ${(args.strings || []).join(' ')} "src/**/*.ts{,x}" "tests/**/*.ts{,x}" "cypress/**/*.ts{,x}"`);
   },
 };

config/eslintrc.template.js

@@ -49,6 +49,7 @@ module.exports = ({ tsconfigRootDir }) => ({
     'no-prototype-builtins': 'warn',
     'no-minusminus': 'off',
     'no-underscore-dangle': 'off',
+    '@typescript-eslint/no-explicit-any': 'warn',
     '@typescript-eslint/no-unused-expressions': [
       'error',
       {
@@ -57,6 +58,7 @@ module.exports = ({ tsconfigRootDir }) => ({
         allowTaggedTemplates: true,
       },
     ],
+    '@typescript-eslint/no-unused-vars': 'warn',
     'max-classes-per-file': 'off',
     'no-param-reassign': ['warn', { props: true, ignorePropertyModificationsFor: ['state'] }], // Exclude state as required by redux-toolkit: https://redux-toolkit.js.org/usage/immer-reducers#linting-state-mutations
     'cypress/unsafe-to-chain-command': 'off',

config/jest.config.template.js

@@ -3,10 +3,7 @@ const pluginsNotToTransform = [
   'd3v3',
 ].join('|');
 
-/**
- * TODO check if we can process inline webpack loaders (e.g. as found in https://github.com/phovea/phovea_ui/blob/master/src/_bootstrap.ts)
- * see also https://jestjs.io/docs/en/webpack#mocking-css-modules
- */
+/** @type {import('jest').Config} */
 module.exports = {
   testEnvironment: 'jsdom',
   transform: {
@@ -22,6 +19,8 @@ module.exports = {
     '\\.xml$': 'jest-raw-loader',
   },
   testRegex: '(.*(test|spec))\\.(tsx?)$',
+  testPathIgnorePatterns: ['playwright'],
+  coveragePathIgnorePatterns: ['playwright'],
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
   modulePaths: ['src'],
   resolver: 'visyn_scripts/config/jest_export_maps_resolver.js',
@@ -32,5 +31,7 @@ module.exports = {
   },
   moduleNameMapper: {
     '^.+\\.(css|less|scss|sass|png|jpg|gif|svg|html)$': 'identity-obj-proxy',
+    // Add tslib alias as otherwise we get a TypeError: Cannot destructure property '__extends' of '_tslib.default' as it is undefined.
+    tslib: 'tslib/tslib.es6.js',
   },
 };

config/tsconfig.template.json

@@ -17,11 +17,14 @@
     "allowSyntheticDefaultImports": true,
     "preserveWatchOutput": true
   },
+  // Old "moduleResolution": "Node" option required for Cypress
+  // https://github.com/cypress-io/cypress/issues/26308#issuecomment-1663592648
+  //
+  // TODO: Remove when issue is resolved https://github.com/cypress-io/cypress/issues/27448
   "ts-node": {
     "compilerOptions": {
-      "module": "es2022",
-      "moduleResolution": "node16",
-      "sourceMap": false,
+      "module": "ESNext",
+      "moduleResolution": "Node"
     }
-  },
+  }
 }

config/webpack.config.js

@@ -308,7 +308,8 @@ module.exports = (webpackEnv, argv) => {
       ? {
         static: path.resolve(workspacePath, 'bundles'),
         compress: true,
-        host: 'localhost',
+        // Listen to all interfaces, as Node 18+ resolves IPv6 first: https://github.com/cypress-io/github-action/blob/master/README.md#wait-on-with-nodejs-18
+        host: '0.0.0.0',
         open: true,
         // Needs to be enabled to make SPAs work: https://stackoverflow.com/questions/31945763/how-to-tell-webpack-dev-server-to-serve-index-html-for-any-route
         historyApiFallback: historyApiFallback == null ? true : historyApiFallback,
@@ -495,6 +496,20 @@ module.exports = (webpackEnv, argv) => {
                 },
               },
             },
+            // Process application TS with swc-loader even if they are coming from node_modules, i.e. from non-built dependencies.
+            {
+              test: /\.(ts|tsx)$/,
+              loader: 'swc-loader',
+              options: {
+                jsc: {
+                  parser: {
+                    syntax: 'typescript',
+                    decorators: true,
+                    // TODO: Check what other settings should be supported: https://swc.rs/docs/configuration/swcrc#compilation
+                  },
+                },
+              },
+            },
             // "postcss" loader applies autoprefixer to our CSS.
             // "css" loader resolves paths in CSS and adds assets as dependencies.
             // "style" loader turns CSS into JS modules that inject <style> tags.

package.json

@@ -1,7 +1,7 @@
 {
   "name": "visyn_scripts",
   "description": "",
-  "version": "5.1.0",
+  "version": "6.0.0",
   "author": {
     "name": "datavisyn GmbH",
     "email": "[email protected]",
@@ -34,15 +34,15 @@
   "dependencies": {
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10",
     "@svgr/webpack": "^6.5.1",
-    "@swc/core": "~1.3.77",
+    "@swc/core": "1.3.95",
     "@swc/jest": "~0.2.24",
     "@types/jest": "~27.4.1",
-    "@types/node": "^17.0.45",
+    "@types/node": "^20.8.9",
     "@types/webpack": "^5.28.0",
     "@types/yeoman-environment": "2.10.8",
     "@types/yeoman-generator": "4.11.4",
-    "@typescript-eslint/eslint-plugin": "~5.55.0",
-    "@typescript-eslint/parser": "~5.55.0",
+    "@typescript-eslint/eslint-plugin": "~6.9.0",
+    "@typescript-eslint/parser": "~6.9.0",
     "bluebird": "3",
     "browserslist": "^4.18.1",
     "chalk": "4",
@@ -59,20 +59,20 @@
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-airbnb-typescript": "^17.0.0",
-    "eslint-config-prettier": "^8.7.0",
+    "eslint-config-prettier": "^9.0.0",
     "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-chai-friendly": "^0.7.2",
     "eslint-plugin-cypress": "^2.12.1",
     "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jest": "^27.2.1",
+    "eslint-plugin-jest": "^27.6.0",
     "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-prettier": "^5.0.1",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-webpack-plugin": "^4.0.0",
     "expose-loader": "^4.1.0",
     "file-loader": "^6.2.0",
-    "fork-ts-checker-webpack-plugin": "^8.0.0",
+    "fork-ts-checker-webpack-plugin": "^9.0.0",
     "fs-extra": "^10.1.0",
     "get-tsconfig": "^4.4.0",
     "glob": "^8.1.0",
@@ -93,14 +93,14 @@
     "postcss-loader": "^7.1.0",
     "postcss-normalize": "^10.0.1",
     "postcss-preset-env": "^8.0.1",
-    "prettier": "^2.8.4",
+    "prettier": "^3.0.3",
     "raw-loader": "~4.0.2",
     "react-dev-utils": "^12.0.1",
     "react-refresh": "^0.14.0",
     "resolve": "^1.22.1",
     "resolve-url-loader": "^5.0.0",
     "rimraf": "~4.4.0",
-    "sass-embedded": "~1.64.2",
+    "sass-embedded": "~1.69.5",
     "sass-loader": "^13.2.0",
     "semver": "^7.3.8",
     "semver-intersect": "^1.4.0",
@@ -112,10 +112,9 @@
     "tailwindcss": "^3.2.7",
     "terser-webpack-plugin": "^5.3.7",
     "time-analytics-webpack-plugin": "^0.1.20",
-    "ts-jest": "~27.1.3",
     "ts-node": "^10.9.1",
     "tslib": "~2.6.2",
-    "typescript": "~5.1.6",
+    "typescript": "~5.2.2",
     "url-loader": "~4.1.1",
     "util": "^0.12.5",
     "webpack": "^5.76.2",