Fix rendering logic to correctly find Epic parents

Fixes a bug where Epics are not included in the list when
their parents are not present in the list (which is a valid
usecase).

ee/app/assets/javascripts/roadmap/components/epics_list_section.vue

@@ -66,21 +66,10 @@ export default {
         left: `${this.offsetLeft}px`,
       };
     },
-    findEpicsMatchingFilter() {
-      return this.epics.reduce((acc, epic) => {
-        if (!epic.hasParent || (epic.hasParent && this.epicIds.indexOf(epic.parent.id) < 0)) {
-          acc.push(epic);
-        }
-        return acc;
-      }, []);
-    },
-    findParentEpics() {
-      return this.epics.reduce((acc, epic) => {
-        if (!epic.hasParent) {
-          acc.push(epic);
-        }
-        return acc;
-      }, []);
+    epicsWithAssociatedParents() {
+      return this.epics.filter(
+        epic => !epic.hasParent || (epic.hasParent && this.epicIds.indexOf(epic.parent.id) < 0),
+      );
     },
     displayedEpics() {
       // If roadmap is accessed from epic, return all epics
@@ -88,8 +77,8 @@ export default {
         return this.epics;
       }
 
-      // If a search is being performed, add child as parent if parent doesn't match the search
-      return this.hasFiltersApplied ? this.findEpicsMatchingFilter : this.findParentEpics;
+      // Return epics with correct parent associations.
+      return this.epicsWithAssociatedParents;
     },
   },
   mounted() {

ee/spec/frontend/roadmap/components/epics_list_section_spec.js

@@ -15,6 +15,7 @@ import {
   mockTimeframeInitialDate,
   mockGroupId,
   rawEpics,
+  mockEpicsWithParents,
   mockSortedBy,
   basePath,
   epicsPath,
@@ -119,20 +120,25 @@ describe('EpicsListSectionComponent', () => {
       });
     });
 
+    describe('epicsWithAssociatedParents', () => {
+      it('should return epics which contain parent associations', () => {
+        wrapper = createComponent({
+          epics: mockEpicsWithParents,
+        });
+
+        expect(wrapper.vm.epicsWithAssociatedParents).toEqual(mockEpicsWithParents);
+
+        wrapper.destroy();
+      });
+    });
+
     describe('displayedEpics', () => {
       beforeAll(() => {
         store.state.epicIds = ['1', '2', '3'];
       });
 
       it('returns findParentEpics method by default', () => {
-        expect(wrapper.vm.displayedEpics).toEqual(wrapper.vm.findParentEpics);
-      });
-
-      it('returns findEpicsMatchingFilter method if filtered is applied', () => {
-        wrapper.setProps({
-          hasFiltersApplied: true,
-        });
-        expect(wrapper.vm.displayedEpics).toEqual(wrapper.vm.findEpicsMatchingFilter);
+        expect(wrapper.vm.displayedEpics).toEqual(wrapper.vm.epicsWithAssociatedParents);
       });
 
       it('returns all epics if epicIid is specified', () => {

ee/spec/frontend/roadmap/mock_data.js

@@ -621,3 +621,34 @@ export const mockGroupMilestonesQueryResponse = {
     },
   },
 };
+
+export const mockEpicsWithParents = [
+  {
+    id: 'gid://gitlab-org/subgroup/Epic/1',
+    hasParent: true,
+    parent: {
+      id: 'gid://gitlab-org/Epic/1',
+    },
+  },
+  {
+    id: 'gid://gitlab-org/subgroup/Epic/2',
+    hasParent: true,
+    parent: {
+      id: 'gid://gitlab-org/subgroup/Epic/1',
+    },
+  },
+  {
+    id: 'gid://gitlab-org/subgroup/Epic/3',
+    hasParent: true,
+    parent: {
+      id: 'gid://gitlab-org/subgroup/Epic/1',
+    },
+  },
+  {
+    id: 'gid://gitlab-org/subgroup/Epic/4',
+    hasParent: true,
+    parent: {
+      id: 'gid://gitlab-org/subgroup/Epic/1',
+    },
+  },
+];