Merge branch 'master' of github.com:source-academy/frontend into eugene-grading-comment-selector

Author: Tkaixiang

.github/workflows/ci.yml

@@ -22,7 +22,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        commands: [tsc, 'format:ci', eslint, build, test, test-coveralls]
+        commands: [tsc, 'format:ci', eslint, build, 'test --bail=1', test-coveralls]
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
@@ -43,5 +43,5 @@ jobs:
         if: matrix.commands == 'test-coveralls'
         uses: coverallsapp/github-action@master
         with:
-          path-to-lcov: lcov.info
+          path-to-lcov: coverage/lcov.info
           github-token: ${{ secrets.GITHUB_TOKEN }}

.prettierrc

@@ -3,5 +3,6 @@
   "singleQuote": true,
   "printWidth": 100,
   "arrowParens": "avoid",
-  "trailingComma": "none"
+  "trailingComma": "none",
+  "endOfLine": "auto"
 }

CONTRIBUTING.md

@@ -16,10 +16,10 @@ To start contributing, create a fork from our repo and send a PR. Refer to [this
 
 The frontend comes with an extensive test suite. To run the tests after you made your modifications, run
 `yarn test`. Regression tests are run automatically when you want to push changes to this repository.
-The regression tests are generated using `jest` and stored as snapshots in `src/\_\_tests\_\_`. After modifying the frontend, carefully inspect any failing regression tests reported in red in the command line. If you are convinced that the regression tests and not your changes are at fault, you can update the regression tests by running:
+The regression tests are generated using `vitest` and stored as snapshots in `src/\_\_tests\_\_`. After modifying the frontend, carefully inspect any failing regression tests reported in red in the command line. If you are convinced that the regression tests and not your changes are at fault, you can update the regression tests by running:
 
 ```bash
-yarn test --updateSnapshot
+yarn test --update
 ```
 
 ## Manually testing the frontend

eslint.config.mjs

@@ -1,25 +1,25 @@
 // @ts-check
 
-// import eslint from '@eslint/js';
-import { config, configs } from 'typescript-eslint';
+import eslint from '@eslint/js';
 import reactPlugin from 'eslint-plugin-react';
 import reactHooksPlugin from 'eslint-plugin-react-hooks';
 import simpleImportSort from 'eslint-plugin-simple-import-sort';
-// import reactRefresh from 'eslint-plugin-react-refresh';
+import tseslint from 'typescript-eslint';
+import reactRefresh from 'eslint-plugin-react-refresh';
 
-export default config(
-  { ignores: ['eslint.config.mjs'] },
-  // eslint.configs.recommended,
-  ...configs.recommended,
+export default tseslint.config(
+  { ignores: ['eslint.config.mjs', '**/*.snap'] },
+  eslint.configs.recommended,
+  tseslint.configs.recommended,
   // TODO: Enable when ready
-  // {
-  //   plugins: {
-  //     'react-refresh': reactRefresh
-  //   },
-  //   rules: {
-  //     'react-refresh/only-export-components': 'warn'
-  //   }
-  // },
+  {
+    plugins: {
+      'react-refresh': reactRefresh
+    },
+    rules: {
+      'react-refresh/only-export-components': 'warn'
+    }
+  },
   {
     files: ['**/*.ts*'],
     plugins: {
@@ -29,6 +29,7 @@ export default config(
     },
     rules: {
       ...reactHooksPlugin.configs['recommended-latest'].rules,
+      'no-empty': 'warn',
       'no-restricted-imports': [
         'error',
         {

jest.config.js

@@ -21,63 +21,68 @@
     "format:scss": "prettier --list-different --parser scss \"src/**/*.scss\"",
     "format:ci": "yarn run format:tsx && yarn run format:scss",
     "start": "rsbuild dev",
-    "test": "cross-env TZ=Asia/Singapore jest",
+    "test": "cross-env TZ=Asia/Singapore vitest run",
+    "test:watch": "cross-env TZ=Asia/Singapore vitest",
+    "test:ui": "cross-env TZ=Asia/Singapore vitest --ui --no-open",
     "test-coveralls": "./scripts/test-coveralls.sh",
-    "update-ui-snapshots": "jest --updateSnapshot",
+    "update-ui-snapshots": "vitest run --update",
     "eslint": "eslint src",
     "prepare": "husky",
     "preview": "rsbuild preview"
   },
   "dependencies": {
-    "@blueprintjs/core": "^5.10.1",
-    "@blueprintjs/datetime2": "^2.3.3",
-    "@blueprintjs/icons": "^5.9.0",
-    "@blueprintjs/select": "^5.1.3",
+    "@blueprintjs/core": "^6.0.0",
+    "@blueprintjs/datetime": "^6.0.0",
+    "@blueprintjs/icons": "^6.0.0",
+    "@blueprintjs/select": "^6.0.0",
+    "@convergencelabs/ace-collab-ext": "^0.6.0",
     "@mantine/hooks": "^7.11.2",
-    "@octokit/rest": "^20.0.0",
+    "@octokit/rest": "^22.0.0",
     "@reduxjs/toolkit": "^1.9.7",
-    "@sentry/browser": "^8.33.0",
+    "@sentry/react": "^10.5.0",
     "@sourceacademy/c-slang": "^1.0.21",
-    "@sourceacademy/sharedb-ace": "^2.0.3",
+    "@sourceacademy/conductor": "https://github.com/source-academy/conductor.git#0.2.1",
+    "@sourceacademy/language-directory": "https://github.com/source-academy/language-directory.git#0.0.4",
+    "@sourceacademy/plugin-directory": "https://github.com/source-academy/plugin-directory.git#0.0.2",
+    "@sourceacademy/sharedb-ace": "2.1.1",
     "@sourceacademy/sling-client": "^0.1.0",
     "@szhsin/react-menu": "^4.0.0",
     "@tanstack/react-table": "^8.9.3",
     "@tremor/react": "^1.8.2",
-    "ace-builds": "^1.36.3",
+    "ace-builds": "^1.42.1",
     "acorn": "^8.9.0",
-    "ag-grid-community": "^32.3.1",
-    "ag-grid-react": "^32.3.1",
+    "ag-grid-community": "^34.1.1",
+    "ag-grid-react": "^34.1.1",
     "array-move": "^4.0.0",
     "browserfs": "^1.4.3",
     "classnames": "^2.3.2",
-    "conductor": "https://github.com/source-academy/conductor.git#0.2.1",
     "dayjs": "^1.11.13",
     "dompurify": "^3.2.4",
     "flexboxgrid": "^6.3.1",
     "flexboxgrid-helpers": "^1.1.3",
     "hastscript": "^9.0.0",
     "i18next": "^25.0.0",
     "i18next-browser-languagedetector": "^8.0.0",
+    "immer": "^9.0.21",
     "java-slang": "^1.0.13",
     "js-cookie": "^3.0.5",
-    "js-slang": "^1.0.84",
+    "js-slang": "^1.0.85",
     "js-yaml": "^4.1.0",
     "konva": "^9.2.0",
-    "language-directory": "https://github.com/source-academy/language-directory.git",
     "lodash": "^4.17.21",
     "lz-string": "^1.4.4",
     "mdast-util-from-markdown": "^2.0.0",
     "mdast-util-to-hast": "^13.0.0",
     "normalize.css": "^8.0.1",
-    "phaser": "~3.87.0",
+    "phaser": "~3.90.0",
     "query-string": "^9.0.0",
     "re-resizable": "^6.9.9",
     "react": "^18.3.1",
     "react-ace": "^14.0.0",
     "react-copy-to-clipboard": "^5.1.0",
     "react-debounce-render": "^8.0.2",
     "react-dom": "^18.3.1",
-    "react-drag-drop-files": "^2.3.10",
+    "react-drag-drop-files": "^3.0.0",
     "react-draggable": "^4.4.5",
     "react-dropzone": "^14.2.3",
     "react-i18next": "^15.0.0",
@@ -87,7 +92,7 @@
     "react-papaparse": "^4.0.2",
     "react-qr-reader": "^3.0.0-beta-1",
     "react-redux": "^8.1.1",
-    "react-router-dom": "^6.14.1",
+    "react-router": "^7.6.2",
     "react-select": "^5.7.3",
     "react-simple-keyboard": "^3.6.27",
     "react-sortable-hoc": "^2.0.0",
@@ -99,7 +104,7 @@
     "showdown": "^2.1.0",
     "sourceror": "^0.8.5",
     "unified": "^11.0.0",
-    "uuid": "^11.0.2",
+    "uuid": "^13.0.0",
     "workbox-core": "^7.3.0",
     "workbox-precaching": "^7.3.0",
     "workbox-routing": "^7.3.0",
@@ -108,11 +113,11 @@
     "yareco": "^0.1.5"
   },
   "devDependencies": {
+    "@aaroon/workbox-rspack-plugin": "^0.3.2",
     "@babel/core": "^7.24.5",
     "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
     "@babel/preset-typescript": "^7.24.1",
     "@babel/runtime": "^7.24.5",
-    "@convergencelabs/ace-collab-ext": "^0.6.0",
     "@rsbuild/core": "^1.3.12",
     "@rsbuild/plugin-eslint": "^1.1.1",
     "@rsbuild/plugin-node-polyfill": "^1.3.0",
@@ -121,19 +126,17 @@
     "@rsbuild/plugin-svgr": "^1.2.0",
     "@svgr/webpack": "^8.0.0",
     "@swc/core": "^1.11.22",
-    "@swc/jest": "^0.2.38",
+    "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.0.0",
-    "@testing-library/react": "^15.0.6",
-    "@testing-library/user-event": "^14.4.3",
-    "@types/dompurify": "^3.0.5",
+    "@testing-library/react": "^16.0.0",
+    "@testing-library/user-event": "^14.6.0",
     "@types/estree": "^1.0.5",
-    "@types/gapi": "^0.0.44",
-    "@types/gapi.auth2": "^0.0.57",
+    "@types/gapi": "^0.0.47",
+    "@types/gapi.auth2": "^0.0.61",
     "@types/gapi.client": "^1.0.5",
     "@types/gapi.client.drive-v3": "^0.0.5",
-    "@types/google.picker": "^0.0.39",
+    "@types/google.picker": "^0.0.51",
     "@types/identity-obj-proxy": "^3",
-    "@types/jest": "^29.0.0",
     "@types/js-cookie": "^3.0.6",
     "@types/js-yaml": "^4.0.5",
     "@types/lodash": "^4.14.195",
@@ -146,12 +149,14 @@
     "@types/redux-mock-store": "^1.0.3",
     "@types/showdown": "^2.0.1",
     "@types/xml2js": "^0.4.11",
-    "babel-jest": "^29.7.0",
+    "@vitejs/plugin-react-swc": "^4.0.0",
+    "@vitest/coverage-v8": "3.2.4",
+    "@vitest/ui": "^3.2.4",
     "buffer": "^6.0.3",
     "canvas": "^3.1.0",
     "constants-browserify": "^1.0.0",
     "coveralls": "^3.1.1",
-    "cross-env": "^7.0.3",
+    "cross-env": "^10.0.0",
     "eslint": "^9.9.0",
     "eslint-plugin-react": "^7.35.0",
     "eslint-plugin-react-hooks": "^5.2.0",
@@ -160,8 +165,7 @@
     "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",
+    "jsdom": "^26.0.0",
     "npm-run-all2": "^8.0.0",
     "os-browserify": "^0.3.0",
     "path": "^0.12.7",
@@ -180,6 +184,7 @@
     "typescript": "^5.8.2",
     "typescript-eslint": "^8.1.0",
     "url": "^0.11.1",
+    "vitest": "^3.2.4",
     "webpack-bundle-analyzer": "^4.9.0"
   },
   "browserslist": {