fix: issue preventing re-execution of content_script on PWA history navigation

This commit is contained in:
Huey 2022-11-26 15:36:08 +08:00
parent a1e07a0564
commit 8490dbe1a7
No known key found for this signature in database
GPG key ID: 54C82E718C137231
2 changed files with 31 additions and 27 deletions

View file

@ -156,7 +156,7 @@ async function onTabUpdate(tabId, changeInfo) {
const currentURL = new URL(changeInfo.url); const currentURL = new URL(changeInfo.url);
if (ownMastodon.server !== currentURL.hostname){ if (ownMastodon.server !== currentURL.hostname){
browser.tabs.executeScript({ browser.tabs.executeScript({
file: "/content_script/mastodonInject.js" file: "/content_script/mastodonInject.js",
}); });
} }
} }

View file

@ -1,7 +1,5 @@
"use strict"; "use strict";
const TIMEOUT_DURATION = 20000;
/** /**
* Replacement onClick handler for Follow button. * Replacement onClick handler for Follow button.
* *
@ -40,12 +38,12 @@ function onClickInteract(event) {
* *
* @param {string} selector * @param {string} selector
* @param {boolean} [multiple=false] * @param {boolean} [multiple=false]
* @param {number} timeoutDuration * @param {number} [timeoutDuration=200000]
* @see {@link https://github.com/storybookjs/test-runner/blob/6d41927154e8dd1e4c9e7493122e24e2739a7a0f/src/setup-page.ts#L134} * @see {@link https://github.com/storybookjs/test-runner/blob/6d41927154e8dd1e4c9e7493122e24e2739a7a0f/src/setup-page.ts#L134}
* from which this was adapted * from which this was adapted
* @returns {Promise} * @returns {Promise}
*/ */
function waitForElement(selector, multiple = false, timeoutDuration) { function waitForElement(selector, multiple = false, timeoutDuration = 200000) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const getElement = () => ( const getElement = () => (
multiple multiple
@ -89,7 +87,7 @@ function waitForElement(selector, multiple = false, timeoutDuration) {
*/ */
async function injectFollowButton() { async function injectFollowButton() {
try { try {
const followButton = await waitForElement("#mastodon .account__header__tabs__buttons button:first-of-type", false, TIMEOUT_DURATION); const followButton = await waitForElement("#mastodon .account__header__tabs__buttons button:first-of-type", false);
followButton.addEventListener("click", onClickFollow); followButton.addEventListener("click", onClickFollow);
} catch (error) { } catch (error) {
// Follow button failed to appear // Follow button failed to appear
@ -107,7 +105,6 @@ async function injectInteractionButtons() {
"#mastodon .item-list[role='feed'] article[data-id] .status__action-bar button," + "#mastodon .item-list[role='feed'] article[data-id] .status__action-bar button," +
"#mastodon .detailed-status__wrapper .detailed-status__action-bar button", "#mastodon .detailed-status__wrapper .detailed-status__action-bar button",
true, true,
TIMEOUT_DURATION,
); );
replyButtons.forEach((button) => { replyButtons.forEach((button) => {
try { try {
@ -121,12 +118,36 @@ async function injectInteractionButtons() {
}); });
} }
/**
* Initialise injection for feedElement.
*
* @returns {void}
*/
async function injectFeed() {
const observer = new MutationObserver(() => {
injectInteractionButtons();
});
try {
const feedElement = await waitForElement(
"#mastodon .item-list[role='feed']",
false,
);
observer.observe(feedElement, {
childList: true, subtree: true,
});
} catch (error){
// feedElement not found
}
}
/** /**
* Initialise injection for all remote Mastodon buttons. * Initialise injection for all remote Mastodon buttons.
* *
* @returns {void} * @returns {void}
*/ */
async function init() { function init() {
injectFollowButton(); injectFollowButton();
const ogType = document.querySelector("meta[property='og:type']"); const ogType = document.querySelector("meta[property='og:type']");
@ -134,26 +155,9 @@ async function init() {
// inject only once on detail toots view pages // inject only once on detail toots view pages
if (ogType && ogType.getAttribute("content") === "article"){ if (ogType && ogType.getAttribute("content") === "article"){
injectInteractionButtons(); injectInteractionButtons();
// otherwise listen to the feed for new posts
} else { } else {
const observer = new MutationObserver(() => { // otherwise listen to the feed for new posts
injectInteractionButtons(); injectFeed();
});
try {
const feedElement = await waitForElement(
"#mastodon .item-list[role='feed']",
false,
TIMEOUT_DURATION
);
observer.observe(feedElement, {
childList: true, subtree: true,
});
} catch (error){
// feedElement not found
}
} }
} }