0

I am using onHistoryStateUpdated in my background script to check for navigation on Youtube.

chrome.webNavigation.onHistoryStateUpdated.addListener(function(details) {
    console.log(details);
    // regex checks for youtube watch page
    if ((details.url).match(regex)) {
       // match if its youtube watch page
       // do something

    } else {
        // do something else
    }
});

So, I type youtube.com in google's omnibar, that takes me to youtube homepage. This step does not print anything in the console. But then when I click on any video. I get 3 results logged in my console.

OUTPUT

frameId: 0
parentFrameId: -1
processId: 1215
tabId: 365
timeStamp: 1596402400782.9841
transitionQualifiers: []
transitionType: "link"
url: "https://www.youtube.com/"

Again the same object

frameId: 0
parentFrameId: -1
processId: 1215
tabId: 365
timeStamp: 1596402400817.138
transitionQualifiers: []
transitionType: "link"
url: "https://www.youtube.com/"

and then the output I was expecting

frameId: 0
parentFrameId: -1
processId: 1215
tabId: 365
timeStamp: 1596402400829.095
transitionQualifiers: []
transitionType: "link"
url: "https://www.youtube.com/watch?v=c3guRIWSZiQ"
__proto__: Object

Why am I getting the first 2 results?

I don't get these results if I navigate from one video to another.

Another case(which I tested and understood):

If I move to Youtube homepage from a watch page by clicking the youtube logo and then to another watch page, I get 2 results

  1. watch page to youtube homepage(by clicking logo) - one for this one(which I understand)
  2. youtube to any watch page - one for this one (and not 3 results which I got in the first place). I understand this too

I think this only happens when history is updated for the first time. (first time I moved from youtube.com to youtube.com/watch?v=* ). Am I correct? I would be grateful if someone could put more light on this behaviour.

I need to understand this because I want to perform some action when I move from youtube.com to youtube.com/watch?v=* just for the first time. How can I do that?

ray an
  • 1,132
  • 3
  • 17
  • 42
  • It simply means the site has called history.pushState or history.replaceState with the same URL. Nothing weird. See also [How to detect page navigation on YouTube and modify its appearance seamlessly?](https://stackoverflow.com/a/34100952) – wOxxOm Aug 03 '20 at 01:57
  • Is there a way to figure out first time `onHistoryStateUpdated` is called for a particular website.. eg for YouTube... When we go to `YouTube.com` from google search.. this wont call the onHistoryStateUpdated but then when i navigate to YouTube watch page from there. The method would be called(and for the first time). – ray an Aug 03 '20 at 10:41
  • Nothing prevents the site from calling it any arbitrary amount of times with the same URL so you should not make assumptions about it. A proper solution should use something else. But first, why the same URL being reported is a problem? Are you trying to avoid using onCommitted or onCompleted events? – wOxxOm Aug 03 '20 at 17:07

0 Answers0