Merge pull request #1 from ksenkso/merging-fix

Remove own property check, refactor tests
Ap3rtur3 · Feb 2, 2021 · 17b7631 · 17b7631
2 parents 0929d84 + 75e3904
commit 17b7631
Show file tree

Hide file tree

Showing 5 changed files with 89 additions and 43 deletions.
diff --git a/.editorconfig b/.editorconfig
@@ -1,6 +1,6 @@
 [*.{js,jsx,ts,tsx,vue}]
 indent_style = space
-indent_size = 2
+indent_size = 4
 end_of_line = lf
 trim_trailing_whitespace = true
 insert_final_newline = true

diff --git a/src/lib.js b/src/lib.js
@@ -42,10 +42,6 @@ const mergeStateWithData = (rootState, data) => {
     const newState = merge({}, rootState);
     return Object.keys(data)
         .reduce((newState, moduleName) => {
-            if (!data.hasOwnProperty(moduleName)) {
-                return newState;
-            }
-
             const moduleState = data[moduleName];
             if (moduleName === ROOT_MODULE_NAME) {
                 // Merge with root state

diff --git a/tests/unit/helpers.js b/tests/unit/helpers.js
@@ -0,0 +1,34 @@
+const Vue = require('vue');
+const Vuex = require('vuex');
+const { Plugin } = require('../../src/plugin');
+
+Vue.use(Vuex);
+Vue.use(Plugin);
+
+const createStoreGetters = (state) =>
+    Object.keys(state)
+        .reduce((getters, prop) => {
+            getters[prop] = state => state[prop];
+            return getters;
+        }, {});
+
+// Creates store and vue instance
+const createVmWithStore = (state = {}, modules = {}) => {
+    const getters = createStoreGetters(state);
+    const config = { state, getters };
+    if (Object.keys(modules).length > 0) {
+        config.modules = {};
+        for (const name in modules) {
+            const state = modules[name];
+            const getters = createStoreGetters(state);
+            config.modules[name] = { namespaced: true, state, getters };
+        }
+    }
+    const store = new Vuex.Store(config);
+
+    return new Vue({ store });
+};
+
+module.exports = {
+    createVmWithStore,
+};
diff --git a/tests/unit/hydra.spec.js b/tests/unit/hydra.spec.js
@@ -1,61 +1,38 @@
 const Vue = require('vue');
-const Vuex = require('vuex');
-const { Plugin } = require('../../src/plugin');
-let vm, store;
-
-Vue.use(Vuex);
-Vue.use(Plugin);
-
-const createStoreGetters = (state) =>
-    Object.keys(state)
-        .reduce((getters, prop) => {
-            getters[prop] = state => state[prop];
-            return getters;
-        }, {});
-
-// Creates store and vue instance
-const setupStore = (state = {}, modules = {}) => {
-    const getters = createStoreGetters(state);
-    const config = { state, getters };
-    if (Object.keys(modules).length > 0) {
-        config.modules = {};
-        for (const name in modules) {
-            const state = modules[name];
-            const getters = createStoreGetters(state);
-            config.modules[name] = { namespaced: true, state, getters };
-        }
-    }
-    store = new Vuex.Store(config);
-    vm = new Vue({ store });
-};
+const { createVmWithStore } = require('./helpers.js');
 
 describe('Hydra', () => {
     it('defines $hydrate', () => {
-        vm = new Vue();
+        const vm = new Vue();
+
         expect(vm.$hydrate).toBeDefined();
     });
 
     it('does nothing without data', () => {
         const test = 'test';
-        setupStore({ test });
+
+        const vm = createVmWithStore({ test });
         vm.$hydrate();
+
         expect(vm.$store.getters.test).toEqual(test);
     });
 
     it('hydrates root store', () => {
         const test = 'nothing';
         const hello = 'world';
         const data = { root: { test: hello } };
-        setupStore({ test });
+
+        const vm = createVmWithStore({ test });
         vm.$hydrate({ data });
+
         expect(vm.$store.getters.test).toEqual(hello);
     });
 
     it('hydrates namespaced store', () => {
         const test = 'nothing';
         const hello = 'world';
         const data = { space: { test: hello } };
-        setupStore({}, { space: { test } });
+        const vm = createVmWithStore({}, { space: { test } });
         vm.$hydrate({ data });
         expect(vm.$store.getters['space/test']).toEqual(hello);
     });
@@ -64,16 +41,20 @@ describe('Hydra', () => {
         const test = 'test';
         const data = JSON.stringify({ root: { test } });
         document.body.innerHTML = `<div id="test">${data}</div>`;
-        setupStore({ test: '' });
+
+        const vm = createVmWithStore({ test: '' });
         vm.$hydrate({ id: 'test' });
+
         expect(vm.$store.getters.test).toEqual(test);
     });
 
     it('hydrates with window data', () => {
         const test = 'test';
         window.test = { root: { test } };
-        setupStore({ test: '' });
+
+        const vm = createVmWithStore({ test: '' });
         vm.$hydrate({ name: 'test' });
+
         expect(vm.$store.getters.test).toEqual(test);
     });
 
@@ -82,8 +63,9 @@ describe('Hydra', () => {
         const test2 = 'overwrite';
         const test3 = 'remove';
         const data = { root: { test2, test3: undefined } };
-        setupStore({ test1, test2: null, test3 });
+        const vm = createVmWithStore({ test1, test2: null, test3 });
         vm.$hydrate({ data });
+
         expect(vm.$store.state.test1).toEqual(test1);
         expect(vm.$store.state.test2).toEqual(test2);
         expect(vm.$store.state.test3).toBeUndefined();
@@ -94,10 +76,12 @@ describe('Hydra', () => {
         const test2 = 'overwrite';
         const test3 = 'remove';
         const data = { module: { test2, test3: undefined } };
-        setupStore({ test1 }, {
+
+        const vm = createVmWithStore({ test1 }, {
             module: { test1, test2: null, test3 }
         });
         vm.$hydrate({ data });
+
         expect(vm.$store.state.test1).toEqual(test1);
         expect(vm.$store.state.test3).toBeUndefined();
         expect(vm.$store.state.module.test1).toEqual(test1);
@@ -113,14 +97,18 @@ describe('Hydra', () => {
             'nested/module': { test2, test3: undefined },
             'really/nested/module': { test2, test3: undefined }
         };
-        setupStore({}, {
+
+        const vm = createVmWithStore({}, {
             nested: { module: { test1, test2: null, test3 } },
             really: { nested: { module: { test1, test2: null, test3 } } },
         });
         vm.$hydrate({ data });
+
+        // check "nested" module
         expect(vm.$store.state.nested.module.test1).toEqual(test1);
         expect(vm.$store.state.nested.module.test2).toEqual(test2);
         expect(vm.$store.state.nested.module.test3).toBeUndefined();
+        // check "really nested" module
         expect(vm.$store.state.really.nested.module.test1).toEqual(test1);
         expect(vm.$store.state.really.nested.module.test2).toEqual(test2);
         expect(vm.$store.state.really.nested.module.test3).toBeUndefined();

diff --git a/tests/unit/performance.spec.js b/tests/unit/performance.spec.js
@@ -0,0 +1,28 @@
+const { createVmWithStore } = require('./helpers.js');
+
+const MAX_DEPTH = 3;
+
+function createModules(amount, depth = 0) {
+    const modules = {};
+    for (let i = 0; i < amount; i++) {
+        modules[`module${i}`] = depth === MAX_DEPTH
+            ? {}
+            : createModules(10, depth + 1);
+    }
+    return modules;
+}
+
+describe('Performance', () => {
+    it('checks performance', () => {
+        let avg = 0;
+        for (let i = 0; i < 50; i++) {
+            const vm = createVmWithStore();
+            const start = performance.now();
+            vm.$hydrate({ data: createModules(25) });
+            const end = performance.now();
+            avg += end - start;
+        }
+        avg /= 50;
+        console.log(`Hydration takes on average: ${avg} ms`);
+    });
+});