Feature/test helpers (#278)

* added test helpers for testing getters

* updating getter tests with getter helper

* updating description text for tests

* fix lint

Author: just-at-uber

babel.config.js

@@ -9,6 +9,7 @@ module.exports = {
           "~containers": "./client/containers",
           "~helpers": "./client/helpers",
           "~services": "./client/services",
+          "~test": "./test/helpers",
         },
       }
     ],

client/containers/route/getters.spec.js

@@ -20,10 +20,11 @@
 // THE SOFTWARE.
 
 import { ROUTE_PARAMS, ROUTE_QUERY } from './getter-types';
-import getters from './getters';
+import getterFns from './getters';
+import { initGetters } from '~test';
 
 describe('route getters', () => {
-  describe('calling getters[ROUTE_PARAMS](state)', () => {
+  describe('calling getters[ROUTE_PARAMS]', () => {
     describe('and state.route.params is defined', () => {
       const state = {
         route: {
@@ -35,7 +36,8 @@ describe('route getters', () => {
       };
 
       it('should return the value from state.route.params', () => {
-        const output = getters[ROUTE_PARAMS](state);
+        const getters = initGetters({ getterFns, state });
+        const output = getters[ROUTE_PARAMS];
 
         expect(output.paramA).toEqual('valueA');
         expect(output.paramB).toEqual('valueB');
@@ -48,14 +50,15 @@ describe('route getters', () => {
       };
 
       it('should return an empty object.', () => {
-        const output = getters[ROUTE_PARAMS](state);
+        const getters = initGetters({ getterFns, state });
+        const output = getters[ROUTE_PARAMS];
 
         expect(output).toEqual({});
       });
     });
   });
 
-  describe('calling getters[ROUTE_QUERY](state)', () => {
+  describe('calling getters[ROUTE_QUERY]', () => {
     describe('and state.route.query is defined', () => {
       const state = {
         route: {
@@ -67,7 +70,8 @@ describe('route getters', () => {
       };
 
       it('should return the value from state.route.query', () => {
-        const output = getters[ROUTE_QUERY](state);
+        const getters = initGetters({ getterFns, state });
+        const output = getters[ROUTE_QUERY];
 
         expect(output.queryA).toEqual('valueA');
         expect(output.queryB).toEqual('valueB');
@@ -80,7 +84,8 @@ describe('route getters', () => {
       };
 
       it('should return an empty object.', () => {
-        const output = getters[ROUTE_QUERY](state);
+        const getters = initGetters({ getterFns, state });
+        const output = getters[ROUTE_QUERY];
 
         expect(output).toEqual({});
       });

jest.config.js

@@ -139,7 +139,7 @@ module.exports = {
   // snapshotSerializers: [],
 
   // The test environment that will be used for testing
-  testEnvironment: "node",
+  testEnvironment: "jsdom",
 
   // Options that will be passed to the testEnvironment
   // testEnvironmentOptions: {},

package-lock.json

@@ -117,6 +117,7 @@
     "fetch-mock": "^7.7.0",
     "jest": "^24.9.0",
     "jest-fetch-mock": "^3.0.3",
+    "jest-useragent-mock": "^0.1.1",
     "mocha": "^4.0.1",
     "mocha-chrome": "^1.1.0",
     "moment-timezone": "^0.5.32",

package.json

@@ -0,0 +1,2 @@
+export { default as initGetters } from './init-getters';
+export { default as initStore } from './init-store';

test/helpers/index.js

@@ -0,0 +1,5 @@
+import initStore from './init-store';
+
+const initGetters = ({ getterFns, state }) => initStore({ getters: getterFns, state }).getters;
+
+export default initGetters;

test/helpers/init-getters.js

@@ -0,0 +1,10 @@
+import Vuex from 'vuex';
+
+const initStore = ({ actions = {}, getters = {}, mutations = {}, state = {} } = {}) => new Vuex.Store({
+  actions,
+  getters,
+  mutations,
+  state,
+});
+
+export default initStore;

test/helpers/init-store.js

@@ -1,17 +1,27 @@
 // polyfills for web browser to node
 import 'babel-polyfill';
-import AbortController from 'node-abort-controller'
+import AbortController from 'node-abort-controller';
 import atob from 'atob';
 import { injectMomentDurationFormat, jsonTryParse } from '~helpers';
-import { enableFetchMocks } from 'jest-fetch-mock'
+import { enableFetchMocks } from 'jest-fetch-mock';
+import { mockUserAgent } from 'jest-useragent-mock';
+import Vue from 'vue';
+import Vuex from 'vuex';
 
 global.atob = atob;
+
 global.JSON.tryParse = jsonTryParse;
+
 injectMomentDurationFormat();
 
 if (!window.AbortController) {
   window.AbortController = AbortController;
 }
 
 enableFetchMocks();
+
 window.fetch = global.fetch;
+
+mockUserAgent('chrome');
+
+Vue.use(Vuex);