configures Jest and Enzyme, scaffolds testing suite

Author: jacobsfletch

demo/Grid1.demo.js

@@ -5,25 +5,25 @@ const GridDemo1 = () => (
   <div id="grid-demo-1">
     <pre style={{ marginTop: '0px' }}>
       <code>
-          hCount: 14
+        hCount: 14
         <br />
-          hGap: 10px
+        hGap: 10px
         <br />
-          vGap: 10px
+        vGap: 10px
         <br />
         {'breakpoints: {'}
         <br />
-          &emsp;s: 576
+        &emsp;s: 576
         <br />
-          &emsp;m: 768
+        &emsp;m: 768
         <br />
-          &emsp;l: 992
+        &emsp;l: 992
         <br />
-          &emsp;xl: 1200
+        &emsp;xl: 1200
         <br />
         {'}'}
         <br />
-          scopeCSSTo: #grid-demo-1
+        scopeCSSTo: #grid-demo-1
       </code>
     </pre>
     <div style={{ position: 'relative' }}>
@@ -75,13 +75,13 @@ const GridDemo1 = () => (
             >
               <pre>
                 <code>
-                    hSpan: 4
+                  hSpan: 4
                   <br />
-                    hSpanL: 12
+                  hSpanL: 12
                   <br />
-                    hSpanM: 14
+                  hSpanM: 14
                   <br />
-                    hSpanS: 6
+                  hSpanS: 6
                 </code>
               </pre>
             </Cell>
@@ -105,11 +105,11 @@ const GridDemo1 = () => (
                 >
                   <pre>
                     <code>
-                        hSpan: 4
+                      hSpan: 4
                       <br />
-                        hSpanL: 5
+                      hSpanL: 5
                       <br />
-                        hStart: 4
+                      hStart: 4
                     </code>
                   </pre>
                 </Cell>
@@ -135,11 +135,11 @@ const GridDemo1 = () => (
             >
               <pre>
                 <code>
-                    hSpan: 10
+                  hSpan: 10
                   <br />
-                    hSpanM: 14
+                  hSpanM: 14
                   <br />
-                    vStart: 1 (via inline style)
+                  vStart: 1 (via inline style)
                 </code>
               </pre>
             </Cell>

demo/Grid2.demo.js

@@ -5,25 +5,25 @@ const GridDemo2 = () => (
   <div id="grid-demo-2">
     <pre style={{ marginTop: '0px' }}>
       <code>
-          hCount: 12
+        hCount: 12
         <br />
-          hGap: columnWidth
+        hGap: columnWidth
         <br />
-          vGap: 10px
+        vGap: 10px
         <br />
         {'breakpoints: {'}
         <br />
-          &emsp;s: 576
+        &emsp;s: 576
         <br />
-          &emsp;m: 768
+        &emsp;m: 768
         <br />
-          &emsp;l: 992
+        &emsp;l: 992
         <br />
-          &emsp;xl: 1200
+        &emsp;xl: 1200
         <br />
         {'}'}
         <br />
-          scopeCSSTo: #grid-12-col-demo
+        scopeCSSTo: #grid-12-col-demo
       </code>
     </pre>
     <div style={{ position: 'relative' }}>
@@ -53,15 +53,15 @@ const GridDemo2 = () => (
             >
               <pre>
                 <code>
-                    hSpan: 6
+                  hSpan: 6
                   <br />
-                    hSpanL: 5
+                  hSpanL: 5
                   <br />
-                    hSpanM: 4
+                  hSpanM: 4
                   <br />
-                    hSpanS: 10
+                  hSpanS: 10
                   <br />
-                    hSpanXS: 12
+                  hSpanXS: 12
                 </code>
               </pre>
             </Cell>
@@ -75,15 +75,15 @@ const GridDemo2 = () => (
             >
               <pre>
                 <code>
-                    hSpan: 6
+                  hSpan: 6
                   <br />
-                    hSpanL: 5
+                  hSpanL: 5
                   <br />
-                    hSpanM: 4
+                  hSpanM: 4
                   <br />
-                    hSpanS: 10
+                  hSpanS: 10
                   <br />
-                    hSpanXS: 12
+                  hSpanXS: 12
                 </code>
               </pre>
             </Cell>
@@ -103,13 +103,13 @@ const GridDemo2 = () => (
             >
               <pre>
                 <code>
-                    hSpan: 2
+                  hSpan: 2
                   <br />
-                    hSpanM: 3
+                  hSpanM: 3
                   <br />
-                    hStart: 2
+                  hStart: 2
                   <br />
-                    hStartS: 11
+                  hStartS: 11
                 </code>
               </pre>
             </Cell>

demo/Grid3.demo.js

@@ -5,29 +5,29 @@ const GridDemo3 = () => (
   <div id="grid-demo-3">
     <pre style={{ marginTop: '0px' }}>
       <code>
-          hCount: 8
+        hCount: 8
         <br />
-          hGap: 2vw
+        hGap: 2vw
         <br />
-          vGap: 1rem
+        vGap: 1rem
         <br />
         {'breakpoints: {'}
         <br />
-          &emsp;xs: 375
+        &emsp;xs: 375
         <br />
-          &emsp;s: 600
+        &emsp;s: 600
         <br />
-          &emsp;m: 720
+        &emsp;m: 720
         <br />
-          &emsp;l: 1080
+        &emsp;l: 1080
         <br />
-          &emsp;xl: 1390
+        &emsp;xl: 1390
         <br />
         {'}'}
         <br />
-          scopeCSSTo: #grid-demo-3
+        scopeCSSTo: #grid-demo-3
         <br />
-          classPrefix: abcde
+        classPrefix: abcde
       </code>
     </pre>
     <div style={{ position: 'relative' }}>
@@ -75,9 +75,9 @@ const GridDemo3 = () => (
             >
               <pre>
                 <code>
-                    hSpan: 4
+                  hSpan: 4
                   <br />
-                    hSpanM: 8
+                  hSpanM: 8
                 </code>
               </pre>
             </Cell>

jest.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  verbose: true,
+  setupFilesAfterEnv: ['./src/index.test.js'],
+  testPathIgnorePatterns: ['./src/index.test.js'],
+};

package.json

@@ -15,10 +15,10 @@
     "ui"
   ],
   "scripts": {
-    "build": "yarn run lint && webpack --config webpack.production.config.js",
+    "build": "yarn lint && yarn test && webpack --config webpack.production.config.js",
     "dev": "webpack-dev-server --hot --inline --config webpack.development.config.js",
     "lint": "eslint .",
-    "test": "echo \"No test specified\""
+    "test": "jest"
   },
   "peerDependencies": {
     "react": "^16.8.0"
@@ -35,19 +35,22 @@
     "@babel/plugin-proposal-class-properties": "^7.8.3",
     "@babel/preset-env": "^7.8.4",
     "@babel/preset-react": "^7.8.3",
-    "@trbl/eslint-config": "^1.2.3",
+    "@trbl/eslint-config": "^1.2.4",
     "babel-eslint": "^10.0.3",
     "babel-loader": "^8.0.6",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.2",
     "eslint": "^6.8.0",
     "eslint-loader": "^3.0.3",
-    "eslint-plugin-import": "^2.20.0",
+    "eslint-plugin-import": "^2.20.1",
     "eslint-plugin-jest": "^23.6.0",
     "eslint-plugin-jest-dom": "^2.0.0",
     "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-react": "^7.18.0",
+    "eslint-plugin-react": "^7.18.3",
     "eslint-plugin-react-hooks": "^2.3.0",
     "html-webpack-plugin": "^3.2.0",
     "husky": "^4.2.1",
+    "jest": "^25.1.0",
     "lint-staged": "^10.0.6",
     "react-hot-loader": "^4.12.19",
     "webpack": "^4.41.5",

src/Cell/index.test.js

@@ -0,0 +1,3 @@
+describe('Cell', () => {
+  it.skip('skip', () => 1);
+});

src/GlobalStyles/index.test.js

@@ -0,0 +1,3 @@
+describe('GlobalStyles', () => {
+  it.skip('skip', () => 1);
+});

src/Grid/index.test.js

@@ -0,0 +1,3 @@
+describe('Grid', () => {
+  it.skip('skip', () => 1);
+});

src/GridProvider/index.test.js

@@ -0,0 +1,3 @@
+describe('GridProvider', () => {
+  it.skip('skip', () => 1);
+});

src/index.test.js

@@ -0,0 +1,4 @@
+import { configure } from 'enzyme';
+import Adapter from 'enzyme-adapter-react-16';
+
+configure({ adapter: new Adapter() });