3 files changed, 26 insertions, 22 deletions

diff --git a/source/features/clean-repo-tabs.tsx b/source/features/clean-repo-tabs.tsx
index 45d65f81..54553a33 100644
--- a/source/features/clean-repo-tabs.tsx
+++ b/source/features/clean-repo-tabs.tsx
@@ -10,7 +10,7 @@ import getTabCount from '../github-helpers/get-tab-count';
 import looseParseInt from '../helpers/loose-parse-int';
 import abbreviateNumber from '../helpers/abbreviate-number';
 import {buildRepoURL, getRepo} from '../github-helpers';
-import {onlyShowInDropdown, unhideOverflowDropdown} from './more-dropdown-links';
+import {unhideOverflowDropdown} from './more-dropdown-links';
 
 async function canUserEditOrganization(): Promise<boolean> {
 	return Boolean(await elementReady('.btn-primary[href$="repositories/new"]'));
@@ -31,6 +31,21 @@ function setTabCounter(tab: HTMLElement, count: number): void {
 	tabCounter.title = count > 999 ? String(count) : '';
 }
 
+function onlyShowInDropdown(id: string): void {
+	const tabItem = select(`[data-tab-item$="${id}"]`);
+	if (!tabItem && pageDetect.isEnterprise()) { // GHE #3962
+		return;
+	}
+
+	(tabItem!.closest('li') ?? tabItem!.closest('.UnderlineNav-item'))!.classList.add('d-none');
+
+	const menuItem = select(`[data-menu-item$="${id}"]`)!;
+	menuItem.removeAttribute('data-menu-item');
+	menuItem.hidden = false;
+	// The item has to be moved somewhere else because the overflow nav is order-dependent
+	select('.UnderlineNav-actions ul')!.append(menuItem);
+}
+
 const getWikiPageCount = cache.function(async (): Promise<number> => {
 	const wikiPages = await fetchDom(buildRepoURL('wiki'), '#wiki-pages-box .Counter');
 	return looseParseInt(wikiPages);
@@ -106,6 +121,9 @@ async function initProjects(): Promise<void | false> {
 async function init(): Promise<void> {
 	// The user may have disabled `more-dropdown-links` so un-hide it
 	await unhideOverflowDropdown();
+
+	// Wait for the nav dropdown to be loaded #5244
+	await elementReady('.UnderlineNav-actions ul');
 	onlyShowInDropdown('security-tab');
 	onlyShowInDropdown('insights-tab');
 }
diff --git a/source/features/more-dropdown-links.css b/source/features/more-dropdown-links.css
index 3787e19a..258fecf9 100644
--- a/source/features/more-dropdown-links.css
+++ b/source/features/more-dropdown-links.css
@@ -1,5 +1,5 @@
 /* Always show the overflow menu button */
-.rgh-has-more-dropdown .js-responsive-underlinenav-overflow {
+.rgh-has-more-dropdown .UnderlineNav-actions {
 	visibility: visible !important;
 }
 
@@ -9,6 +9,6 @@ main > :first-child {
 }
 
 /* Only show the divider if there are other items above it */
-.js-responsive-underlinenav-overflow [hidden] + .dropdown-divider {
+.UnderlineNav-actions [hidden] + .dropdown-divider {
 	display: none;
 }
diff --git a/source/features/more-dropdown-links.tsx b/source/features/more-dropdown-links.tsx
index e4b66d37..a3d51dc2 100644
--- a/source/features/more-dropdown-links.tsx
+++ b/source/features/more-dropdown-links.tsx
@@ -1,6 +1,5 @@
 import './more-dropdown-links.css';
 import React from 'dom-chef';
-import select from 'select-dom';
 import elementReady from 'element-ready';
 import * as pageDetect from 'github-url-detection';
 
@@ -18,25 +17,10 @@ export function createDropdownItem(label: string, url: string, attributes?: Reco
 	);
 }
 
-export function onlyShowInDropdown(id: string): void {
-	const tabItem = select(`[data-tab-item$="${id}"]`);
-	if (!tabItem && pageDetect.isEnterprise()) { // GHE #3962
-		return;
-	}
-
-	(tabItem!.closest('li') ?? tabItem!.closest('.UnderlineNav-item'))!.classList.add('d-none');
-
-	const menuItem = select(`[data-menu-item$="${id}"]`)!;
-	menuItem.removeAttribute('data-menu-item');
-	menuItem.hidden = false;
-	// The item has to be moved somewhere else because the overflow nav is order-dependent
-	select('.js-responsive-underlinenav-overflow ul')!.append(menuItem);
-}
-
 export async function unhideOverflowDropdown(): Promise<void> {
 	// Wait for the tab bar to be loaded
-	const repoNavigationBar = (await elementReady('.UnderlineNav-body'))!;
-	repoNavigationBar.parentElement!.classList.add('rgh-has-more-dropdown');
+	const repoNavigationBar = await elementReady('.UnderlineNav-body');
+	repoNavigationBar!.parentElement!.classList.add('rgh-has-more-dropdown');
 }
 
 async function init(): Promise<void> {
@@ -47,7 +31,9 @@ async function init(): Promise<void> {
 	const dependenciesUrl = buildRepoURL('network/dependencies');
 	await unhideOverflowDropdown();
 
-	select('.js-responsive-underlinenav-overflow ul')!.append(
+	// Wait for the nav dropdown to be loaded #5244
+	const repoNavigationDropdown = await elementReady('.UnderlineNav-actions ul');
+	repoNavigationDropdown!.append(
 		<li className="dropdown-divider" role="separator"/>,
 		createDropdownItem('Compare', compareUrl),
 		pageDetect.isEnterprise() ? '' : createDropdownItem('Dependencies', dependenciesUrl),