feat: add enzyme and enzyme-to-json for jest snapshot serialization using enzyme, update README for new test structure/style

Author: calvinl

README.md

@@ -186,14 +186,17 @@ higher. If you experience errors, please upgrade your version of Node.js.
 
 The default testing framework is Jest, though you can use whatever you want.
 
-Tests should reside alongside the modules they are testing:
+Tests and their corresponding files such as Jest snapshots, should be co-located
+alongside the modules they are testing, in a `spec/` folder. For example:
 
 ```
-├── server
-│   ├── api
-│   │   ├── todos
-│   │   │   ├── todos.controller.js
-│   │   │   ├── todos.controller.test.js
+├── components
+│   ├── todos
+│   │   ├── TodoForm
+│   │   │   ├── spec
+│   │   │   │   ├── TodoForm.test.js
+│   │   │   ├── index.js
+│   │   │   ├── index.scss
 ```
 
 Tests can be written with ES2015, since it passes through `babel-register`.

jest.config.js

@@ -6,13 +6,17 @@ const moduleAliasesMap = mapValues(
   mapKeys(_moduleAliases, (_, alias) => `${alias}/(.*)$`),
   path => `<rootDir>/${path}/$1`
 );
-const staticFiles = '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|'
-  + 'webm|wav|mp3|m4a|aac|oga)$';
+
 const cssFiles = '\\.(css|scss|less)$';
+const staticFiles =
+  '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|' +
+  'webm|wav|mp3|m4a|aac|oga)$';
 
 module.exports = {
   verbose: true,
   moduleFileExtensions: ['js', 'jsx'],
+  snapshotSerializers: ['enzyme-to-json/serializer'],
+  setupTestFrameworkScriptFile: '<rootDir>/jest.setup.js',
   moduleNameMapper: {
     ...moduleAliasesMap,
     [staticFiles]: '<rootDir>/__mocks__/fileMock.js',

jest.setup.js

@@ -0,0 +1,5 @@
+const { configure } = require('enzyme');
+const Adapter = require('enzyme-adapter-react-16');
+
+// configure an adapter for enzyme
+configure({ adapter: new Adapter() });