tests: Make tests work again (#69)

Bojagi · Nov 14, 2024 · d4ecb87 · d4ecb87
1 parent a1a9bab
commit d4ecb87
Show file tree

Hide file tree

Showing 49 changed files with 1,278 additions and 1,762 deletions.
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -17,7 +17,7 @@ jobs:
       - name: Use Node.js
         uses: actions/setup-node@v1
         with:
-          node-version: '12.x'
+          node-version: '18.x'
 
       - name: install
         run: 'yarn'

diff --git a/.github/workflows/size-limit.yml b/.github/workflows/size-limit.yml
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -14,7 +14,7 @@ jobs:
       - name: Use Node.js
         uses: actions/setup-node@v1
         with:
-          node-version: '12.x'
+          node-version: '18.x'
 
       - name: install
         run: 'yarn'

diff --git a/jest.config.js b/jest.config.js
@@ -0,0 +1,25 @@
+const fs = require('fs');
+const path = require('path');
+
+const styleFiles = fs
+  .readdirSync(path.join(__dirname, 'src'))
+  .filter((file) => {
+    if (fs.lstatSync(path.join(__dirname, 'src', file)).isDirectory()) {
+      try {
+        return !!fs.statSync(path.join(__dirname, 'src', file, 'styles.ts'));
+      } catch {
+        return false;
+      }
+    }
+    return false;
+  })
+  .map((file) => path.join(__dirname, 'src', file, 'styles.ts'));
+
+const config = {
+  // preset: 'ts-jest',
+  collectCoverageFrom: ['src/**/*.{ts,tsx}', '!**/index.ts', '!**/*.stories.tsx'],
+  testPathIgnorePatterns: ['/node_modules/', '/build/'],
+  setupFilesAfterEnv: ['<rootDir>/jestSetup.ts', ...styleFiles],
+};
+
+module.exports = config;
diff --git a/jestSetup.ts b/jestSetup.ts
@@ -1,3 +1,4 @@
+import 'regenerator-runtime/runtime';
 import 'jest-styled-components';
 import '@testing-library/jest-dom';
 import 'jest-extended';
diff --git a/package.json b/package.json
@@ -27,8 +27,8 @@
     "lint": "eslint --ext .js,.jsx,.ts,.tsx src"
   },
   "peerDependencies": {
-    "react": "^16.8.0",
-    "react-dom": "^16.8.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "styled-components": "^5.2.1"
   },
   "devDependencies": {
@@ -51,19 +51,21 @@
     "@storybook/addon-essentials": "^6.1.11",
     "@storybook/addon-links": "^6.1.11",
     "@storybook/react": "^6.1.11",
+    "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^5.11.9",
-    "@testing-library/react": "^11.2.5",
+    "@testing-library/react": "^16.0.1",
     "@testing-library/react-hooks": "^5.0.3",
     "@types/jest": "^26.0.19",
-    "@types/react-transition-group": "^4.4.0",
+    "@types/react": "^18.3.12",
+    "@types/react-transition-group": "^4.4.11",
     "@types/requestidlecallback": "^0.3.1",
-    "@types/styled-components": "^5.1.5",
     "@types/styled-system": "^5.1.10",
     "@typescript-eslint/eslint-plugin": "4.10.0",
     "@typescript-eslint/eslint-plugin-tslint": "4.10.0",
     "@typescript-eslint/parser": "4.10.0",
     "babel-loader": "^8.2.2",
     "babel-node": "^0.0.1-security",
+    "babel-plugin-styled-components": "^2.1.4",
     "cross-env": "^7.0.3",
     "docz": "^2.3.1",
     "eslint": "7.16.0",
@@ -75,15 +77,15 @@
     "eslint-plugin-react-hooks": "4.2.0",
     "jest": "^26.6.3",
     "jest-extended": "^0.11.5",
-    "jest-styled-components": "^7.0.3",
+    "jest-styled-components": "^7.2.0",
     "prettier": "2.2.1",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "react-feather": "^2.0.9",
     "rollup": "^2.39.0",
     "rollup-plugin-terser": "^7.0.2",
     "size-limit": "^4.9.2",
-    "styled-components": "^5.2.1",
+    "styled-components": "^6.1.13",
     "styled-system": "^5.1.5",
     "ts-jest": "^26.4.4",
     "ts-node": "^9.1.1",
@@ -106,25 +108,13 @@
     "deepmerge": "^4.2.2",
     "isobject": "^4.0.0",
     "react-popper": "^2.2.4",
-    "react-transition-group": "^4.4.1",
-    "use-resize-observer": "^7.0.0"
+    "react-transition-group": "^4.4.5",
+    "use-resize-observer": "^9.1.0"
   },
   "resolutions": {
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "@types/react": "18.3.12",
     "react-docgen": "4.1.1"
-  },
-  "jest": {
-    "preset": "ts-jest",
-    "collectCoverageFrom": [
-      "src/**/*.{ts,tsx}",
-      "!**/index.ts",
-      "!**/*.stories.tsx"
-    ],
-    "testPathIgnorePatterns": [
-      "/node_modules/",
-      "/build/"
-    ],
-    "setupFilesAfterEnv": [
-      "<rootDir>/jestSetup.ts"
-    ]
   }
 }
diff --git a/src/Avatar/__snapshots__/Avatar.spec.tsx.snap b/src/Avatar/__snapshots__/Avatar.spec.tsx.snap
@@ -17,6 +17,7 @@ exports[`circle variant Render size large 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="64"
+    variant="circle"
     width="64"
   />
 </div>
@@ -39,6 +40,7 @@ exports[`circle variant Render size medium 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="40"
+    variant="circle"
     width="40"
   />
 </div>
@@ -61,6 +63,7 @@ exports[`circle variant Render size small 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="32"
+    variant="circle"
     width="32"
   />
 </div>
@@ -83,6 +86,7 @@ exports[`circle variant Render size tiny 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="24"
+    variant="circle"
     width="24"
   />
 </div>
@@ -105,6 +109,7 @@ exports[`circle variant Render size undefined 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="40"
+    variant="circle"
     width="40"
   />
 </div>
@@ -127,6 +132,7 @@ exports[`square variant Render size large 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="64"
+    variant="square"
     width="64"
   />
 </div>
@@ -149,6 +155,7 @@ exports[`square variant Render size medium 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="40"
+    variant="square"
     width="40"
   />
 </div>
@@ -171,6 +178,7 @@ exports[`square variant Render size small 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="32"
+    variant="square"
     width="32"
   />
 </div>
@@ -193,6 +201,7 @@ exports[`square variant Render size tiny 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="24"
+    variant="square"
     width="24"
   />
 </div>
@@ -215,6 +224,7 @@ exports[`square variant Render size undefined 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="40"
+    variant="square"
     width="40"
   />
 </div>
@@ -237,6 +247,7 @@ exports[`undefined variant Render size large 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="64"
+    variant="square"
     width="64"
   />
 </div>
@@ -259,6 +270,7 @@ exports[`undefined variant Render size medium 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="40"
+    variant="square"
     width="40"
   />
 </div>
@@ -281,6 +293,7 @@ exports[`undefined variant Render size small 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="32"
+    variant="square"
     width="32"
   />
 </div>
@@ -303,6 +316,7 @@ exports[`undefined variant Render size tiny 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="24"
+    variant="square"
     width="24"
   />
 </div>
@@ -325,6 +339,7 @@ exports[`undefined variant Render size undefined 1`] = `
     class="c0 c1"
     data-testid="pbl-avatar"
     height="40"
+    variant="square"
     width="40"
   />
 </div>