Is it possible to record the current tab of the browser using just javascript and nothing else? I don't want to use chrome or firefox extension. What I want to do is that the presenter would like to record his current tab and share it with others. If it's possible what is the best way to do this?

Is it possible to record the current tab of the browser using just javascript and nothing else? I don't want to use chrome or firefox extension. What I want to do is that the presenter would like to record his current tab and share it with others. If it's possible what is the best way to do this?

• javascript

Share Improve this question Follow asked Jun 15, 2018 at 11:10 Mo SadeghiMo Sadeghi 51988 silver badges2525 bronze badges 1

• Chrome's recorder feature, which is now bundled into developer tools (it is not a plugin), might apply to your use-case: developer.chrome./docs/devtools/recorder – Jeromy French Commented Aug 17, 2022 at 21:10

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

There is... something that is in the process of being defined: MediaCapture Screen Share API.

This will allow to create a MediaStream from different sources such as the user's screen, or one of their apps' window, or some unclear-to-me "browser" thing.
From this MediaStream, it is easy to record it with the MediaRecorder API.

Currently, no browser has really implemented what is being defined there, but you can get some experimental implementations in Firefox, and, only from extension in Chrome.

This API doesn't really define a way to choose the current tab by default though, so your users will have to select this tab themselves from a prompt.

Live Example that will currently work only in Firefox.

And mandatory code block to be able to link to the fiddle, even though this code will not work anywhere for now!

navigator.getDisplayMedia({ video: true })
  .then(stream => {
    // we have a stream, we can record it
    const chunks = [];
    const recorder = new MediaRecorder(stream);
    recorder.ondataavailable = e => chunks.push(e.data);
    recorder.onstop = e => exportVid(new Blob(chunks));
    recorder.start();
    // defineWhenWeStopRecorder(recorder)
  }, error => {
    console.log("Unable to acquire screen capture", error);
  });

I have not worked on recorder yet. But found this post that may help. It is an API.

https://hacks.mozilla/2016/04/record-almost-everything-in-the-browser-with-mediarecorder/