Limited supportUse with care and provide a fallback when broad support matters.
Embedded Limited support

Presentation API

The Presentation API shows or controls content on another display, such as a network-connected TV or projector. It is most useful when native HTML semantics or browser capabilities can replace custom implementation work.

Embedded

Overview

The Presentation API shows or controls content on another display, such as a network-connected TV or projector. It is most useful when native HTML semantics or browser capabilities can replace custom implementation work.

Browser support

Feature Desktop Mobile
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
Presentation
Experimental
47
79
47
presentation

The presentation read-only property of Navigator serves as the entry point for the Presentation API and returns a reference to Presentation object.
47
79
47
defaultRequest
Experimental

In a controlling user agent, the defaultRequest attribute MUST return the default presentation request if any, otherwise null. In a receiving browsing context, it MUST return null.
47
79
47
receiver
Experimental

The read-only Presentation attribute receiver, which is only available in browser contexts which are receiving a presentation, returns the PresentationReceiver object which can be used to access and communicate with the browser context which controls the presentation. This property is always null when accessed from outside a browser context which is…
59
79
59
PresentationAvailability
Experimental

A PresentationAvailability object is associated with available presentation displays and represents the presentation display availability for a presentation request. If the controlling user agent can monitor the list of available presentation displays in the background (without a pending request to start()), the PresentationAvailability object MUST be…
47
79
47
change_event
Experimental

`change` event
47
79
47
value
Experimental

The value attribute MUST return the last value from which it was set. The value is updated by the monitor the list of available presentation displays algorithm.
47
79
47
PresentationConnection
Experimental

The PresentationConnection interface of the Presentation API provides methods and properties for managing a single presentation. Each presentation connection is represented by a PresentationConnection object. Both the controlling user agent and receiving user agent MUST implement PresentationConnection.
47
79
47
binaryType
Experimental

When a PresentationConnection object is created, its binaryType IDL attribute MUST be set to the string "arraybuffer". Upon getting, the attribute MUST return its most recent value (the value it was last set as). Upon setting, the user agent MUST set the IDL attribute to the new value.
47
79
47
close
Experimental

When the close() method is called on a PresentationConnection, the user agent begins the process of closing the connection by sending an empty closeMessage with the closeReason set to closed.
49
79
49
close_event
Experimental

`close` event
50
79
50
connect_event
Experimental

`connect` event
50
79
50
id
Experimental

The id attribute specifies the presentation identifier of a presentation connection.
47
79
47
message_event
Experimental

`message` event
47
79
47
send
Experimental

The send() method of the PresentationConnection interface tells a controlling browsing context to send binary or text data to a presenting browsing context.
47
79
47
state
Experimental

The state attribute reflects the presentation connection's current state. Depending on the current PresentationConnectionState, the state attribute can hold one of the following values.
47
79
47
terminate
Experimental

When the terminate() method is called on a PresentationConnection, the user agent begins the process of terminating the presentation. The exact process differs depending on whether terminate() is called in the controlling or the presenting context.
48
79
48
terminate_event
Experimental

`terminate` event
50
79
50
url
Experimental

The url read-only property of the PresentationConnection interface returns the URL used to create or reconnect to the presentation.
57
79
57
PresentationConnectionAvailableEvent
Experimental

The PresentationConnectionAvailableEvent interface of the Presentation API is fired on a PresentationRequest when a connection associated with the object is created.
47
79
47
connection
Experimental

When an incoming connection is created, a receiving user agent fires a trusted event, named connectionavailable, on a PresentationReceiver. The trusted event is fired at the presentation controller's monitor, using the PresentationConnectionAvailableEvent interface, with the connection attribute set to the PresentationConnection object that was created.
47
79
47
PresentationConnectionAvailableEvent
Experimental

The PresentationConnectionAvailableEvent() constructor creates a new PresentationConnectionAvailableEvent object.
47
79
47
PresentationConnectionCloseEvent
Experimental

The PresentationConnectionCloseEvent interface of the Presentation API is fired on a PresentationConnection when it is closed.
50
79
50
message
Experimental
50
79
50
PresentationConnectionCloseEvent
Experimental

`PresentationConnectionCloseEvent()` constructor
50
79
50
reason
Experimental
50
79
50
PresentationConnectionList
Experimental

PresentationConnectionList is the collection of incoming presentation connections.
59
79
59
connectionavailable_event
Experimental

`connectionavailable` event
59
79
59
connections
Experimental
59
79
59
PresentationReceiver
Experimental

The PresentationReceiver interface of the Presentation API provides a means for a receiving browsing context to access controlling browsing contexts and communicate with them.
59
79
59
connectionList
Experimental
59
79
59
PresentationRequest
Experimental

A PresentationRequest object is used to initiate or reconnect to a presentation made by a controlling browsing context. The PresentationRequest object MUST be implemented in a controlling browsing context provided by a controlling user agent.
47
79
47
connectionavailable_event
Experimental

`connectionavailable` event
47
79
47
getAvailability
Experimental

When the getAvailability() method is called, the user agent MUST run the following steps:
47
79
47
PresentationRequest
Experimental

The PresentationRequest() constructor creates a new PresentationRequest object which creates a new PresentationRequest.
47
79
47
reconnect
Experimental

When the reconnect(presentationId) method is called on a PresentationRequest presentationRequest, the user agent MUST run the following steps to reconnect to a presentation:
47
79
47
secure_context_required
Experimental

Secure context required
61
79
51
61
start
Experimental

The start() property of the PresentationRequest interface returns a Promise that resolves with a PresentationConnection after the user agent prompts the user to select a display and grant permission to use that display.
47
79
47
Other
html.elements.iframe.sandbox.allow-presentation

`sandbox="allow-presentation"`
53
79
50
53
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Notes 1 item(s)
Removed
  • This feature was removed in a later browser version (61)

Syntax

JAVASCRIPT 
const request = new PresentationRequest('presentation.html');
const connection = await request.start();
connection.addEventListener('message', (e) => {
  console.log('Message:', e.data);
});
connection.send('Hello!');

Use cases

  • Use Presentation API

    Use Presentation API when standard HTML needs a more specific platform feature, semantic signal, or browser capability.

  • Handle edge cases

    Apply Presentation API to solve a focused requirement without redesigning the whole page architecture.

Cautions

  • Test Presentation API in your target browsers and input environments before depending on it as a primary behavior.
  • Provide a fallback path or acceptable degradation strategy when support is still limited.

Accessibility

  • Make sure Presentation API supports the intended task without making the page harder to perceive, understand, or operate.

Related links

Powered by web-features