Skip to content

Migrate to rsbuild and swc #3131

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 35 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
35 commits
Select commit Hold shift + click to select a range
678f56a
Remove react-scripts
RichDom2185 Apr 25, 2025
6e6a7d2
Install rspack dependencies
RichDom2185 Apr 25, 2025
24d2dfc
Migrate and simplify index.html
RichDom2185 Apr 25, 2025
1a96375
Create rsbuild config
RichDom2185 Apr 25, 2025
9194617
Migrate webpack config
RichDom2185 Apr 25, 2025
6734eb6
Fix env var loading
RichDom2185 Apr 25, 2025
4441bc9
Fix import types
RichDom2185 Apr 25, 2025
815dd08
Add ESLint plugin in dev mode
RichDom2185 Apr 25, 2025
f6d7b24
Set up test dependencies
RichDom2185 Apr 25, 2025
c186deb
Migrate jest config
RichDom2185 Apr 25, 2025
91c0841
Use SWV for jest
RichDom2185 Apr 25, 2025
f947a69
Fix test configuration
RichDom2185 Apr 25, 2025
ebd6969
Update snapshot serialization
RichDom2185 Apr 25, 2025
9237cf3
Fix SVG test issues
RichDom2185 Apr 25, 2025
9168cac
Move import resolver to test utils
RichDom2185 Apr 25, 2025
9a2511a
Fix test environment issues with modern jest
RichDom2185 Apr 25, 2025
fc5b7d4
Fix timezone issues
RichDom2185 Apr 25, 2025
cf53020
Fix image loading
RichDom2185 Apr 25, 2025
c3fcd1b
Update more snapshots
RichDom2185 Apr 25, 2025
90ef7b9
Deduplicate dependencies
RichDom2185 Apr 26, 2025
f6a8d8e
Fix jest module resolution
RichDom2185 Apr 26, 2025
2d4f209
Fix some tests
RichDom2185 Apr 26, 2025
6aff589
Fix GitHub callback tests
RichDom2185 Apr 26, 2025
03d1501
Update more snapshots
RichDom2185 Apr 26, 2025
22cb5e5
Fix tree node creator tests
RichDom2185 Apr 26, 2025
1ac6769
Fix `FileExplorerDialog` tests
RichDom2185 Apr 26, 2025
4dd19ce
Fix most tests
RichDom2185 Apr 26, 2025
c7c0af0
Fix repository dialog tests
RichDom2185 Apr 26, 2025
9a9c617
Fix remaining test cases
RichDom2185 Apr 26, 2025
f9603f8
Fix test utils
RichDom2185 Apr 26, 2025
575e50e
Update scripts
RichDom2185 Apr 26, 2025
84dd7da
Remove CRACO
RichDom2185 Apr 26, 2025
83ef40b
Remove old CRACO config
RichDom2185 Apr 26, 2025
c3d0098
Fix and check tsc
RichDom2185 Apr 26, 2025
7c8bc0c
Re-add the ignore warnings for dynamic modules
leeyi45 Apr 28, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
182 changes: 0 additions & 182 deletions craco.config.js

This file was deleted.

104 changes: 104 additions & 0 deletions jest.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
// @ts-check

const ignoreModulePaths = (...paths) => {
const moduleRoot = replaceSlashes('/node_modules/');
const modulePaths = paths
.map(replaceSlashes)
.map(path => `(${path}[/\\\\.*])`)
.join('|');
return moduleRoot + '(?!' + modulePaths + ').*.(js|jsx|ts|tsx)$';
};
const replaceSlashes = target => {
return target.replaceAll('/', '[/\\\\]');
};

/** @type {import('jest').Config} */
export default {
moduleDirectories: ['<rootDir>', 'node_modules'],
testEnvironment: './jsdom-env.js',
transform: {
'^.+\\.(t|j)sx?$': [
'@swc/jest',
{
sourceMaps: true,
jsc: {
parser: {
syntax: 'typescript',
tsx: true,
decorators: false,
dynamicImport: false
},
baseUrl: '.',
transform: {
react: {
runtime: 'automatic'
}
}
}
}
]
},
transformIgnorePatterns: [
// Will give something like
// '[/\\\\]node_modules[/\\\\]
// (?!
// ( @ion-phaser[/\\\\]react[/\\\\.*] )|
// ( js-slang[/\\\\.*] )|
// ( array-move[/\\\\.*] )|
// ...
// ( comma-separated-tokens[/\\\\.*] )
// ).*.(js|jsx|ts|tsx)$'
ignoreModulePaths(
'@ion-phaser/react',
'js-slang',
'array-move',
'konva',
'react-konva',
'react-debounce-render',
'devlop',
'hastscript',
'hast-to-hyperscript',
'hast-util-.+',
'mdast-util-.+',
'micromark',
'micromark-.+',
'vfile',
'vfile-message',
'unist-util-.+',
'web-namespaces',
'rehype-react',
'unified',
'bail',
'is-plain-obj',
'trough',
'decode-named-character-reference',
'character-entities',
'trim-lines',
'property-information',
'space-separated-tokens',
'comma-separated-tokens',
'query-string',
'decode-uri-component',
'split-on-first',
'filter-obj',
'@sourceacademy/c-slang',
'java-parser',
'conductor'
),
'^.+\\.module\\.(css|sass|scss)$'
],
moduleNameMapper: {
'\\.(jpg|jpeg)$': '<rootDir>/src/fileMock.ts',
'\\.svg$': 'identity-obj-proxy',
'\\.(css|less|sass|scss)$': 'identity-obj-proxy',
'unist-util-visit-parents/do-not-use-color':
'<rootDir>/node_modules/unist-util-visit-parents/lib',
'vfile/do-not-use-conditional-minpath': '<rootDir>/node_modules/vfile/lib',
'vfile/do-not-use-conditional-minproc': '<rootDir>/node_modules/vfile/lib',
'vfile/do-not-use-conditional-minurl': '<rootDir>/node_modules/vfile/lib'
},
setupFilesAfterEnv: [
'./src/setupTests.ts', // Setup file for Jest
'./src/i18n/i18n.ts' // Setup i18next configuration
]
};
12 changes: 12 additions & 0 deletions jsdom-env.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import JSDOMEnvironment from 'jest-environment-jsdom';

