CaptureController: forwardWheel() method

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

The CaptureController interface's forwardWheel() method starts forwarding wheel events fired on the referenced element to the viewport of an associated captured display surface.

The forwardWheel method must be invoked via transient activation, in which case the user is asked for permission to scroll the captured page. Specifically, the only events that can successfully invoke it are click and input. If the relevant permission is already "granted", transient activation is not needed.

Syntax

forwardWheel(element)

Parameters

element: A reference to the element whose wheel events you want to forward to the associated captured display surface.

Return value

A Promise that fulfills with undefined.

Exceptions

InvalidStateError DOMException

Thrown when:

The capturing MediaStream returned by the originating MediaDevices.getDisplayMedia() call is no longer capturing, for example because the associated MediaStreamTrack objects have had stop() called on them.
The application is capturing itself.
An attempt was made to invoke forwardWheel() without transient activation, when permission to use it has not already been granted by the user.

NotAllowedError DOMException

Thrown when:

The operation is disallowed by a captured-surface-control Permissions Policy.
Permission to forward wheel events was explicitly denied by the user.

NotSupportedError DOMException

The surface type being captured is not a browser tab.

Examples

Basic `forwardWheel()` usage

In our live demo, explained in Using the Captured Surface Control API, we call a function called startForwarding() after the capturing getDisplayMedia() promise fulfills:

// Create controller and start capture
const controller = new CaptureController();
videoElem.srcObject = await navigator.mediaDevices.getDisplayMedia({
  controller,
});

// ...

startForwarding();

This function calls the forwardWheel() method, passing it a reference to the <video> element the captured stream is being displayed in:

async function startForwarding() {
  try {
    await controller.forwardWheel(videoElem);
  } catch (e) {
    console.log(e);
  }
}

Specifications

Specification
Captured Surface Control # dom-capturecontroller-forwardwheel