Screen Recording

Intro #

Our recording client supports screen recording on modern deskop browsers. Together with the screen, it can also capture the microphone and overlay the camera stream. Recording the system or browser tab sounds is also possible with some browsers.

Requirements #

Screen recording is supported on all major desktop browsers.

We always test against recent versions of Chrome, Firefox, and Safari, but the feature should also work on any Chromium-based browsers like Microsoft Edge or Brave.

Screen recording is not supported on mobile browsers. The necessary API has not yet been implemented in mobile browsers.

The user will need a microphone or other audio input source to record their screen with our recording client.

Because of the large files it creates, the screen recording feature is only available during the trial and for accounts with the PRO subscription. You can sign up for a free 14 days trial account here.

Feature Support #

Some features are only supported by some browsers and operating systems. Here’s a recent comparison:

On Chrome (and Chromium based browsers) you can record the screen together with the system or tab sounds. The system sounds can be captured only on Windows when sharing your entire screen. For the system/tab sound to be mixed with the microphone input you need to be using the now standard 2.0 embed code to embed the recording client in your web site or web app.

On Safari and Firefox on macOS, you can now share multiple windows using the macOS built-in private window picker.

The screen recording feature can be easily enabled for your embedded recording clients (see below).

How to Create a Screen Recording Capable Recorder #

From the Dashboard #

Follow these steps to create a screen recording capable recording widget and embed it into your website:

1. Sign in to your Pipe Account Dashboard at https://dashboard.addpipe.com
2. Go to the Embed Recorder page
3. On the left side, in the Options panel, select Screen + Camera in the Recorder Type drop-down
4. Click the green Generate Embed Codes button
5. Copy and paste the newly generated code into your website

From Code #

If you have an existing embed code, follow these instructions to enable the screen recording feature:

Embed Code v2.0 via HTML

Add the pipe-srec="1" attribute to the piperecorder tag.

Embed Code v2.0 via JavaScript

Add the srec property to your custom JavaScript object and give it a value of 1: srec:1 Your custom object will be passed as a parameter to PipeSDK.insert().

Embed Code v1.0

Add the srec property to the flashvars object and set it to 1 like so:

Recording the Screen, Microphone #

When screen recording is enabled, the Pipe Recording Client will show a [Record Screen] button on the initial screen.

In the example below, screen recording, recording from the webcam and uploading existing files are all enabled:

Once [Record Screen] is clicked the user will 1st be prompted to allow microphone access. The user must allow microphone access to continue to screen recording. If no microphone is found, the “Permission was denied. Could not get screen stream” error will be shown.

After microphone access is granted, the user will be presented with a new button labeled “Select screen for capture”. Clicking it will bring up the browser based dialogue for choosing the screen, window or tab to share. Chrome, Edge and other Chromium based browsers like Brave will also offer the option to share the system/tab audio at this time. Sharing the system audio is only possible on Windows. The user will be prompted to choose the surface to share every time. The option cannot be persisted for reuse. This is a security feature implemented in the browsers.

Recording the Screen, Microphone and System Sounds #

On Windows, with Edge, Chrome, or other Chromium-based browsers like Brave, it is possible to capture the system sounds when the user shares/captures their entire screen.

The Pipe Recording Client, will grab the system audio from the screen sharing stream, mix it with the microphone input and produce a screen recording with one audio track containing both the microphone and system sounds.

Recording the Screen, Camera and Microphone #

A recent update made it possible to record the screen and camera at the same time.

To start recording both the camera and the screen, the user can click on the “Record Camera” rectangle positioned in the bottom-right corner of the Pipe recording client or toggle the “Record Camera” option from the camera device selector menu. Both methods are illustrated in the following images below:

The camera feed can be resized and moved around while actively recording and the user can enable video effects (background blurring or solid color background) for the camera feed.

Camera Video Effects #

Video effects can also be added to the camera feed. These include:

• Background Blurring

  Enabling this feature applies a real-time background blurring effect to the camera feed. It’s important to note that this effect must be activated through the embed code options first. Learn how to enable the Background Blurring effect.

  

• Solid Color Background

  Enabling this effect will introduce a solid color background to the camera feed. You can choose from a preset selection of four colors or opt for a custom color using the color picker tool.

  

Screen Recording on macOS #

It is possible to record your screen on macOS using just a modern browser like Safari, Chrome or Firefox and the Pipe Recording Client.

Up to macOS Monterey 12 browsers were only able to record the entire screen. Safari prompted you to Allow it to “observe your screen”.

Starting with macOS Ventura 13, Apple has introduced a new, OS-level, screen sharing UI. It changed how macOS handles screen capture requests from browsers, putting you in control and reducing the chance of screen sharing stuff you didn’t mean to. But it was only available in Safari and FaceTime.

With this new UI, instead of an app getting permission to record everything on your screen, you can now choose to share only a specific window or multiple windows directly from the OS-level screen sharing UI, or Screen Sharing Picker as Apple calls it.

In macOS Sonoma 14 the new screen capture API and UI (ScreenCaptureKit and SCContentSharingPicker) became available to other apps. Firefox eventually switched to it starting with Firefox 132.

In macOS Sequoia 15 the old screen capture APIs were deprecated and a new warning message started being shown for apps that don’t use the new screen sharing APIs and UI.

Requesting To Bypass the System Private Window Picker #

Starting with macOS Sequoia 15, if an app is trying to record your screen without using the new privacy focused API/UI the user will be prompted by the warning: [APP] is requesting to bypass the system private window picker.

This happens because Apple deprecated older screen sharing API with macOS Sequoia 15.

So when using the Pipe Recording Client to record the screen from browsers other than Safari or Firefox 132+, you will be prompted by this warning, which is normal and expected.

macOS Screen Recording Permissions #

Across macOS versions, browsers and apps other than Safari and FaceTime will have to get an OS level permission to record the screen. Here’s how the prompt looks:

After granting permission, the user will have to restart the browser. The user only has to do this once per browser/app.

On macOS Sequoia and Sonoma you will find the list of apps which have been granted permission under System Settings > Privacy & Security > Screen & System Audio Recording .

Known Issues #

• On Chrome recording a tab will throw the error Device error: no audio or video data if no activity is registered in the captured tab (no mouse movements, no scrolling etc).
• On Firefox recording certain application windows, i.e. a Chrome window, will result in black-screen videos. The audio will be recorded as expected.
• On Safari recording small application windows will result in the window only being shown in the top left corner of the recording, while the remaining area of the recording will be black.
• On All Browsers if you have a powered MacBook with the lid closed and connected to an external monitor, the integrated “FaceTime HD Camera” input device might be available as an option for the Camera feed, but will not display any video if selected.

Articles #

We’ve written quite a bit on the topic:

• 2018 Standards Compliant Screen Capture in Chrome 70 (behind a flag)
• 2019 Standards Compliant Screen Capture in Chrome 72
• 2019 product update Screen Recording In Chrome and Firefox Without Extensions
• 2019 product update: Screen Recording With System Sounds In Chrome
• 2024 product update: Recording The Webcam And The Screen At The Same Time
• 2025 Screen Sharing Got Smarter (and More Private) on macOS: Understanding the System Private Window Picker