// https://stackoverflow.com/a/78051351
export default class FixJSDOMEnvironment extends JSDOMEnvironment {
constructor(...args) {
super(...args);
this.global.fetch = fetch;
this.global.Request = Request;
this.global.Response = Response;
// And any other missing globals
}
}
29 changes: 22 additions & 7 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
{
"private": true,
"type": "module",
"name": "frontend",
"packageManager": "[email protected]",
"version": "1.4.3",
Expand All @@ -13,18 +14,19 @@
},
"scripts": {
"analyze": "yarn build --stats; webpack-bundle-analyzer build/bundle-stats.json",
"build": "cross-env DISABLE_ESLINT_PLUGIN=true NODE_OPTIONS=--max_old_space_size=8192 craco build",
"coverage": "./scripts/coverage-fix.sh do && craco test --coverage && ./scripts/coverage-fix.sh undo",
"build": "tsc -b && rsbuild build",
"coverage": "./scripts/coverage-fix.sh do && yarn test --coverage && ./scripts/coverage-fix.sh undo",
"dev": "rsbuild dev",
"format": "eslint --fix src && prettier --write \"src/**/*.{js,jsx,ts,tsx}\" && prettier --write --parser scss \"src/**/*.scss\"",
"format:tsx": "prettier --list-different \"src/**/*.{js,jsx,ts,tsx}\"",
"format:scss": "prettier --list-different --parser scss \"src/**/*.scss\"",
"format:ci": "yarn run format:tsx && yarn run format:scss",
"start": "cross-env DISABLE_ESLINT_PLUGIN=true BROWSER=none PORT=8000 craco start",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we consider having start alias dev for those users still used to the old way of launching? Or do you think that is not necessary?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we can just use start instead of dev

"test": "cross-env TZ=UTF-8 craco test",
"test": "cross-env TZ=Asia/Singapore jest",
"test-coveralls": "./scripts/test-coveralls.sh",
"update-ui-snapshots": "jest --updateSnapshot",
"eslint": "eslint src",
"prepare": "husky"
"prepare": "husky",
"preview": "rsbuild preview"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe we can have this as the new yarn start command behaviour instead?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we shouldn't, because preview is to preview the production bundle (after running yarn build). We can just alias start to dev instead as per your comment above

},
"dependencies": {
"@blueprintjs/core": "^5.10.1",
Expand Down Expand Up @@ -98,6 +100,9 @@
"sourceror": "^0.8.5",
"unified": "^11.0.0",
"uuid": "^11.0.2",
"workbox-core": "^7.3.0",
"workbox-precaching": "^7.3.0",
"workbox-routing": "^7.3.0",
"xlsx": "https://cdn.sheetjs.com/xlsx-0.20.2/xlsx-0.20.2.tgz",
"xml2js": "^0.6.0",
"yareco": "^0.1.5"
Expand All @@ -108,8 +113,15 @@
"@babel/preset-typescript": "^7.24.1",
"@babel/runtime": "^7.24.5",
"@convergencelabs/ace-collab-ext": "^0.6.0",
"@craco/craco": "^7.1.0",
"@rsbuild/core": "^1.3.12",
"@rsbuild/plugin-eslint": "^1.1.1",
"@rsbuild/plugin-node-polyfill": "^1.3.0",
"@rsbuild/plugin-react": "^1.3.0",
"@rsbuild/plugin-sass": "^1.3.1",
"@rsbuild/plugin-svgr": "^1.2.0",
"@svgr/webpack": "^8.0.0",
"@swc/core": "^1.11.22",
"@swc/jest": "^0.2.38",
"@testing-library/jest-dom": "^6.0.0",
"@testing-library/react": "^15.0.6",
"@testing-library/user-event": "^14.4.3",
Expand All @@ -120,6 +132,7 @@
"@types/gapi.client": "^1.0.5",
"@types/gapi.client.drive-v3": "^0.0.5",
"@types/google.picker": "^0.0.39",
"@types/identity-obj-proxy": "^3",
"@types/jest": "^29.0.0",
"@types/js-cookie": "^3.0.6",
"@types/js-yaml": "^4.0.5",
Expand All @@ -146,6 +159,9 @@
"eslint-plugin-simple-import-sort": "^12.1.1",
"https-browserify": "^1.0.0",
"husky": "^9.0.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^29.7.0",
"jest-environment-jsdom": "^29.7.0",
"npm-run-all2": "^7.0.0",
"os-browserify": "^0.3.0",
"path": "^0.12.7",
Expand All @@ -154,7 +170,6 @@
"prettier": "^3.3.3",
"process": "^0.11.10",
"react-error-overlay": "^6.0.11",
"react-scripts": "^5.0.1",
"react-test-renderer": "^18.2.0",
"redux-saga-test-plan": "^4.0.6",
"resize-observer-polyfill": "^1.5.1",
Expand Down
Loading
Loading