A11Y: when adding custom sidebar link, first input of new row should get focus (#25920)

* A11Y: when adding custom sidebar links, ensure first input of new row gets focus

* switch to afterRender decorator

spec/system/custom_sidebar_sections_spec.rb

@@ -127,6 +127,19 @@ describe "Custom sidebar sections", type: :system do
     expect(sidebar).to have_section_link("Faq", target: "_blank")
   end
 
+  it "accessibility - when new row is added in custom section, first new input is focused" do
+    sign_in user
+    visit("/latest")
+
+    sidebar.click_add_section_button
+    sidebar.click_add_link_button
+
+    is_focused =
+      page.evaluate_script("document.activeElement.classList.contains('multi-select-header')")
+
+    expect(is_focused).to be true
+  end
+
   it "allows the user to edit custom section" do
     sidebar_section = Fabricate(:sidebar_section, title: "My section", user: user)
     sidebar_url_1 = Fabricate(:sidebar_url, name: "Sidebar Tags", value: "/tags")

spec/system/page_objects/components/navigation_menu/base.rb

@@ -138,6 +138,10 @@ module PageObjects
           click_button(add_section_button_text)
         end
 
+        def click_add_link_button
+          click_button(add_link_button_text)
+        end
+
         def has_no_add_section_button?
           page.has_no_button?(add_section_button_text)
         end
@@ -183,6 +187,10 @@ module PageObjects
         def add_section_button_text
           I18n.t("js.sidebar.sections.custom.add")
         end
+
+        def add_link_button_text
+          I18n.t("js.sidebar.sections.custom.links.add")
+        end
       end
     end
   end