1

I'm making a chrome extension that adds some HTML to a page. If you open the page it works fine, except that if you change routes within the same website. It'll re-get the HTML for the site, but my content script won't be called again to add out custom HTML. What is the best way to re-call the content script when the route changes?

const title = document.querySelector('#about_main > div:nth-child(1) > h1');

const button = "<button style="margin-left:5px;border:none;background:none;color:#1f80c3;">&lt/&gt</button>";

const trackUserId = window.GameManager.settings.track.u_url; //Gets the author's user id
const userId = window.GameManager.settings.user.u_name; //Gets the logged in user id
const text = title.textContent;

if (trackUserId === userId) {
  console.log('match!');
  title.innerHTML = text + button;
} else {
  console.log('no match!');
}

Thanks!

Revel Carlberg West
  • 87
  • 9
  • 2
    See these examples: 1) [Is there a JavaScript / jQuery DOM change listener?](https://stackoverflow.com/a/39508954) 2) [Detect Youtube video change with injected javascript](https://stackoverflow.com/a/21668232) – wOxxOm Apr 17 '21 at 12:05
  • @wOxxOm I'm looking at the YT vid one. Will only send the event if the page change is still on a page that the `manifest.json` allows? – Revel Carlberg West Apr 17 '21 at 12:12
  • 1
    All URLs will be reported in onUpdated. To limit to the permitted URLs use webNavigation.onHistoryStateUpdated with a `url` filter. – wOxxOm Apr 17 '21 at 12:16

0 Answers0