perf: remove immer from static report

lib/static/modules/reducers/api-values.js

@@ -1,25 +1,16 @@
 import actionNames from '../action-names';
+import {applyStateUpdate} from '../utils/state';
 
 export default (state, action) => {
     switch (action.type) {
         case actionNames.INIT_GUI_REPORT:
         case actionNames.INIT_STATIC_REPORT: {
             const {apiValues} = action.payload;
 
-            return applyChanges(state, apiValues);
+            return applyStateUpdate(state, {apiValues});
         }
 
         default:
             return state;
     }
 };
-
-function applyChanges(state, apiValues) {
-    return {
-        ...state,
-        apiValues: {
-            ...state.apiValues,
-            ...apiValues
-        }
-    };
-}

lib/static/modules/reducers/bottom-progress-bar.js

@@ -1,16 +1,14 @@
 import actionNames from '../action-names';
-import {produce} from 'immer';
-import {set} from 'lodash';
+import {applyStateUpdate} from '../utils/state';
 
-export default produce((draft, action) => {
+export default ((state, action) => {
     switch (action.type) {
         case actionNames.UPDATE_BOTTOM_PROGRESS_BAR: {
             const {currentRootSuiteId} = action.payload;
-
-            return set(draft, 'progressBar.currentRootSuiteId', currentRootSuiteId);
+            return applyStateUpdate(state, {progressBar: {currentRootSuiteId}});
         }
 
         default:
-            return draft;
+            return state;
     }
 });

lib/static/modules/reducers/config.js

@@ -1,6 +1,7 @@
 import {cloneDeep} from 'lodash';
 import {CONTROL_TYPE_RADIOBUTTON} from '../../../gui/constants/custom-gui-control-types';
 import actionNames from '../action-names';
+import {applyStateUpdate} from '../utils/state';
 
 export default (state, action) => {
     switch (action.type) {
@@ -10,7 +11,7 @@ export default (state, action) => {
 
             config.errorPatterns = formatErrorPatterns(config.errorPatterns);
 
-            return applyChanges(state, config);
+            return applyStateUpdate(state, {config});
         }
 
         case actionNames.RUN_CUSTOM_GUI_ACTION: {
@@ -22,7 +23,7 @@ export default (state, action) => {
             if (type === CONTROL_TYPE_RADIOBUTTON) {
                 controls.forEach((control, i) => control.active = (controlIndex === i));
 
-                return applyChanges(state, {customGui});
+                return applyStateUpdate(state, {config: {customGui}});
             }
 
             return state;
@@ -36,13 +37,3 @@ export default (state, action) => {
 function formatErrorPatterns(errorPatterns) {
     return errorPatterns.map((patternInfo) => ({...patternInfo, regexp: new RegExp(patternInfo.pattern)}));
 }
-
-function applyChanges(state, config) {
-    return {
-        ...state,
-        config: {
-            ...state.config,
-            ...config
-        }
-    };
-}

lib/static/modules/reducers/grouped-tests/by/meta.js

@@ -1,9 +1,10 @@
 import {handleActiveResults, addGroupItem, sortGroupValues} from '../helpers';
+import {ensureDiffProperty} from '../../../utils/state';
 
-export function groupMeta({group, groupKey, ...restArgs}) {
+export function groupMeta({group, groupKey, diff = group, ...restArgs}) {
     const metaKeys = new Set();
     if (groupKey) {
-        group.byKey[groupKey] = {};
+        ensureDiffProperty(diff, ['byKey', groupKey]);
     }
 
     const resultCb = (result) => {
@@ -18,14 +19,19 @@ export function groupMeta({group, groupKey, ...restArgs}) {
                 continue;
             }
 
-            addGroupItem({group: group.byKey[groupKey], result, value});
+            addGroupItem({
+                group: group.byKey[groupKey],
+                result,
+                value,
+                diff: diff.byKey[groupKey]
+            });
         }
     };
 
     handleActiveResults({...restArgs, resultCb});
 
-    group.allKeys = [...metaKeys].sort();
+    diff.allKeys = [...metaKeys].sort();
     if (groupKey) {
-        group.byKey[groupKey] = sortGroupValues(group.byKey[groupKey]);
+        diff.byKey[groupKey] = sortGroupValues(diff.byKey[groupKey]);
     }
 }

lib/static/modules/reducers/grouped-tests/by/result.js

@@ -1,6 +1,7 @@
 import {get} from 'lodash';
 import {handleActiveResults, addGroupItem, sortGroupValues} from '../helpers';
 import {isAssertViewError} from '../../../utils';
+import {ensureDiffProperty} from '../../../utils/state';
 import {ERROR_KEY, RESULT_KEYS} from '../../../../../constants/group-tests';
 
 const imageComparisonErrorMessage = 'image comparison failed';
@@ -13,21 +14,27 @@ export function groupResult(args) {
     throw new Error(`Group key must be one of ${RESULT_KEYS.join(', ')}, but got ${args.groupKey}`);
 }
 
-function groupErrors({tree, group, groupKey, errorPatterns = [], ...viewArgs}) {
-    group.byKey[groupKey] = {};
+function groupErrors({tree, group, groupKey, errorPatterns = [], diff = group, ...viewArgs}) {
+    ensureDiffProperty(diff, ['byKey', groupKey]);
 
     const resultCb = (result) => {
         const images = result.imageIds.map((imageId) => tree.images.byId[imageId]);
         const errors = extractErrors(result, images);
 
         for (const errorText of errors) {
-            addGroupItem({group: group.byKey[groupKey], result, value: errorText, patterns: errorPatterns});
+            addGroupItem({
+                group: group.byKey[groupKey],
+                result,
+                value: errorText,
+                patterns: errorPatterns,
+                diff: diff.byKey[groupKey]
+            });
         }
     };
 
     handleActiveResults({tree, ...viewArgs, resultCb});
 
-    group.byKey[groupKey] = sortGroupValues(group.byKey[groupKey]);
+    diff.byKey[groupKey] = sortGroupValues(diff.byKey[groupKey]);
 }
 
 function extractErrors(result, images) {

lib/static/modules/reducers/grouped-tests/helpers.js

@@ -26,13 +26,13 @@ export function handleActiveResults({tree = {}, viewMode = ViewMode.ALL, filtere
     }
 }
 
-export function addGroupItem({group, result, value, patterns = []}) {
+export function addGroupItem({group, result, value, patterns = [], diff = group}) {
     const stringifiedValue = stringify(value);
     const {pattern, name} = matchGroupWithPatterns(stringifiedValue, patterns);
 
     // eslint-disable-next-line no-prototype-builtins
-    if (!group.hasOwnProperty(name)) {
-        group[name] = {
+    if ((!group || !group.hasOwnProperty(name)) && !diff.hasOwnProperty(name)) {
+        diff[name] = {
             pattern,
             name,
             browserIds: [result.parentId],
@@ -44,7 +44,7 @@ export function addGroupItem({group, result, value, patterns = []}) {
         return;
     }
 
-    const groupItem = group[name];
+    const groupItem = diff[name];
 
     if (!groupItem.browserIds.includes(result.parentId)) {
         groupItem.browserIds.push(result.parentId);

lib/static/modules/reducers/grouped-tests/index.js

@@ -1,11 +1,11 @@
-import {produce} from 'immer';
 import actionNames from '../../action-names';
 import {groupMeta} from './by/meta';
 import {groupResult} from './by/result';
 import {SECTIONS} from '../../../../constants/group-tests';
 import {parseKeyToGroupTestsBy} from '../../utils';
+import {applyStateUpdate, ensureDiffProperty} from '../../utils/state';
 
-export default produce((state, action) => {
+export default (state, action) => {
     switch (action.type) {
         case actionNames.INIT_GUI_REPORT:
         case actionNames.INIT_STATIC_REPORT:
@@ -23,30 +23,51 @@ export default produce((state, action) => {
                 view: {keyToGroupTestsBy, viewMode, filteredBrowsers, testNameFilter, strictMatchFilter}
             } = state;
             const viewArgs = {viewMode, filteredBrowsers, testNameFilter, strictMatchFilter};
+            const diff = {groupedTests: {meta: {}}};
 
             if (!keyToGroupTestsBy) {
-                groupMeta({tree, group: groupedTests.meta, ...viewArgs});
+                groupMeta({tree, group: groupedTests.meta, diff: diff.groupedTests.meta, ...viewArgs});
 
-                return;
+                return applyStateUpdate(state, diff);
             }
 
             const [groupSection, groupKey] = parseKeyToGroupTestsBy(keyToGroupTestsBy);
+            ensureDiffProperty(diff, ['groupedTests', groupSection]);
+
             const group = groupedTests[groupSection];
+            const groupDiff = diff.groupedTests[groupSection];
 
             if (groupSection === SECTIONS.RESULT) {
                 const {config: {errorPatterns}} = state;
 
-                return groupResult({tree, group, groupKey, errorPatterns, ...viewArgs});
+                groupResult({
+                    tree,
+                    group,
+                    groupKey,
+                    errorPatterns,
+                    diff: groupDiff,
+                    ...viewArgs
+                });
+
+                return applyStateUpdate(state, diff);
             }
 
             if (groupSection === SECTIONS.META) {
-                return groupMeta({tree, group, groupKey, ...viewArgs});
+                groupMeta({
+                    tree,
+                    group,
+                    groupKey,
+                    diff: groupDiff,
+                    ...viewArgs
+                });
+
+                return applyStateUpdate(state, diff);
             }
 
-            break;
+            return state;
         }
 
         default:
             return state;
     }
-});
+};

lib/static/modules/reducers/tree/helpers.js

@@ -1,12 +1,13 @@
 import {get, set} from 'lodash';
 import {EXPAND_ALL, EXPAND_ERRORS, EXPAND_RETRIES} from '../../../../constants/expand-modes';
+import {getUpdatedProperty} from '../../utils/state';
 
-export function changeNodeState(nodesStateById, nodeId, state) {
+export function changeNodeState(nodesStateById, nodeId, state, diff = nodesStateById) {
     Object.keys(state).forEach((stateName) => {
         const prevStateValue = get(nodesStateById[nodeId], stateName);
 
         if (prevStateValue !== state[stateName]) {
-            set(nodesStateById, [nodeId, stateName], state[stateName]);
+            set(diff, [nodeId, stateName], state[stateName]);
         }
     });
 }
@@ -27,17 +28,19 @@ export function shouldNodeBeOpened(expand, {errorsCb, retriesCb}) {
     return false;
 }
 
-export function getShownCheckedChildCount(tree, suiteId) {
+export function getShownCheckedChildCount(tree, suiteId, diff = tree) {
     const {suiteIds = [], browserIds = []} = tree.suites.byId[suiteId];
     const checkedChildBrowserCount = browserIds.reduce((sum, browserChildId) => {
-        const browserState = tree.browsers.stateById[browserChildId];
+        const shouldBeShown = getUpdatedProperty(tree, diff, ['browsers', 'stateById', browserChildId, 'shouldBeShown']);
+        const checkStatus = getUpdatedProperty(tree, diff, ['browsers', 'stateById', browserChildId, 'checkStatus']);
 
-        return sum + (browserState.shouldBeShown && browserState.checkStatus);
+        return sum + (shouldBeShown && checkStatus);
     }, 0);
     const checkedChildSuitesCount = suiteIds.reduce((sum, suiteChildId) => {
-        const suiteState = tree.suites.stateById[suiteChildId];
+        const shouldBeShown = getUpdatedProperty(tree, diff, ['suites', 'stateById', suiteChildId, 'shouldBeShown']);
+        const checkStatus = getUpdatedProperty(tree, diff, ['suites', 'stateById', suiteChildId, 'checkStatus']);
 
-        return sum + (suiteState.shouldBeShown && suiteState.checkStatus);
+        return sum + (shouldBeShown && checkStatus);
     }, 0);
 
     return checkedChildBrowserCount + checkedChildSuitesCount;