Drop `onConversationHeaderUpdate` listener (#6567)

10 files changed, 61 insertions, 105 deletions

diff --git a/source/features/clean-conversation-headers.tsx b/source/features/clean-conversation-headers.tsx
index d51d47c1..fdfa8ee9 100644
--- a/source/features/clean-conversation-headers.tsx
+++ b/source/features/clean-conversation-headers.tsx
@@ -7,14 +7,9 @@ import * as pageDetect from 'github-url-detection';
 
 import features from '../feature-manager';
 import getDefaultBranch from '../github-helpers/get-default-branch';
-import onConversationHeaderUpdate from '../github-events/on-conversation-header-update';
-
-async function cleanIssueHeader(): Promise<void | false> {
-	const byline = await elementReady('.gh-header-meta .flex-auto:not(.rgh-clean-conversation-headers)');
-	if (!byline) {
-		return false;
-	}
+import observe from '../helpers/selector-observer';
 
+async function cleanIssueHeader(byline: HTMLElement): Promise<void> {
 	byline.classList.add('rgh-clean-conversation-headers', 'rgh-clean-conversation-headers-hide-author');
 
 	// Shows on issues: octocat opened this issue on 1 Jan · [1 comments]
@@ -23,12 +18,7 @@ async function cleanIssueHeader(): Promise<void | false> {
 	commentCount.replaceWith(<span>{commentCount.textContent!.replace('·', '')}</span>);
 }
 
-async function cleanPrHeader(): Promise<void | false> {
-	const byline = await elementReady('.gh-header-meta > .flex-auto:not(.rgh-clean-conversation-headers)');
-	if (!byline) {
-		return false;
-	}
-
+async function cleanPrHeader(byline: HTMLElement): Promise<void> {
 	byline.classList.add('rgh-clean-conversation-headers');
 
 	// Extra author name is only shown on `isPRConversation`
@@ -57,13 +47,9 @@ async function cleanPrHeader(): Promise<void | false> {
 	}
 }
 
-async function init(): Promise<void | Deinit> {
+async function init(signal: AbortSignal): Promise<void> {
 	const cleanConversationHeader = pageDetect.isIssue() ? cleanIssueHeader : cleanPrHeader;
-
-	// Wait for the initial clean-up to finish before setting up the observer #5573
-	if ((await cleanConversationHeader()) !== false) {
-		return onConversationHeaderUpdate(cleanConversationHeader);
-	}
+	observe('.gh-header-meta .flex-auto', cleanConversationHeader, {signal});
 }
 
 void features.add(import.meta.url, {
@@ -71,7 +57,6 @@ void features.add(import.meta.url, {
 		pageDetect.isIssue,
 		pageDetect.isPR,
 	],
-	deduplicate: 'has-rgh-inner',
 	init,
 });
 
diff --git a/source/features/clear-pr-merge-commit-message.tsx b/source/features/clear-pr-merge-commit-message.tsx
index 061ff211..efa2b4ea 100644
--- a/source/features/clear-pr-merge-commit-message.tsx
+++ b/source/features/clear-pr-merge-commit-message.tsx
@@ -6,18 +6,16 @@ import * as pageDetect from 'github-url-detection';
 import features from '../feature-manager';
 import {getBranches} from '../github-helpers/pr-branches';
 import getDefaultBranch from '../github-helpers/get-default-branch';
-import onPrMergePanelOpen from '../github-events/on-pr-merge-panel-open';
-import attachElement from '../helpers/attach-element';
 import cleanCommitMessage from '../helpers/clean-commit-message';
 import {userCanLikelyMergePR} from '../github-helpers';
+import observe from '../helpers/selector-observer';
 
 const isPrAgainstDefaultBranch = async (): Promise<boolean> => getBranches().base.branch === await getDefaultBranch();
 
-async function init(): Promise<void | false> {
+async function clear(messageField: HTMLTextAreaElement): Promise<void | false> {
 	// Only run once so that it doesn't clear the field every time it's opened
 	features.unload(import.meta.url);
 
-	const messageField = select('textarea#merge_message_field')!;
 	const originalMessage = messageField.value;
 	const cleanedMessage = cleanCommitMessage(originalMessage, !await isPrAgainstDefaultBranch());
 
@@ -26,16 +24,18 @@ async function init(): Promise<void | false> {
 	}
 
 	set(messageField, cleanedMessage ? cleanedMessage + '\n' : '');
-	attachElement(messageField, {
-		after: () => (
-			<div>
-				<p className="note">
-					The description field was cleared by <a target="_blank" href="https://github.com/refined-github/refined-github/wiki/Extended-feature-descriptions#clear-pr-merge-commit-message" rel="noreferrer">Refined GitHub</a>.
-				</p>
-				<hr/>
-			</div>
-		),
-	});
+	messageField.after(
+		<div>
+			<p className="note">
+				The description field was cleared by <a target="_blank" href="https://github.com/refined-github/refined-github/wiki/Extended-feature-descriptions#clear-pr-merge-commit-message" rel="noreferrer">Refined GitHub</a>.
+			</p>
+			<hr/>
+		</div>,
+	);
+}
+
+function init(signal: AbortSignal): void {
+	observe('textarea#merge_message_field', clear, {signal});
 }
 
 void features.add(import.meta.url, {
@@ -49,10 +49,6 @@ void features.add(import.meta.url, {
 		// Don't clear 1-commit PRs #3140
 		() => select.all('.TimelineItem.js-commit').length === 1,
 	],
-	additionalListeners: [
-		onPrMergePanelOpen,
-	],
-	onlyAdditionalListeners: true,
 	awaitDomReady: true, // Appears near the end of the page anyway
 	init,
 });
diff --git a/source/features/closing-remarks.tsx b/source/features/closing-remarks.tsx
index af2dfcec..2d8014b3 100644
--- a/source/features/closing-remarks.tsx
+++ b/source/features/closing-remarks.tsx
@@ -11,9 +11,9 @@ import createBanner from '../github-helpers/banner';
 import TimelineItem from '../github-helpers/timeline-item';
 import attachElement from '../helpers/attach-element';
 import {canEditEveryComment} from './quick-comment-edit';
-import onConversationHeaderUpdate from '../github-events/on-conversation-header-update';
 import {buildRepoURL, getRepo, isRefinedGitHubRepo} from '../github-helpers';
 import {getReleaseCount} from './releases-tab';
+import observe from '../helpers/selector-observer';
 
 // TODO: Not an exact match; Moderators can edit comments but not create releases
 const canCreateRelease = canEditEveryComment;
@@ -41,38 +41,40 @@ function createReleaseUrl(): string | undefined {
 	return buildRepoURL('releases/new');
 }
 
-async function init(): Promise<void> {
+async function init(signal: AbortSignal): Promise<void> {
 	const mergeCommit = select(`.TimelineItem.js-details-container.Details a[href^="/${getRepo()!.nameWithOwner}/commit/" i] > code`)!.textContent!;
 	const tagName = await getFirstTag(mergeCommit);
 
 	if (tagName) {
-		addExistingTagLink(tagName);
+		const tagUrl = buildRepoURL('releases/tag', tagName);
+
+		// Add static box at the bottom
+		addExistingTagLinkFooter(tagName, tagUrl);
+
+		// PRs have a regular and a sticky header
+		observe('#partial-discussion-header relative-time', addExistingTagLinkToHeader.bind(null, tagName, tagUrl), {signal});
 	} else {
 		void addReleaseBanner('This PR’s merge commit doesn’t appear in any tags');
 	}
 }
 
-function addExistingTagLink(tagName: string): void {
-	const tagUrl = buildRepoURL('releases/tag', tagName);
-
-	// Select the PR header and sticky header
-	for (const discussionHeader of select.all('#partial-discussion-header relative-time:not(.rgh-first-tag)')) {
-		discussionHeader.classList.add('rgh-first-tag');
-
-		discussionHeader.parentElement!.append(
-			<span>
-				<TagIcon className="ml-2 mr-1 color-fg-muted"/>
-				<a
-					href={tagUrl}
-					className="commit-ref"
-					title={`${tagName} was the first Git tag to include this pull request`}
-				>
-					{tagName}
-				</a>
-			</span>,
-		);
-	}
+function addExistingTagLinkToHeader(tagName: string, tagUrl: string, discussionHeader: HTMLElement): void {
+	// TODO: Use :has selector instead
+	discussionHeader.parentElement!.append(
+		<span>
+			<TagIcon className="ml-2 mr-1 color-fg-muted"/>
+			<a
+				href={tagUrl}
+				className="commit-ref"
+				title={`${tagName} was the first Git tag to include this pull request`}
+			>
+				{tagName}
+			</a>
+		</span>,
+	);
+}
 
+function addExistingTagLinkFooter(tagName: string, tagUrl: string): void {
 	const linkedTag = <a href={tagUrl} className="Link--primary text-bold">{tagName}</a>;
 	attachElement('#issue-comment-box', {
 		before: () => (
@@ -118,11 +120,7 @@ void features.add(import.meta.url, {
 		pageDetect.isPRConversation,
 		pageDetect.isMergedPR,
 	],
-	additionalListeners: [
-		onConversationHeaderUpdate,
-	],
-	deduplicate: 'has-rgh-inner',
-	awaitDomReady: true, // DOM-based additionalListeners
+	awaitDomReady: true, // It must look for the merge commit
 	init,
 }, {
 	// This catches a PR while it's being merged
diff --git a/source/features/conversation-activity-filter.tsx b/source/features/conversation-activity-filter.tsx
index 1683d34b..65ca6131 100644
--- a/source/features/conversation-activity-filter.tsx
+++ b/source/features/conversation-activity-filter.tsx
@@ -2,14 +2,12 @@ import './conversation-activity-filter.css';
 import delay from 'delay';
 import React from 'dom-chef';
 import select from 'select-dom';
-import elementReady from 'element-ready';
 import * as pageDetect from 'github-url-detection';
 import {CheckIcon, EyeClosedIcon, EyeIcon, XIcon} from '@primer/octicons-react';
 
 import {wrap} from '../helpers/dom-utils';
 import features from '../feature-manager';
 import {registerHotkey} from '../github-helpers/hotkey';
-import onConversationHeaderUpdate from '../github-events/on-conversation-header-update';
 import observe from '../helpers/selector-observer';
 
 const expectedDropdownWidth = 270;
@@ -133,8 +131,9 @@ function createRadios(current: State): JSX.Element[] {
 	));
 }
 
-async function addWidget(header: string, state: State): Promise<void> {
-	const position = (await elementReady(header))!.closest('div')!;
+async function addWidget(state: State, anchor: HTMLElement): Promise<void> {
+	// TODO: use :has instead
+	const position = anchor.closest('div')!;
 	if (position.classList.contains('rgh-conversation-activity-filter')) {
 		return;
 	}
@@ -221,21 +220,24 @@ function switchToNextFilter(): void {
 }
 
 async function init(signal: AbortSignal): Promise<Deinit> {
-	const state = minorFixesIssuePages.some(url => location.href.startsWith(url))
+	const initialState = minorFixesIssuePages.some(url => location.href.startsWith(url))
 		? 'hideEventsAndCollapsedComments' // Automatically hide resolved comments on "Minor codebase updates and fixes" issue pages
 		: 'default';
 
-	await addWidget('#partial-discussion-header .gh-header-meta :is(clipboard-copy, .flex-auto)', state);
-	await addWidget('#partial-discussion-header .gh-header-sticky :is(clipboard-copy, relative-time)', state);
+	observe([
+		'#partial-discussion-header .gh-header-meta :is(clipboard-copy, .flex-auto)',
+		'#partial-discussion-header .gh-header-sticky :is(clipboard-copy, relative-time)',
+	], addWidget.bind(null, initialState), {signal});
 
-	if (state !== 'default') {
-		applyState(state);
+	if (initialState !== 'default') {
+		applyState(initialState);
 	}
 
 	window.addEventListener('hashchange', uncollapseTargetedComment, {signal});
 
 	observe('.js-timeline-item', processItem, {signal});
 
+	// TODO: use signal instead
 	return registerHotkey('h', switchToNextFilter);
 }
 
@@ -243,12 +245,8 @@ void features.add(import.meta.url, {
 	include: [
 		pageDetect.isConversation,
 	],
-	additionalListeners: [
-		onConversationHeaderUpdate,
-	],
 	shortcuts: {
 		h: 'Cycle through conversation activity filters',
 	},
-	deduplicate: 'has-rgh-inner',
 	init,
 });
diff --git a/source/features/dim-bots.tsx b/source/features/dim-bots.tsx
index a6561ed4..7329b99b 100644
--- a/source/features/dim-bots.tsx
+++ b/source/features/dim-bots.tsx
@@ -72,7 +72,6 @@ void features.add(import.meta.url, {
 		pageDetect.isBlank, // Prevent error on empty lists #5544
 	],
 	awaitDomReady: true, // TODO: Rewrite with :has()
-	deduplicate: 'has-rgh-inner',
 	init,
 });
 
diff --git a/source/features/hidden-review-comments-indicator.tsx b/source/features/hidden-review-comments-indicator.tsx
index c665fccf..7377dfe3 100644
--- a/source/features/hidden-review-comments-indicator.tsx
+++ b/source/features/hidden-review-comments-indicator.tsx
@@ -55,6 +55,7 @@ const indicatorToggleObserver = new MutationObserver(mutations => {
 function init(signal: AbortSignal): void {
 	observe('.file.js-file', element => {
 		// #observe won't observe the same element twice
+		// TODO: toggle visibility via :has selector instead
 		indicatorToggleObserver.observe(element, {
 			attributes: true,
 			attributeOldValue: true,
diff --git a/source/github-events/on-conversation-header-update.ts b/source/github-events/on-conversation-header-update.ts
deleted file mode 100644
index 300289dd..00000000
--- a/source/github-events/on-conversation-header-update.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import select from 'select-dom';
-
-export default function onConversationHeaderUpdate(callback: VoidFunction): void | Deinit {
-	const conversationHeader = select('#partial-discussion-header');
-	if (!conversationHeader) {
-		return;
-	}
-
-	const observer = new MutationObserver(callback);
-	observer.observe(conversationHeader.parentElement!, {
-		childList: true,
-	});
-
-	return observer;
-}
diff --git a/source/github-events/on-fragment-load.ts b/source/github-events/on-fragment-load.ts
index 86c10a78..85eb8828 100644
--- a/source/github-events/on-fragment-load.ts
+++ b/source/github-events/on-fragment-load.ts
@@ -13,16 +13,8 @@ function createFragmentLoadListener(fragmentSelector: string, callback: EventLis
 	delegate(fragmentSelector, 'loadstart', getDeduplicatedHandler(callback), {capture: true, signal});
 }
 
-const diffFileFragmentsSelector = [
-	'include-fragment.diff-progressive-loader', // Incremental file loader on scroll
-	'include-fragment.js-diff-entry-loader', // File diff loader on clicking "Load Diff"
-	'#files_bucket:not(.pull-request-tab-content) include-fragment', // Diff on compare pages
-].join(',');
-
-export function onDiffFileLoad(callback: EventListener, signal: AbortSignal): void {
-	createFragmentLoadListener(diffFileFragmentsSelector, callback, signal);
-}
-
+/** @deprecated Only here for `wait-for-checks` */
+// eslint-disable-next-line import/prefer-default-export -- Deprecated file
 export function onPrMergePanelLoad(callback: EventListener, signal: AbortSignal): void {
 	createFragmentLoadListener('.discussion-timeline-actions include-fragment[src$="/merging"]', callback, signal);
 }
diff --git a/source/github-events/on-pr-merge-panel-open.ts b/source/github-events/on-pr-merge-panel-open.ts
index 25d8eafc..8648c866 100644
--- a/source/github-events/on-pr-merge-panel-open.ts
+++ b/source/github-events/on-pr-merge-panel-open.ts
@@ -8,6 +8,7 @@ const delegateHandler = mem((callback: EventListener) => (event: DelegateEvent)
 	}
 });
 
+/** @deprecated Only here for `wait-for-checks` */
 export default function onPrMergePanelOpen(callback: EventListener, signal: AbortSignal): void {
 	delegate('.js-merge-pr:not(.is-rebasing)', 'details:toggled', delegateHandler(callback), {signal});
 }
diff --git a/source/helpers/simplified-element-observer.ts b/source/helpers/simplified-element-observer.ts
index dd284e98..552e8e14 100644
--- a/source/helpers/simplified-element-observer.ts
+++ b/source/helpers/simplified-element-observer.ts
@@ -1,5 +1,6 @@
 /* eslint-disable unicorn/no-object-as-default-parameter -- We want to replace the whole default object, not just part of it */
 
+/** @deprecated Only here for `wait-for-checks` */
 export default function observeElement(
 	element: Node | string,
 	listener: MutationCallback,