[63921] Wrong tab header is selected within a hierachy CF item (#19019)

Do not check for exact paths but allow parent and child routes to match

Author: HDinger

app/helpers/tabs_helper.rb

@@ -65,7 +65,7 @@ def tab_label(tab)
   end
 
   def selected_tab(tabs)
-    selected = tabs.detect { |t| t[:name].to_s == params[:tab].to_s } || tabs.detect { |t| current_page?(t[:path]) }
+    selected = tabs.detect { |t| t[:name].to_s == params[:tab].to_s } || tabs.detect { |t| tab_route_shown?(t) }
 
     return selected unless selected.nil?
 
@@ -78,4 +78,10 @@ def tabs_for_key(key, params = {})
       tab.dup.merge(path:)
     end
   end
+
+  def tab_route_shown?(tab)
+    # Check not only for exact matches but also for sub-routes, like
+    # /module_a/items and /module_a/items/:id
+    request&.path&.starts_with?(tab[:path])
+  end
 end

spec/features/custom_fields/hierarchy_custom_field_spec.rb

@@ -38,11 +38,10 @@
 
   before do
     allow(EnterpriseToken).to receive(:allows_to?).and_return(true)
+    login_as admin
   end
 
   it "lets you create, update and delete a custom field of type hierarchy" do
-    login_as admin
-
     # region CustomField creation
 
     custom_field_index_page.visit!
@@ -77,7 +76,7 @@
     fill_in "Name", with: "", fill_options: { clear: :backspace }
     fill_in "Name", with: hierarchy_name
     click_on "Save"
-    expect(page).to have_css(".PageHeader-title", text: hierarchy_name)
+    expect(page).to have_heading(hierarchy_name)
 
     # endregion
 
@@ -158,4 +157,32 @@
 
     # endregion
   end
+
+  context "when navigating the hierarchy" do
+    let(:service) { CustomFields::Hierarchy::HierarchicalItemService.new }
+    let(:custom_field) { create(:wp_custom_field, field_format: "hierarchy", hierarchy_root: nil) }
+    let!(:root) { service.generate_root(custom_field).value! }
+    let!(:luke) { service.insert_item(parent: root, label: "Luke", short: "LS").value! }
+    let!(:r2d2) { service.insert_item(parent: luke, label: "R2-D2", short: "R2").value! }
+    let!(:mouse) { service.insert_item(parent: r2d2, label: "Mouse Droid", short: "MD").value! }
+    let!(:c3po) { service.insert_item(parent: luke, label: "C-3PO", short: "3PO").value! }
+    let!(:mara) { service.insert_item(parent: root, label: "Mara", short: "MJ").value! }
+
+    before do
+      custom_field.reload
+      hierarchy_page.add_custom_field_state(custom_field)
+
+      visit custom_field_item_path(root.custom_field_id, luke)
+    end
+
+    it "can navigate and keep the tab selection (regression #63921)" do
+      # Expect items to be loaded and the tab nav to be selected correctly
+      expect(page).to have_test_selector("op-custom-fields--hierarchy-item", count: 2)
+      hierarchy_page.expect_tab "Items"
+
+      # Navigating to an item will keep the tab nav selection
+      page.find_test_selector("op-custom-fields--hierarchy-item", text: "C-3PO").click
+      hierarchy_page.expect_tab "Items"
+    end
+  end
 end

spec/support/pages/custom_fields/hierarchy_page.rb

@@ -56,6 +56,14 @@ def switch_tab(tab)
         end
       end
 
+      def expect_tab(tab)
+        @tab = tab.downcase
+
+        within_test_selector("custom_field_detail_header") do
+          expect(page).to have_css("a[href='#{path}']", text: tab, aria: { current: "page" })
+        end
+      end
+
       def open_action_menu_for(label)
         within_test_selector("op-custom-fields--hierarchy-item", text: label) do
           within_test_selector("op-hierarchy-item--action-menu") do