Netflix video player in Chrome - how to seek?

Question

I have been unable to figure out how to do a video seek (automatically advance to a certain point in the video) in the Netflix video player running in Chrome. The currentTime property can be read but not set in the Netflix player, and when set, immediately triggers the error "Whoops! Something went wrong.". Other actions such as Play and Pause work quite well. For example, you can try the following:

1. Log into Netflix (from Google Chrome) and go to the movie Armageddon.
2. After the movie loads, pause it if it starts playing.
3. Open the Chrome Developer Tools panel. Go to the Console tab.
4. Paste the following snippet into the console and hit <ENTER>:

var video = document.evaluate('//*[@id="5670317"]/video',document).iterateNext()

Note: The id value is specific to Armageddon. If you choose a different movie, which is fine, change the id as per the id in the URL of that movie.

5. Enter the following and then press <Enter>: video.play(). Observe that the video resumes playing.

Simple enough, but how to make the video auto-advance to a specific point in the video? You may want to refer to this doc. Obviously you can manually seek by dragging the video player slider from left to right and release it someplace. You may wish to discover which method or event is called when you do this, and simulate that. I haven't had luck thus far.

Any ideas?

Answer 1

Looks like netflix changed player api. Its what I found:

const videoPlayer = netflix
  .appContext
  .state
  .playerApp
  .getAPI()
  .videoPlayer

// Getting player id
const playerSessionId = videoPlayer
  .getAllPlayerSessionIds()[0]

const player = videoPlayer
  .getVideoPlayerBySessionId(playerSessionId)

Now you can use full player API. For example player.seek or player.getCurrentTime or player.pause, etc...

Answer 2

It will only work in console log of netflix if you want it to work in chrome extension then you need to inject this code in a script tag to make this work.

const videoPlayer = netflix.appContext.state.playerApp.getAPI().videoPlayer;
const player = videoPlayer.getVideoPlayerBySessionId(videoPlayer.getAllPlayerSessionIds()[0]);

player.seek(1091243) //seek to roughly 18mins

player.getCurrentTime() // will give you the current video time.

Answer 3

Finally found a simple solution:

netflix.cadmium.UiEvents.events.resize[1].scope.events.dragend[1].handler(null, {value: 999, pointerEventData: {playing: false}});

You can set:

• position using value property
• playing state using pointerEventData.playing property

It's not complete solution, but can be useful.

Previous version of netflix player was with global object window.netflix.cadmium.objects.videoPlayer. In the recent version it's empty, but you can access this object within events listeners:

1. Open Chrome Developer Tools
2. Select "body" element
3. Select "Event Listeners"
4. Turn on "Framework listeners"
5. Select "keydown" event, "body" - handler p(e), "[[Scopes]]", 1 [[Closure]]
6. You can save this object reference with context menu - "Store as a global variable"

7. Then in new global variable you can get access to temp1.cadmium.objects.videoPlayer

   temp1.cadmium.objects.videoPlayer().getDuration() temp1.cadmium.objects.videoPlayer().seek(2283839); temp1.cadmium.objects.videoPlayer().seek(4283839);

[![enter image description here][1]][1]

I am not sure is it possible to do fully automatic. You can get access to this listeners by

getEventListeners(document.getElementsByTagName("body")[0]).keydown[0].listener

But I don't know how to get access to scopes variables

Answer 4

Building on Dmitry's response jump ahead 10 seconds by

player.seek(player.getCurrentTime() - 10000)

Answer 5

For those trying to control Netflix's video player from their extensions: I have found a simple solution.

Current time and pause status: can be easily obtained using

document.querySelector('video').currentTime
document.querySelector('video').paused

(Simply accessing this data doesn't redirect to the error page)

Resume/Pause: Here we have two options:

1. Simply execute

    document.querySelector('video').click();
   

this pauses/unpaused the video. You can use paused status fetching described above to make sure that you don't unpause video that's already paused.

2. Add script, which itself adds elements to the document with click event listeners:

        const actualCode = `
        const pauseElem = document.createElement('div');
        pauseElem.id = 'my_pause_elem';
        pauseElem.addEventListener('click', () => {
            const videoPlayer = window.netflix.appContext.state.playerApp.getAPI().videoPlayer;
            const player = videoPlayer.getVideoPlayerBySessionId(videoPlayer.getAllPlayerSessionIds()[0]);
            player.pause();
        });
   
        const resumeElem = document.createElement('div');
        resumeElem.id = 'my_resume_elem';
        resumeElem.addEventListener('click', () => {
            const videoPlayer = window.netflix.appContext.state.playerApp.getAPI().videoPlayer;
            const player = videoPlayer.getVideoPlayerBySessionId(videoPlayer.getAllPlayerSessionIds()[0]);
            player.play();
        });
   
   
        document.body.appendChild(pauseElem);
        document.body.appendChild(resumeElem);
        `;
   
        const script = document.createElement('script');
        script.textContent = actualCode;
        (document.head||document.documentElement).appendChild(script);
        script.remove();    
   

Now all you need to do is

document.getElementById('my_pause_elem').click();
document.getElementById('my_resume_elem').click();

to pause/unpause.

Seek: This has the same solution as above: add an element with an event listener, which uses spotify API to seek. Special thing here is that we need to pass a timestamp. This can be done by setting an attribute value to our element:

    const actualCode = `
    const seekElem = document.createElement('div');
    seekElem.id = "my_seek_elem";
    seekElem.addEventListener('click', () => {
        const newTime = Number(document.getElementById('my_seek_elem').getAttribute('timestamp')) * 1000;
        const videoPlayer = window.netflix.appContext.state.playerApp.getAPI().videoPlayer;
        const player = videoPlayer.getVideoPlayerBySessionId(videoPlayer.getAllPlayerSessionIds()[0]);
        player.seek(newTime);
    });
    (document.body).appendChild(seekElem);
    `;

 const script = document.createElement('script');
 script.textContent = actualCode;
 (document.head||document.documentElement).appendChild(script);
 script.remove();   

Now all we need to do is trigger this event after setting the timestamp:

document.getElementById('my_seek_elem').setAttribute('timestamp', '' + timestamp);
document.getElementById('my_seek_elem').click();

That's all!