CaptureController

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimental:This is anexperimental technology
Check theBrowser compatibility table carefully before using this in production.

Secure context: This feature is available only insecure contexts (HTTPS), in some or allsupporting browsers.

TheCaptureController interface provides methods that can be used to further manipulate a captured display surface (captured viaMediaDevices.getDisplayMedia())

ACaptureController object is associated with a captured display surface by passing it into agetDisplayMedia() call as the value of the options object'scontroller property.

Constructor

CaptureController()Experimental: Creates a newCaptureController object instance.

Instance properties

zoomLevelExperimental: The captured display surface's current zoom level.

Instance methods

decreaseZoomLevel()Experimental: Decreases the captured display surface's zoom level by one increment.
forwardWheel()Experimental: Starts forwarding wheel events fired on the referenced element to the viewport of an associated captured display surface.
getSupportedZoomLevels()Experimental: Returns the different zoom levels supported by the captured display surface.
increaseZoomLevel()Experimental: Increases the captured display surface's zoom level by one increment.
resetZoomLevel()Experimental: Resets the captured display surface's zoom to its initial level, which is100.
setFocusBehavior()Experimental: Controls whether the captured tab or window will be focused or whether the focus will remain with the tab containing the capturing app.

Events

zoomlevelchangeExperimental: Fires when the captured display surface's zoom level changes.

Examples

// Create a new CaptureController instanceconst controller = new CaptureController();// Prompt the user to share a tab, window, or screen.const stream = await navigator.mediaDevices.getDisplayMedia({ controller });// Query the displaySurface value of the captured video trackconst [track] = stream.getVideoTracks();const displaySurface = track.getSettings().displaySurface;if (displaySurface === "browser") {  // Focus the captured tab.  controller.setFocusBehavior("focus-captured-surface");} else if (displaySurface === "window") {  // Do not move focus to the captured window.  // Keep the capturing page focused.  controller.setFocusBehavior("no-focus-change");}