Clear childrenEpic state when changing roadmap sort order

Changelog: fixed
EE: true

ee/app/assets/javascripts/roadmap/store/mutations.js

@@ -123,6 +123,7 @@ export default {
   },
 
   [types.SET_SORTED_BY](state, sortedBy) {
+    state.childrenEpics = {};
     state.sortedBy = sortedBy;
     resetEpics(state);
   },

ee/spec/features/groups/group_roadmap_spec.rb

@@ -26,6 +26,19 @@ RSpec.describe 'group epic roadmap', :js do
     page.find('.gl-search-box-by-click-search-button').click
   end
 
+  def expand_epic_at(index)
+    expand_buttons = page.all("button[aria-label='Expand']")
+    expand_buttons[index].click
+    wait_for_requests
+  end
+
+  def toggle_sort_direction
+    page.within('.vue-filtered-search-bar-container .sort-dropdown-container') do
+      page.find("button[title^='Sort direction']").click
+      wait_for_requests
+    end
+  end
+
   before do
     stub_licensed_features(epics: true)
     stub_feature_flags(unfiltered_epic_aggregates: false)
@@ -196,6 +209,81 @@ RSpec.describe 'group epic roadmap', :js do
       end
     end
 
+    describe 'roadmap page with sort order applied' do
+      let!(:parent_epic1) { create(:epic, title: 'Parent Epic 1', group: group, start_date: 19.days.ago, end_date: 9.days.ago) }
+      let!(:child_epic1) { create(:epic, title: 'Child Epic 1', group: group, parent_id: parent_epic1.id, start_date: 18.days.ago, end_date: 4.days.ago) }
+      let!(:child_epic2) { create(:epic, title: 'Child Epic 2', group: group, parent_id: parent_epic1.id, start_date: 17.days.ago, end_date: 6.days.ago) }
+
+      let!(:parent_epic2) { create(:epic, title: 'Parent Epic 2', group: group, start_date: 14.days.ago, end_date: 4.days.ago) }
+      let!(:child_epic3) { create(:epic, title: 'Child Epic 3', group: group, parent_id: parent_epic2.id, end_date: 4.days.ago) }
+      let!(:child_epic4) { create(:epic, title: 'Child Epic 4', group: group, parent_id: parent_epic2.id, end_date: 6.days.ago) }
+
+      before do
+        visit group_roadmap_path(group)
+        wait_for_requests
+      end
+
+      it 'renders the epics in expected order' do
+        page.within('.roadmap-container .epics-list-section') do
+          expect(page).to have_selector('.epics-list-item .epic-title', count: 5)
+          epic_titles = page.all('.epics-list-item .epic-title').collect(&:text)
+
+          expect(epic_titles).to eq([
+            closed_epic.title,
+            epic_with_critical.title,
+            parent_epic1.title,
+            parent_epic2.title,
+            epic_with_bug.title
+          ])
+
+          expand_epic_at(0)
+
+          expect(page).to have_selector('.epics-list-item .epic-title', count: 7)
+          epic_titles = page.all('.epics-list-item .epic-title').collect(&:text)
+
+          expect(epic_titles).to eq([
+            closed_epic.title,
+            epic_with_critical.title,
+            parent_epic1.title,
+            child_epic1.title,
+            child_epic2.title,
+            parent_epic2.title,
+            epic_with_bug.title
+          ])
+        end
+
+        toggle_sort_direction
+
+        page.within('.roadmap-container .epics-list-section') do
+          expect(page).to have_selector('.epics-list-item .epic-title', count: 5)
+          epic_titles = page.all('.epics-list-item .epic-title').collect(&:text)
+
+          expect(epic_titles).to eq([
+            epic_with_bug.title,
+            parent_epic2.title,
+            parent_epic1.title,
+            closed_epic.title,
+            epic_with_critical.title
+          ])
+
+          expand_epic_at(1)
+
+          expect(page).to have_selector('.epics-list-item .epic-title', count: 7)
+          epic_titles = page.all('.epics-list-item .epic-title').collect(&:text)
+
+          expect(epic_titles).to eq([
+            epic_with_bug.title,
+            parent_epic2.title,
+            parent_epic1.title,
+            child_epic2.title,
+            child_epic1.title,
+            closed_epic.title,
+            epic_with_critical.title
+          ])
+        end
+      end
+    end
+
     describe 'filtered search tokens' do
       let!(:epic1) { create(:epic, group: group, end_date: 10.days.ago) }
       let!(:epic2) { create(:epic, group: group, start_date: 2.days.ago) }

ee/spec/frontend/roadmap/store/mutations_spec.js

@@ -304,17 +304,18 @@ describe('Roadmap Store Mutations', () => {
   });
 
   describe('SET_SORTED_BY', () => {
-    it('Should set `sortedBy` to the state and reset existing epics', () => {
+    it('Should set `sortedBy` to the state and reset existing parent epics and children epics', () => {
       const sortedBy = 'start_date_asc';
       setEpicMockData(state);
 
       mutations[types.SET_SORTED_BY](state, sortedBy);
 
       expect(state).toMatchObject({
-        sortedBy,
-        epics: [],
+        childrenEpics: {},
         childrenFlags: {},
         epicIds: [],
+        epics: [],
+        sortedBy,
       });
     });
   });