@openedx/frontend-build 15.0.0-alpha.23 → 15.0.0-alpha.25

package/config/.eslintrc.js

@@ -1,7 +1,7 @@
 const { babel } = require('../lib/presets');
 
 module.exports = {
-  extends: '@edx/eslint-config',
+  extends: ['@edx/eslint-config'],
   plugins: ['@typescript-eslint'],
   parser: '@typescript-eslint/parser',
   parserOptions: {
@@ -43,5 +43,6 @@ module.exports = {
   },
   ignorePatterns: [
     'module.config.js',
+    'env.config.*',
   ],
 };

package/config/jest/svgrMock.jsx

@@ -0,0 +1,4 @@
+export const ReactComponent = (props) => <div data-testid="IconMock" {...props} />;
+
+const mock = 'icon/mock/path';
+export default mock;

package/config/jest.config.js

@@ -21,7 +21,7 @@ module.exports = {
   ],
   rootDir: process.cwd(),
   moduleNameMapper: {
-    '\\.svg': path.resolve(__dirname, 'jest/svgrMock.js'),
+    '\\.svg': path.resolve(__dirname, 'jest/svgrMock.jsx'),
     '\\.(jpg|jpeg|png|gif|eot|otf|webp|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': path.resolve(__dirname, 'jest/fileMock.js'),
     '\\.(css|scss)$': 'identity-obj-proxy',
     'env.config': envConfigPath,

package/config/webpack.dev-stage.config.js

@@ -100,8 +100,9 @@ module.exports = merge(commonConfig, {
                   path.join(process.cwd(), 'node_modules'),
                   path.join(process.cwd(), 'src'),
                 ],
-                // silences compiler warnings regarding deprecation warnings
+                // Silences compiler deprecation warnings. They mostly come from bootstrap and/or paragon.
                 quietDeps: true,
+                silenceDeprecations: ['abs-percent', 'color-functions', 'import', 'mixed-decls', 'global-builtin'],
               },
             },
           },
@@ -109,7 +110,7 @@ module.exports = merge(commonConfig, {
       },
       {
         test: /.svg(\?v=\d+\.\d+\.\d+)?$/,
-        issuer: /\.jsx?$/,
+        issuer: /\.(jsx?|tsx?)$/,
         use: ['@svgr/webpack'],
       },
       // Webpack, by default, uses the url-loader for images and fonts that are required/included by

package/config/webpack.dev.config.js

@@ -64,8 +64,9 @@ function getStyleUseConfig() {
             path.join(process.cwd(), 'node_modules'),
             path.join(process.cwd(), 'src'),
           ],
-          // silences compiler warnings regarding deprecation warnings
+          // Silences compiler deprecation warnings. They mostly come from bootstrap and/or paragon.
           quietDeps: true,
+          silenceDeprecations: ['abs-percent', 'color-functions', 'import', 'mixed-decls', 'global-builtin'],
         },
       },
     },
@@ -127,7 +128,7 @@ module.exports = merge(commonConfig, {
       },
       {
         test: /.svg(\?v=\d+\.\d+\.\d+)?$/,
-        issuer: /\.jsx?$/,
+        issuer: /\.(jsx?|tsx?)$/,
         use: ['@svgr/webpack'],
       },
       // Webpack, by default, uses the url-loader for images and fonts that are required/included by

package/config/webpack.prod.config.js

@@ -131,8 +131,9 @@ module.exports = merge(commonConfig, {
                   path.join(process.cwd(), 'node_modules'),
                   path.join(process.cwd(), 'src'),
                 ],
-                // silences compiler warnings regarding deprecation warnings
+                // Silences compiler deprecation warnings. They mostly come from bootstrap and/or paragon.
                 quietDeps: true,
+                silenceDeprecations: ['abs-percent', 'color-functions', 'import', 'mixed-decls', 'global-builtin'],
               },
             },
           },
