Fix tests

Signed-off-by: Florent MILLOT <[email protected]>
gridsuite · Jan 25, 2024 · e5b6193 · e5b6193
1 parent f784113
commit e5b6193
Show file tree

Hide file tree

Showing 8 changed files with 9,326 additions and 3,226 deletions.
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,6 @@
+{
+  "presets": [
+    "@babel/preset-env",
+    ["@babel/preset-react", { "runtime": "automatic" }]
+  ]
+}
diff --git a/demo/src/app.jsx b/demo/src/app.jsx
@@ -78,7 +78,7 @@ import {
 } from '../../src/index';
 import translations from './demo_intl';
 
-import PowsyblLogo from '../images/powsybl_logo.svg?react';
+import PowsyblLogo from '../images/powsybl_logo.svg';
 import AppPackage from '../../package.json';
 
 import ReportViewerDialog from '../../src/components/ReportViewerDialog';

diff --git a/jest.config.ts b/jest.config.ts
@@ -0,0 +1,13 @@
+import type { Config } from 'jest';
+
+const config: Config = {
+    testEnvironment: 'jsdom',
+    moduleNameMapper: {
+        '^.+\\.svg$': 'jest-svg-transformer',
+    },
+    globals: {
+        IS_REACT_ACT_ENVIRONMENT: true,
+    },
+};
+
+export default config;
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -49,6 +49,8 @@
     },
     "devDependencies": {
         "@babel/helper-builder-react-jsx": "7.15.4",
+        "@babel/preset-env": "^7.23.8",
+        "@babel/preset-react": "^7.23.3",
         "@emotion/react": "^11.8.1",
         "@emotion/styled": "^11.8.1",
         "@hookform/resolvers": "^3.0.0",
@@ -70,6 +72,9 @@
         "eslint-plugin-react": "^7.21.0",
         "eslint-plugin-react-hooks": "^4.1.2",
         "eslint-webpack-plugin": "^2.0.0",
+        "jest": "^29.7.0",
+        "jest-environment-jsdom": "^29.7.0",
+        "jest-svg-transformer": "^1.0.0",
         "notistack": "^3.0.0",
         "prettier": "^2.0.0",
         "puppeteer": "^17.0.0",
@@ -79,6 +84,7 @@
         "react-intl": "^6.0.0",
         "react-resizable": "^3.0.4",
         "react-router-dom": "^6.0.0",
+        "ts-node": "^10.9.2",
         "type-fest": "^2.0.0",
         "typescript": "^5.3.3",
         "utf-8-validate": "^5.0.2",

diff --git a/src/components/TopBar/TopBar.test.js b/src/components/TopBar/TopBar.test.js
@@ -14,7 +14,7 @@ import { IntlProvider } from 'react-intl';
 import TopBar from './TopBar';
 import { top_bar_en } from '../../';
 
-import PowsyblLogo from '../images/powsybl_logo.svg?react';
+import PowsyblLogo from '../images/powsybl_logo.svg';
 
 import { red } from '@mui/material/colors';
 import { ThemeProvider, createTheme } from '@mui/material/styles';

diff --git a/tests.webpack.js b/tests.webpack.js
diff --git a/vite.config.ts b/vite.config.ts
@@ -11,7 +11,13 @@ import { createRequire } from 'node:module';
 import svgr from 'vite-plugin-svgr';
 
 export default defineConfig({
-    plugins: [react(), eslint(), dts(), svgr(), reactVirtualized()],
+    plugins: [
+        react(),
+        eslint(),
+        dts(),
+        svgr({ include: '**/*.svg' }), // default is { include: "**/*.svg?react" }
+        reactVirtualized(),
+    ],
 
     build: {
         lib: {
@@ -37,11 +43,10 @@ export default defineConfig({
     },
 });
 
-
 // Workaround for react-virtualized with vite
 // https://github.com/bvaughn/react-virtualized/issues/1632#issuecomment-1483966063
 function reactVirtualized(): PluginOption {
-    const WRONG_CODE = `import { bpfrpt_proptype_WindowScroller } from "../WindowScroller.js";`
+    const WRONG_CODE = `import { bpfrpt_proptype_WindowScroller } from "../WindowScroller.js";`;
     return {
         name: 'flat:react-virtualized',
         // Note: we cannot use the `transform` hook here
@@ -50,17 +55,25 @@ function reactVirtualized(): PluginOption {
         //       so instead we manually edit the file in node_modules.
         //       all we need is to find the timing before pre-bundling.
         configResolved: async () => {
-            const require = createRequire(import.meta.url)
-            const reactVirtualizedPath = require.resolve('react-virtualized')
-            const { pathname: reactVirtualizedFilePath } = new url.URL(reactVirtualizedPath, import.meta.url)
-            const file = reactVirtualizedFilePath
-              .replace(
+            const require = createRequire(import.meta.url);
+            const reactVirtualizedPath = require.resolve('react-virtualized');
+            const { pathname: reactVirtualizedFilePath } = new url.URL(
+                reactVirtualizedPath,
+                import.meta.url
+            );
+            const file = reactVirtualizedFilePath.replace(
                 path.join('dist', 'commonjs', 'index.js'),
-                path.join('dist', 'es', 'WindowScroller', 'utils', 'onScroll.js'),
-              )
-            const code = await fs.readFile(file, 'utf-8')
-            const modified = code.replace(WRONG_CODE, '')
-            await fs.writeFile(file, modified)
+                path.join(
+                    'dist',
+                    'es',
+                    'WindowScroller',
+                    'utils',
+                    'onScroll.js'
+                )
+            );
+            const code = await fs.readFile(file, 'utf-8');
+            const modified = code.replace(WRONG_CODE, '');
+            await fs.writeFile(file, modified);
         },
-    }
+    };
 }