Features are de-inited too late on ajax navigation

[fregante]

Description

Context:

• Reduce content shift on navigation #6267
• file-age-color also runs on issues and PR tab #6366 (comment)

In short, the turbo:render event is triggered when the new content is already on the page and observeSelector might have already found it.

The abort controller should be aborted before the new content is added to the page, without reintroducing the issues that #6267 fixed.

How to fix this issue

Properly detect the change of page, for example by using MutationObserver on turbo-frame instead of the turbo:render event:

refined-github/source/feature-manager.tsx

Line 302 in aeb7d63

document.addEventListener('turbo:render', () => {

How to replicate the issue + URL

Hopefully this isn't visible at the moment, but it can be reproed. Paste this into a feature like quick-new-issue

import onAbort from '../helpers/abort-controller';

void features.add(import.meta.url, {
	init(signal) {
		console.log('xx: init');
		onAbort(signal, () => {
			console.log('xx: deinit');
		});
		observe('a', () => {
			console.log('xx: found new');
		}, {signal});
	},
});

Then:

1. Visit any repo page
2. Click on another tab

Expected log

xx: init
xx: found new (100)
xx: deinit
xx: init
xx: found new (100)

Current log:

xx: init
xx: found new (100)
xx: found new (50)
xx: deinit
xx: init
xx: found new (50)

Extension version

23.3.2

Browser(s) used

Chrome

[fregante]

Ajax events can be tracked with:

['turbo:before-cache',
'turbo:before-fetch-request',
'turbo:before-fetch-response',
'turbo:before-render',
'turbo:before-stream-render',
'turbo:before-visit',
'turbo:click',
'turbo:frame-load',
'turbo:frame-render',
'turbo:load',
'turbo:reload',
'turbo:render',
'turbo:submit-end',
'turbo:submit-start',
'turbo:visit',
].map(x => document.addEventListener(x, e => console.log(x, document.querySelector('[data-hovercard-type="pull_request"]') ? '✅PR' : '❌noPR', location.pathname)))

Use:

1. Visit https://github.com/refined-github/refined-github/issues
2. Paste the above code in the console
3. Visit the pull requests tab

The expectation is that there will be a PR on the page only on turbo:render, but in reality it's already there at turbo:frame-render, with no prior "unload" event that we can listen to.

Then with the browser buttons:

4. Go back
5. Clear console
6. Go forward

This works correctly, and it would allow to use before-render as the unload event (except that the URL is /pulls in every event)

[fregante]

I might have found a related issue:

Easy repro:

1. Open PR against non-default branch sandbox#53
2. Click on the "Files" tab
3. See conversation-activity-filter