fix(tinder mode): filter images by selected browser (#379)

Author: DudaGod

lib/static/modules/selectors/tree.js

@@ -16,7 +16,7 @@ const getRootSuiteIds = (state) => {
     const viewMode = getViewMode(state);
     return viewMode === viewModes.FAILED ? state.tree.suites.failedRootIds : state.tree.suites.allRootIds;
 };
-const getImageIds = (state) => state.tree.images.allIds;
+const getBrowserIds = (state) => state.tree.browsers.allIds;
 
 const getSuiteById = (state, {suiteId}) => state.tree.suites.byId[suiteId];
 const getBrowserById = (state, {browserId}) => state.tree.browsers.byId[browserId];
@@ -54,11 +54,10 @@ export const mkGetLastImageByStateName = () => createSelector(
 );
 
 export const getAcceptableImagesByStateName = createSelector(
-    getImageIds, getBrowsers, getResults, getImages,
-    (imageIds, browsers, results, images) => {
+    getBrowserIds, getBrowsers, getResults, getImages, getFilteredBrowsers,
+    (browserIds, browsers, results, images, filteredBrowsers) => {
         const getImageInfo = (image) => {
-            const result = results[image.parentId];
-            const browser = browsers[result.parentId];
+            const browser = getImageBrowser(image, browsers, results);
 
             return {suiteId: browser.parentId, browserName: browser.name};
         };
@@ -74,8 +73,11 @@ export const getAcceptableImagesByStateName = createSelector(
                 : compareSuiteIdsRes;
         };
 
-        const preparedImages = imageIds
-            .map((imgId) => images[imgId])
+        const matchedBrowsers = browserIds
+            .map((browserId) => browsers[browserId])
+            .filter((browser) => shouldShowBrowser(browser, filteredBrowsers));
+
+        const preparedImages = flatMap(matchedBrowsers, (browser) => getBrowserImages(browser, {results, images}))
             .filter(isAcceptable)
             .sort(sortImages);
 
@@ -206,6 +208,18 @@ function getSuiteBrowsers(suite, tree) {
     return flatMap(suite.suiteIds, (suiteId) => getSuiteBrowsers(suites[suiteId], tree));
 }
 
+function getBrowserImages(node, tree) {
+    const {results, images} = tree;
+
+    if (node.imageIds) {
+        return [].concat(node.imageIds).map((imageId) => images[imageId]);
+    }
+
+    return flatMap(node.resultIds, (resultId) => {
+        return getBrowserImages(results[resultId], tree);
+    });
+}
+
 function isStatusMatchViewMode(status, viewMode) {
     if (viewMode === viewModes.ALL) {
         return true;
@@ -268,15 +282,19 @@ function getFailedTestSuites(suite, suites) {
 }
 
 function getLastImageByStateName(image, browsers, results, images) {
-    const result = results[image.parentId];
-    const browser = browsers[result.parentId];
+    const browser = getImageBrowser(image, browsers, results);
     const allBrowserImages = flatMap(browser.resultIds, (resultId) => {
         return results[resultId].imageIds.map((imgId) => images[imgId]);
     });
 
     return findLast(allBrowserImages, {stateName: image.stateName});
 }
 
+function getImageBrowser(image, browsers, results) {
+    const result = results[image.parentId];
+    return browsers[result.parentId];
+}
+
 export const areAllRootSuitesIdle = createSelector(
     getAllRootSuiteIds, getSuites,
     (allRootSuiteIds, suites) => {

test/unit/lib/static/modules/selectors/tree.js

@@ -67,8 +67,8 @@ describe('tree selectors', () => {
 
         it('should return images sorted by browser id', () => {
             const browsersById = {
-                ...mkBrowser({id: 'b2', parentId: 'suite', resultIds: ['r2']}),
-                ...mkBrowser({id: 'b1', parentId: 'suite', resultIds: ['r1']})
+                ...mkBrowser({id: 'b2', name: 'bro2', parentId: 'suite', resultIds: ['r2']}),
+                ...mkBrowser({id: 'b1', name: 'bro1', parentId: 'suite', resultIds: ['r1']})
             };
             const resultsById = {
                 ...mkResult({id: 'r1', parentId: 'b1', imageIds: ['img1']}),
@@ -85,6 +85,33 @@ describe('tree selectors', () => {
             const imagesByStateName = getAcceptableImagesByStateName(state);
             assert.deepEqual(Object.keys(imagesByStateName), ['b1 first', 'b2 second']);
         });
+
+        it('should return images from browser which matched to the passed filter', () => {
+            const browsersById = {
+                ...mkBrowser({id: 'b1', name: 'bro1', version: '1', parentId: 'suiteB', resultIds: ['r1']}),
+                ...mkBrowser({id: 'b2', name: 'bro1', version: '2', parentId: 'suiteB', resultIds: ['r2']}),
+                ...mkBrowser({id: 'b3', name: 'bro2', version: '1', parentId: 'suiteA', resultIds: ['r3']})
+            };
+            const resultsById = {
+                ...mkResult({id: 'r1', parentId: 'b1', imageIds: ['img1']}),
+                ...mkResult({id: 'r2', parentId: 'b2', imageIds: ['img2']}),
+                ...mkResult({id: 'r3', parentId: 'b3', imageIds: ['img3']})
+            };
+            const imagesById = {
+                ...mkImage({id: 'img1', parentId: 'r1', stateName: 'first', status: FAIL}),
+                ...mkImage({id: 'img2', parentId: 'r2', stateName: 'second', status: FAIL}),
+                ...mkImage({id: 'img3', parentId: 'r3', stateName: 'third', status: FAIL})
+            };
+
+            const tree = mkStateTree({browsersById, resultsById, imagesById});
+            const view = mkStateView({filteredBrowsers: [{id: 'bro1', versions: ['1']}]});
+            const state = mkState({tree, view});
+
+            assert.deepEqual(
+                getAcceptableImagesByStateName(state),
+                {'b1 first': [imagesById['img1']]}
+            );
+        });
     });
 
     describe('"mkGetLastImageByStateName" factory', () => {