tests: update configuration and tests

Author: mrholek

package.json

@@ -5,15 +5,21 @@
   ],
   "scripts": {
     "charts:build": "lerna run --scope \"@coreui/react-chartjs\" build --stream",
+    "charts:test": "lerna run --scope \"@coreui/react-chartjs\" test --stream",
+    "charts:test:update": "lerna run --scope \"@coreui/react-chartjs\" test:update --stream",
     "docs:api": "lerna run --scope \"@coreui/react-docs\" api --stream",
     "docs:dev": "lerna run --scope \"@coreui/react-docs\" develop --stream",
     "docs:build": "lerna run --scope \"@coreui/react-docs\" build --stream",
     "docs:clean": "lerna run --scope \"@coreui/react-docs\" clean",
     "icons:build": "lerna run --scope \"@coreui/icons-react\" build --stream",
+    "icons:test": "lerna run --scope \"@coreui/icons-react\" test --stream",
+    "icons:test:update": "lerna run --scope \"@coreui/icons-react\" test:update --stream",
     "lib:build": "lerna run --scope \"@coreui/react\" build --stream",
+    "lib:test": "lerna run --scope \"@coreui/react\" test --stream",
+    "lib:test:update": "lerna run --scope \"@coreui/react\" test:update --stream",
     "lint": "eslint \"packages/**/src/**/*.{js,ts,tsx}\"",
-    "test": "jest --coverage",
-    "test:update": "jest --coverage --updateSnapshot"
+    "test": "npm-run-all charts:test icons:test lib:test",
+    "test:update": "npm-run-all charts:test:update icons:test:update lib:test:update"
   },
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "^5.50.0",
@@ -23,11 +29,8 @@
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
-    "jest": "^29.4.1",
-    "jest-canvas-mock": "^2.4.0",
-    "jest-environment-jsdom": "^29.4.1",
     "lerna": "^4.0.0",
-    "prettier": "^2.8.3",
-    "ts-jest": "^29.0.5"
+    "npm-run-all": "^4.1.5",
+    "prettier": "^2.8.3"
   }
 }

jest.config.js renamed to packages/coreui-react/jest.config.js

@@ -8,11 +8,7 @@
 'use strict'
 
 module.exports = {
-  moduleNameMapper: {
-    '\\.(css|scss)$': '<rootDir>/packages/coreui-icons-react/test/styleMock.js',
-  },
   preset: 'ts-jest',
-  setupFiles: ['jest-canvas-mock'],
   testEnvironment: 'jsdom',
   testPathIgnorePatterns: ['dist/'],
 }

packages/coreui-react/package.json

@@ -32,7 +32,9 @@
     "src/"
   ],
   "scripts": {
-    "build": "rollup -c --bundleConfigAsCjs"
+    "build": "rollup -c --bundleConfigAsCjs",
+    "test": "jest --coverage",
+    "test:update": "jest --coverage --updateSnapshot"
   },
   "devDependencies": {
     "@popperjs/core": "^2.11.6",
@@ -45,13 +47,16 @@
     "@types/react-dom": "^18.0.10",
     "@types/react-transition-group": "^4.4.5",
     "classnames": "^2.3.2",
+    "jest": "^29.4.1",
+    "jest-environment-jsdom": "^29.4.1",
     "prop-types": "^15.8.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-popper": "^2.3.0",
     "react-transition-group": "^4.4.5",
     "rollup": "^3.14.0",
     "tslib": "^2.5.0",
+    "ts-jest": "^29.0.5",
     "typescript": "^4.9.5"
   },
   "peerDependencies": {

packages/coreui-react/src/components/accordion/__tests__/__snapshots__/CAccordionBody.spec.tsx.snap

@@ -3,7 +3,7 @@
 exports[`CAccordionBody customize 1`] = `
 <div>
   <div
-    class="accordion-collpase collapse"
+    class="accordion-collapse collapse"
   >
     <div
       class="accordion-body"
@@ -17,7 +17,7 @@ exports[`CAccordionBody customize 1`] = `
 exports[`loads and displays CAccordionBody component 1`] = `
 <div>
   <div
-    class="accordion-collpase collapse"
+    class="accordion-collapse collapse"
   >
     <div
       class="accordion-body"

packages/coreui-react/src/components/form/__tests__/__snapshots__/CFormRange.spec.tsx.snap

@@ -8,7 +8,7 @@ exports[`CFormRange customize 1`] = `
     max="150"
     min="20"
     readonly=""
-    steps="2"
+    step="2"
     type="range"
     value="80"
   />
@@ -19,7 +19,7 @@ exports[`loads and displays CFormRange component 1`] = `
 <div>
   <input
     class="form-range"
-    steps="3"
+    step="3"
     type="range"
   />
 </div>

packages/coreui-react/src/components/offcanvas/__tests__/__snapshots__/COffcanvas.spec.tsx.snap

@@ -3,9 +3,8 @@
 exports[`COffcanvas customize and event on click backdrop 1`] = `
 <div>
   <div
-    class="offcanvas offcanvas-end show bazinga"
+    class="offcanvas offcanvas-end bazinga show"
     role="dialog"
-    style="visibility: visible;"
     tabindex="-1"
   >
     Test
@@ -19,9 +18,8 @@ exports[`COffcanvas customize and event on click backdrop 1`] = `
 exports[`COffcanvas customize and event on keypress 1`] = `
 <div>
   <div
-    class="offcanvas offcanvas-end show bazinga"
+    class="offcanvas offcanvas-end bazinga show"
     role="dialog"
-    style="visibility: visible;"
     tabindex="-1"
   >
     Test
@@ -37,12 +35,19 @@ exports[`COffcanvas customize one 1`] = `
   <div
     class="offcanvas offcanvas-start bazinga"
     role="dialog"
-    style="visibility: hidden;"
     tabindex="-1"
   >
     Test
   </div>
 </div>
 `;
 
-exports[`loads and displays COffcanvas component 1`] = `<div />`;
+exports[`loads and displays COffcanvas component 1`] = `
+<div>
+  <div
+    class="offcanvas offcanvas-top"
+    role="dialog"
+    tabindex="-1"
+  />
+</div>
+`;

packages/coreui-react/src/components/table/__tests__/__snapshots__/CTable.spec.tsx.snap

@@ -8,7 +8,6 @@ exports[`CTable customize 1`] = `
     <table
       class="table align-middle border-primary caption-top table-bordered table-borderless table-info table-hover table-sm table-striped bazinga"
     >
-      <tbody />
       <tbody>
         <tr>
           <td>
@@ -26,7 +25,6 @@ exports[`CTable full example test 1`] = `
   <table
     class="table caption-top"
   >
-    <tbody />
     <caption>
       List of users
     </caption>
@@ -194,8 +192,6 @@ exports[`loads and displays CTable component 1`] = `
 <div>
   <table
     class="table"
-  >
-    <tbody />
-  </table>
+  />
 </div>
 `;

packages/coreui-react/src/components/toast/__tests__/__snapshots__/CToast.spec.tsx.snap

@@ -57,7 +57,7 @@ exports[`CToast customize 5`] = `
   <div
     aria-atomic="true"
     aria-live="assertive"
-    class="toast fade bg-warning border-0 bazinga showing"
+    class="toast fade bg-warning border-0 bazinga show"
     role="alert"
   >
     Test