@@ -140,7 +141,7 @@ module.exports = merge(commonConfig, {
       },
       {
         test: /.svg(\?v=\d+\.\d+\.\d+)?$/,
-        issuer: /\.jsx?$/,
+        issuer: /\.(jsx?|tsx?)$/,
         use: ['@svgr/webpack'],
       },
       // Webpack, by default, uses the url-loader for images and fonts that are required/included by

package/lib/plugins/html-webpack-new-relic-plugin/test/HtmlWebpackNewRelicPlugin.test.js

@@ -18,7 +18,11 @@ describe('HtmlWebpackNewRelicPlugin', () => {
 
   afterEach(() => {
     if (fs.existsSync(OUTPUT_DIR)) {
-      fs.rmdirSync(OUTPUT_DIR, { recursive: true, force: true });
+      fs.rm(OUTPUT_DIR, { recursive: true, force: true }, (err) => {
+        if (err) {
+          console.error('Error deleting folder:', err);
+        }
+      });
     }
   });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openedx/frontend-build",
-  "version": "15.0.0-alpha.23",
+  "version": "15.0.0-alpha.25",
   "description": "Build tools, setup and config for frontend apps",
   "publishConfig": {
     "access": "public"
@@ -38,7 +38,7 @@
     "@babel/plugin-proposal-object-rest-spread": "7.20.7",
     "@babel/plugin-syntax-dynamic-import": "7.8.3",
     "@babel/preset-env": "7.24.8",
-    "@babel/preset-react": "7.24.7",
+    "@babel/preset-react": "7.26.3",
     "@edx/eslint-config": "^4.3.0",
     "@edx/new-relic-source-map-webpack-plugin": "2.1.0",
     "@edx/typescript-config": "1.1.0",
@@ -50,8 +50,8 @@
     "@typescript-eslint/eslint-plugin": "^5.58.0",
     "@typescript-eslint/parser": "^5.58.0",
     "autoprefixer": "10.4.20",
-    "babel-jest": "29.6.1",
-    "babel-loader": "9.1.3",
+    "babel-jest": "29.7.0",
+    "babel-loader": "9.2.1",
     "babel-plugin-formatjs": "^10.4.0",
     "babel-plugin-transform-imports": "2.0.0",
     "babel-polyfill": "6.26.0",
@@ -65,17 +65,17 @@
     "eslint-config-airbnb": "19.0.4",
     "eslint-config-airbnb-typescript": "^17.0.0",
     "eslint-plugin-formatjs": "^4.12.2",
-    "eslint-plugin-import": "2.27.5",
+    "eslint-plugin-import": "2.31.0",
     "eslint-plugin-jsx-a11y": "6.7.1",
-    "eslint-plugin-react": "7.32.2",
-    "eslint-plugin-react-hooks": "4.6.0",
+    "eslint-plugin-react": "7.33.2",
+    "eslint-plugin-react-hooks": "4.6.1",
     "express": "^4.18.2",
     "file-loader": "6.2.0",
     "html-webpack-plugin": "5.6.3",
     "identity-obj-proxy": "3.0.0",
     "image-minimizer-webpack-plugin": "3.8.3",
-    "jest": "29.6.1",
-    "jest-environment-jsdom": "29.6.1",
+    "jest": "29.7.0",
+    "jest-environment-jsdom": "29.7.0",
     "mini-css-extract-plugin": "1.6.2",
     "parse5": "7.1.2",
     "postcss": "8.4.49",
@@ -83,9 +83,9 @@
     "postcss-loader": "7.3.4",
     "postcss-rtlcss": "5.1.2",
     "react-dev-utils": "12.0.1",
-    "react-refresh": "0.14.2",
+    "react-refresh": "0.16.0",
     "resolve-url-loader": "5.0.0",
-    "sass": "1.69.7",
+    "sass": "1.85.1",
     "sass-loader": "13.3.3",
     "sharp": "0.32.6",
     "source-map-loader": "4.0.2",
@@ -93,7 +93,7 @@
     "ts-jest": "29.1.4",
     "typescript": "4.9.5",
     "url-loader": "4.1.1",
-    "webpack": "^5.89.0",
+    "webpack": "^5.97.1",
     "webpack-bundle-analyzer": "^4.10.1",
     "webpack-cli": "^5.1.4",
     "webpack-dev-server": "^4.15.1",
@@ -102,10 +102,10 @@
   },
   "devDependencies": {
     "@babel/preset-typescript": "^7.18.6",
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.11"
+    "@types/react": "^18.3.18",
+    "@types/react-dom": "^18.3.5"
   },
   "peerDependencies": {
-    "react": "^16.9.0 || ^17.0.0"
+    "react": "^16.9.0 || ^17.0.0 || ^18.0.0"
   }
 }

package/config/jest/svgrMock.js

@@ -1,4 +0,0 @@
-export const ReactComponent = 'IconMock';
-
-const mock = 'icon/mock/path';
-export default mock;