Question

I’d like to write a script that injects in the compose-page of gmail.

So far I’ve got this url-pattern: ["*://mail.google.com/*"]. The script successfully gets injected when loading gmail, but after that it doesn’t get re-injected when clicking links like inbox or compose. I was hoping ["*://mail.google.com/*compose"] would do it easily, but no.

Is this pattern perhaps as far as I can get, and I’ll then have to create a listener that checks when that part of the page is reloaded?

What is the most straightforward way to determine when the compose-page is loaded?

Answer 1

Content script only run when a page is truly loaded.
If you want to run code for a specific hash, inject the script at the URL without the hash, and use the hashchange to detect changes.

function checkHash() {
    if (/^#(compose|drafts)\b/.test(location.hash)) {
        // Do whatever you want
    }
}
window.addEventListener('hashchange', checkHash);
checkHash();

Instead of monitoring the location hash, it might be more effective to use setInterval to continuously check whether the desired element exists in the DOM. This is particularly useful when you want to read or write the value of a specific DOM node.