Fullscreen API Standard

# Fullscreen API

## Living Standard — Last Updated 1 January 1970

Participate:
  GitHub whatwg/fullscreen (new issue, open issues)
  IRC: #whatwg on Freenode
Commits:
  GitHub whatwg/fullscreen/commits
  [SNAPSHOT-LINK]
  @fullscreenapi
Tests:
  web-platform-tests fullscreen/ (ongoing work)
Translations (non-normative):
  日本語

## Abstract

The Fullscreen API standard defines an API for elements to display themselves fullscreen.

## 1. Terminology

This specification depends on the Infra Standard. [INFRA]

Most terminology used in this specification is from CSS, DOM, HTML, and Web IDL. [CSS] [DOM] [HTML] [WEBIDL]

A browsing context A is called a descendant browsing context of a browsing context B if and only if B is an ancestor browsing context of A.

## 2. Model

All elements have an associated fullscreen flag. Unless stated otherwise it is unset.

All `iframe` elements have an associated iframe fullscreen flag. Unless stated otherwise it is unset.

All documents have an associated fullscreen element. The fullscreen element is the topmost element in the document’s top layer whose fullscreen flag is set, if any, and null otherwise.

All documents have an associated list of pending fullscreen events, which is an ordered set of (string, element) pairs. It is initially empty.

To fullscreen an element, set element’s fullscreen flag and add it to its node document’s top layer.

To unfullscreen an element, unset element’s fullscreen flag and iframe fullscreen flag (if any), and remove it from its node document’s top layer.

To unfullscreen a document, unfullscreen all elements, within document’s top layer, whose fullscreen flag is set.

To fully exit fullscreen a document document, run these steps:

1. If document’s fullscreen element is null, terminate these steps.

2. Unfullscreen elements whose fullscreen flag is set, within document’s top layer, except for document’s fullscreen element.

3. Exit fullscreen document.

Whenever the removing steps run with a removedNode, run these steps:

1. Let document be removedNode’s node document.

2. Let nodes be removedNode’s shadow-including inclusive descendants that have their fullscreen flag set, in shadow-including tree order.

3. For each node in nodes:

   1. If node is document’s fullscreen element, exit fullscreen document.

   2. Otherwise, unfullscreen node.

   3. If document’s top layer contains node, remove node from document’s top layer.

      Other specifications can add and remove elements from top layer, so node might not be document’s fullscreen element. For example, node could be an open `dialog` element.

Whenever the unloading document cleanup steps run with a document, fully exit fullscreen document.

Fullscreen is supported if there is no previously-established user preference, security risk, or platform limitation.

An algorithm is allowed to request fullscreen if one of the following is true:

- The algorithm is triggered by user activation.

- The algorithm is triggered by a user generated orientation change.

To run the fullscreen steps for a document document, run these steps:

1. Let pairs be document’s list of pending fullscreen events.

2. Empty document’s list of pending fullscreen events.

3. For each (type, element) in pairs:

   1. Let target be element if element is connected and its node document is document, and otherwise let target be document.

   2. Fire an event named type, with its `bubbles` and `composed` attributes set to true, at target.

These steps integrate with the event loop defined in HTML. [HTML]

## 3. API

    enum FullscreenNavigationUI {
      "auto",
      "show",
      "hide"
    };

    dictionary FullscreenOptions {
      FullscreenNavigationUI navigationUI = "auto";
    };

    partial interface Element {
      Promise<void> requestFullscreen(optional FullscreenOptions options = {});

      attribute EventHandler onfullscreenchange;
      attribute EventHandler onfullscreenerror;
    };

    partial interface Document {
      [LenientSetter] readonly attribute boolean fullscreenEnabled;
      [LenientSetter, Unscopable] readonly attribute boolean fullscreen; // historical

      Promise<void> exitFullscreen();

      attribute EventHandler onfullscreenchange;
      attribute EventHandler onfullscreenerror;
    };

    partial interface mixin DocumentOrShadowRoot {
      [LenientSetter] readonly attribute Element? fullscreenElement;
    };

`promise = element . requestFullscreen([options])`
  Displays element fullscreen and resolves promise when done.

  When supplied, options’s `navigationUI` member indicates whether showing navigation UI while in fullscreen is preferred or not. If set to "`show`", navigation simplicity is preferred over screen space, and if set to "`hide`", more screen space is preferred. User agents are always free to honor user preference over the application’s. The default value "`auto`" indicates no application preference.

`document . `fullscreenEnabled``

  Returns true if document has the ability to display elements fullscreen and fullscreen is supported, or false otherwise.

`promise = document . `exitFullscreen()``

  Stops document’s fullscreen element from being displayed fullscreen and resolves promise when done.

`document . `fullscreenElement``

  Returns document’s fullscreen element.

`shadowroot . `fullscreenElement``

  Returns shadowroot’s fullscreen element.

A fullscreen element ready check for an element element returns true if all of the following are true, and false otherwise:

- element is connected.

- element’s node document is allowed to use the "`fullscreen`" feature.

The `requestFullscreen(options)` method, when invoked, must run these steps:

1. Let pending be the context object.

2. Let pendingDoc be pending’s node document.

3. Let promise be a new promise.

4. If pendingDoc is not fully active, then reject promise with a `TypeError` exception and return promise.

5. Let error be false.

6. If any of the following conditions are false, then set error to true:

   - pending’s namespace is the HTML namespace or pending is an SVG `svg` or MathML `math` element. [SVG] [MATHML]

   - pending is not a `dialog` element.

   - The fullscreen element ready check for pending returns true.

   - Fullscreen is supported.

   - This algorithm is allowed to request fullscreen.

7. Return promise, and run the remaining steps in parallel.

8. If error is false, then resize pendingDoc’s top-level browsing context’s active document’s viewport’s dimensions, optionally taking into account options’s `navigationUI` member:

   value | viewport dimensions
   --- | ---
   "`hide`" | full dimensions of the screen of the output device
   "`show`" | dimensions of the screen of the output device clamped to allow the user agent to show page navigation controls
   "`auto`" | user-agent defined, but matching one of the above

   Optionally display a message how the end user can revert this.

9. If any of the following conditions are false, then set error to true:

   - pending’s node document is pendingDoc.

   - The fullscreen element ready check for pending returns true.

10. If error is true:

    1. Append (`fullscreenerror`, pending) to pendingDoc’s list of pending fullscreen events.

    2. Reject promise with a `TypeError` exception and terminate these steps.

11. Let fullscreenElements be an ordered set initially consisting of pending.

12. While the last element in fullscreenElements is in a nested browsing context: append its browsing context container to fullscreenElements.

13. For each element in fullscreenElements:

    1. Let doc be element’s node document.

    2. If element is doc’s fullscreen element, continue.

       No need to notify observers when nothing has changed.

    3. If element is pending and pending is an `iframe` element, then set element’s iframe fullscreen flag.

    4. Fullscreen element within doc.

    5. Append (`fullscreenchange`, element) to doc’s list of pending fullscreen events.

    The order in which elements are fullscreened is not observable, because run the fullscreen steps is invoked in tree order.

14. Resolve promise with undefined.

Implementations with out-of-process browsing contexts are left as an exercise to the reader. Input welcome on potential improvements.

The `fullscreenEnabled` attribute’s getter must return true if the context object is allowed to use the "`fullscreen`" feature and fullscreen is supported, and false otherwise.

The `fullscreen` attribute’s getter must return false if context object’s fullscreen element is null, and true otherwise.

Use the `fullscreenElement` attribute instead.

The `fullscreenElement` attribute’s getter must run these steps:

1. If the context object is a shadow root and its host is not connected, then return null.

2. Let candidate be the result of retargeting fullscreen element against the context object.

3. If candidate and the context object are in the same tree, then return candidate.

4. Return null.

A document is said to be a simple fullscreen document if there is exactly one element in its top layer that has its fullscreen flag set.

A document with two elements in its top layer can be a simple fullscreen document. For example, in addition to the fullscreen element there could be an open `dialog` element.

To collect documents to unfullscreen given doc, run these steps:

1. Let docs be an ordered set consisting of doc.

2. While true:

   1. Let lastDoc be docs’s last document.

   2. Assert: lastDoc’s fullscreen element is not null.

   3. If lastDoc is not a simple fullscreen document, break.

   4. Let container be lastDoc’s browsing context container, if any, and otherwise break.

   5. If container’s iframe fullscreen flag is set, break.

   6. Append container’s node document to docs.

3. Return docs.

   This is the set of documents for which the fullscreen element will be unfullscreened, but the last document in docs might have more than one element in its top layer with the fullscreen flag set, in which case that document will still remain in fullscreen.

To exit fullscreen a document doc, run these steps:

1. Let promise be a new promise.

2. If doc is not fully active or doc’s fullscreen element is null, then reject promise with a `TypeError` exception and return promise.

3. Let resize be false.

4. Let docs be the result of collecting documents to unfullscreen given doc.

5. Let topLevelDoc be doc’s top-level browsing context’s active document.

6. If topLevelDoc is in docs, and it is a simple fullscreen document, then set doc to topLevelDoc and resize to true.

7. If doc’s fullscreen element is not connected:

   1. Append (`fullscreenchange`, doc’s fullscreen element) to doc’s list of pending fullscreen events.

8. Return promise, and run the remaining steps in parallel.

9. If resize is true, resize doc’s viewport to its "normal" dimensions.

10. If doc’s fullscreen element is null, then resolve promise with undefined and terminate these steps.

11. Let exitDocs be the result of collecting documents to unfullscreen given doc.

12. Let descendantDocs be an ordered set consisting of doc’s descendant browsing contexts' active documents whose fullscreen element is non-null, if any, in tree order.

13. For each exitDoc in exitDocs:

    1. Append (`fullscreenchange`, exitDoc’s fullscreen element) to exitDoc’s list of pending fullscreen events.

    2. If resize is true, unfullscreen exitDoc.

    3. Otherwise, unfullscreen exitDoc’s fullscreen element.

14. For each descendantDoc in descendantDocs:

    1. Append (`fullscreenchange`, descendantDoc’s fullscreen element) to descendantDoc’s list of pending fullscreen events.

    2. Unfullscreen descendantDoc.

    The order in which documents are unfullscreened is not observable, because run the fullscreen steps is invoked in tree order.

15. Resolve promise with undefined.

The `exitFullscreen()` method, when invoked, must return the result of running exit fullscreen on the context object.

The following are the event handlers (and their corresponding event handler event types) that must be supported by `Element` and `Document` objects as event handler IDL attributes:

event handler | event handler event type
--- | ---
`onfullscreenchange` | `fullscreenchange`
`onfullscreenerror` | `fullscreenerror`

These are not supported by `ShadowRoot` or `Window` objects, and there are no corresponding event handler content attributes for `Element` objects in any namespace.

## 4. UI

User agents are encouraged to implement native media fullscreen controls in terms of `requestFullscreen()` and `exitFullscreen()`.

If the end user instructs the user agent to end a fullscreen session initiated via `requestFullscreen()`, fully exit fullscreen the top-level browsing context’s active document.

The user agent may end any fullscreen session without instruction from the end user or call to `exitFullscreen()` whenever the user agent deems it necessary.

## 5. Rendering

This section is to be interpreted equivalently to the Rendering section of HTML. [HTML]

Long term CSS will define the top layer concept and its associated `::backdrop` pseudo-element as part of CSS' stacking context model. Patching CSS as done here is sketchy as hell.

### 5.1. New stacking layer

This specification introduces a new stacking layer to the Elaborate description of Stacking Contexts of CSS 2.1. It is called the top layer, comes after step 10 in the painting order, and is therefore rendered closest to the user within a viewport. Each document has one associated viewport and therefore also one top layer. [CSS]

The terminology used in this and following subsection attempts to match CSS 2.1 Appendix E.

The top layer is an ordered set of elements, rendered in the order they appear in the set. The last element in the set is rendered last, and thus appears on top.

The `z-index` property has no effect in the top layer.

Each element and `::backdrop` pseudo-element in a top layer has the following characteristics:

- It generates a new stacking context.

- Its parent stacking context is the root stacking context.

- If it consists of multiple layout boxes, the first box is used.

- It is rendered as an atomic unit as if it were a sibling of its root.

  Ancestor elements with overflow, opacity, masks, etc. cannot affect it.

- If its `position` property computes to `fixed`, its containing block is the viewport, and the initial containing block otherwise.

- If it is an element, it and its `::backdrop` pseudo-element are not rendered if its shadow-including inclusive ancestor has the `display` property set to `none`.

- If its specified `display` property is `contents`, it computes to `block`.

- If its specified `position` property is not `absolute` or `fixed`, it computes to `absolute`.

- Its outline, if any, is to be rendered before step 10 in the painting order.

- Unless overridden by another specification, its static position for `left`, `right`, and `top` is zero.

To add an element to a top layer, remove it from top layer and then append it to top layer.

In other words, element is moved to the end of top layer if it is already present.

### 5.2. `::backdrop` pseudo-element

Each element in a top layer has a `::backdrop` pseudo-element. This pseudo-element is a box rendered immediately below the element (and above the element before the element in the set, if any), within the same top layer.

The `::backdrop` pseudo-element can be used to create a backdrop that hides the underlying document for an element in a top layer (such as an element that is displayed fullscreen).

It does not inherit from any element and is not inherited from. No restrictions are made on what properties apply to this pseudo-element either.

### 5.3. `:fullscreen` pseudo-class

The `:fullscreen` pseudo-class must match any element element for which one of the following conditions is true:

- element’s fullscreen flag is set.

- element is a shadow host and the result of retargeting its node document’s fullscreen element against element is element.

This makes it different from the `fullscreenElement` API, which returns the topmost fullscreen element.

### 5.4. User-agent level style sheet defaults

    @namespace "http://www.w3.org/1999/xhtml";

    *|*:not(:root):fullscreen {
      position:fixed !important;
      top:0 !important; right:0 !important; bottom:0 !important; left:0 !important;
      margin:0 !important;
      box-sizing:border-box !important;
      min-width:0 !important;
      max-width:none !important;
      min-height:0 !important;
      max-height:none !important;
      width:100% !important;
      height:100% !important;
      transform:none !important;

      /* intentionally not !important */
      object-fit:contain;
    }

    iframe:fullscreen {
      border:none !important;
      padding:0 !important;
    }

    ::backdrop {
      position:fixed;
      top:0; right:0; bottom:0; left:0;
    }

    *|*:not(:root):fullscreen::backdrop {
      background:black;
    }

## 6. Feature Policy Integration

This specification defines a policy-controlled feature identified by the string "`fullscreen`". Its default allowlist is `'self'`.

A document’s feature policy determines whether any content in that document is allowed to go fullscreen. If disabled in any document, no content in the document will be allowed to use fullscreen.

The `allowfullscreen` attribute of the HTML `iframe` element affects the container policy for any document nested in that iframe. Unless overridden by the `allow` attribute, setting `allowfullscreen` on an iframe is equivalent to `<iframe allow="fullscreen *">`, as described in Feature Policy §6.3.1 allowfullscreen.

## 7. Security and Privacy Considerations

User agents should ensure, e.g. by means of an overlay, that the end user is aware something is displayed fullscreen. User agents should provide a means of exiting fullscreen that always works and advertise this to the user. This is to prevent a site from spoofing the end user by recreating the user agent or even operating system environment when fullscreen. See also the definition of `requestFullscreen()`.

To enable content in a nested browsing context to go fullscreen, it needs to be specifically allowed via feature policy, either through the `allowfullscreen` attribute of the HTML `iframe` element, or an appropriate declaration in the `allow` attribute of the HTML `iframe` element, or through a ``Feature-Policy`` HTTP header delivered with the document through which it is nested.

This prevents e.g. content from third parties to go fullscreen without explicit permission.

## Acknowledgments

Many thanks to Robert O’Callahan for designing the initial model and being awesome.

Thanks to Andy Earnshaw, Changwan Hong, Chris Pearce, Darin Fisher, Dave Tapuska, fantasai, Giuseppe Pascale, Glenn Maynard, Ian Clelland, Ian Hickson, Ignacio Solla, João Eiras, Josh Soref, Kagami Sascha Rosylight, Matt Falkenhagen, Mihai Balan, Mounir Lamouri, Øyvind Stenhaug, Pat Ladd, Rafał Chłodnicki, Riff Jiang, Rune Lillesveen, Sigbjørn Vik, Simon Pieters, Tab Atkins, Takayoshi Kochi, Theresa O’Connor, triple-underscore, Vincent Scheib, and Xidorn Quan for also being awesome.

This standard is edited by Philip Jägenstedt (Google, philip@foolip.org). It was originally written by Anne van Kesteren (Mozilla, annevk@annevk.nl). Tantek Çelik (Mozilla, tantek@cs.stanford.edu) sorted out legal hassles.

Copyright © 1970 WHATWG (Apple, Google, Mozilla, Microsoft). This work is licensed under a Creative Commons Attribution 4.0 International License.

## Index

### Terms defined by this specification

- add, in §5.1
- allowed to request fullscreen, in §2
- "auto", in §3
- ::backdrop, in §5.2
- collect documents to unfullscreen, in §3
- descendant browsing context, in §1
- exit fullscreen, in §3
- exitFullscreen(), in §3
- :fullscreen, in §5.3
- fullscreen, in §3
- fullscreen an element, in §2
- fullscreen element, in §2
- fullscreenElement, in §3
- fullscreen element ready check, in §3
- fullscreenEnabled, in §3
- fullscreen-feature, in §6
- fullscreen flag, in §2
- Fullscreen is supported, in §2
- FullscreenNavigationUI, in §3
- FullscreenOptions, in §3
- fully exit fullscreen, in §2
- "hide", in §3
- iframe fullscreen flag, in §2
- list of pending fullscreen events, in §2
- navigationUI, in §3
- onfullscreenchange
  - attribute for Document, in §3
  - attribute for Element, in §3
- onfullscreenerror
  - attribute for Document, in §3
  - attribute for Element, in §3
- requestFullscreen(), in §3
- requestFullscreen(options), in §3
- run the fullscreen steps, in §2
- "show", in §3
- simple fullscreen document, in §3
- top layer, in §5.1
- unfullscreen a document, in §2
- unfullscreen an element, in §2

https://dom.spec.whatwg.org/#document Referenced in:

- 3. API (2)

https://dom.spec.whatwg.org/#documentorshadowroot Referenced in:

- 3. API

https://dom.spec.whatwg.org/#element Referenced in:

- 3. API (2) (3) (4)

https://dom.spec.whatwg.org/#shadowroot Referenced in:

- 3. API

https://dom.spec.whatwg.org/#concept-tree-ancestor Referenced in:

- 5.1. New stacking layer

https://dom.spec.whatwg.org/#dom-event-bubbles Referenced in:

- 2. Model

https://dom.spec.whatwg.org/#dom-event-composed Referenced in:

- 2. Model

https://dom.spec.whatwg.org/#connected Referenced in:

- 2. Model
- 3. API (2) (3)

https://dom.spec.whatwg.org/#context-object Referenced in:

- 3. API (2) (3) (4) (5) (6) (7)

https://dom.spec.whatwg.org/#concept-document Referenced in:

- 2. Model (2) (3) (4) (5)
- 3. API (2) (3) (4)
- 5.1. New stacking layer
- 6. Feature Policy Integration
- 7. Security and Privacy Considerations

https://dom.spec.whatwg.org/#concept-element Referenced in:

- 2. Model (2) (3) (4) (5)
- 3. API (2) (3) (4) (5) (6)
- 5.3. :fullscreen pseudo-class

https://dom.spec.whatwg.org/#concept-event-fire Referenced in:

- 2. Model

https://dom.spec.whatwg.org/#concept-documentfragment-host Referenced in:

- 3. API

https://dom.spec.whatwg.org/#concept-element-namespace Referenced in:

- 3. API

https://dom.spec.whatwg.org/#concept-node-document Referenced in:

- 2. Model (2) (3) (4)
- 3. API (2) (3) (4) (5)
- 5.3. :fullscreen pseudo-class

https://dom.spec.whatwg.org/#concept-node-remove-ext Referenced in:

- 2. Model

https://dom.spec.whatwg.org/#retarget Referenced in:

- 3. API
- 5.3. :fullscreen pseudo-class

https://dom.spec.whatwg.org/#concept-tree-root Referenced in:

- 5.1. New stacking layer

https://dom.spec.whatwg.org/#element-shadow-host Referenced in:

- 5.3. :fullscreen pseudo-class

https://dom.spec.whatwg.org/#concept-shadow-root Referenced in:

- 3. API

https://dom.spec.whatwg.org/#concept-shadow-including-inclusive-ancestor Referenced in:

- 5.1. New stacking layer

https://dom.spec.whatwg.org/#concept-shadow-including-inclusive-descendant Referenced in:

- 2. Model

https://dom.spec.whatwg.org/#concept-shadow-including-tree-order Referenced in:

- 2. Model

https://dom.spec.whatwg.org/#concept-tree Referenced in:

- 3. API

https://dom.spec.whatwg.org/#concept-tree-order Referenced in:

- 3. API (2) (3)

https://wicg.github.io/feature-policy/#container-policy Referenced in:

- 6. Feature Policy Integration

https://wicg.github.io/feature-policy/#default-allowlist Referenced in:

- 6. Feature Policy Integration

https://wicg.github.io/feature-policy/#feature-policy-header Referenced in:

- 7. Security and Privacy Considerations

https://wicg.github.io/feature-policy/#policy-controlled-feature Referenced in:

- 6. Feature Policy Integration

https://html.spec.whatwg.org/multipage/webappapis.html#eventhandler Referenced in:

- 3. API (2) (3) (4)

https://html.spec.whatwg.org/multipage/window-object.html#window Referenced in:

- 3. API

https://html.spec.whatwg.org/multipage/browsers.html#active-document Referenced in:

- 3. API (2) (3)
- 4. UI

https://html.spec.whatwg.org/multipage/iframe-embed-object.html#attr-iframe-allow Referenced in:

- 6. Feature Policy Integration
- 7. Security and Privacy Considerations

https://html.spec.whatwg.org/multipage/iframe-embed-object.html#allowed-to-use Referenced in:

- 3. API (2)
- 6. Feature Policy Integration

https://html.spec.whatwg.org/multipage/iframe-embed-object.html#attr-iframe-allowfullscreen Referenced in:

- 6. Feature Policy Integration (2)
- 7. Security and Privacy Considerations

https://html.spec.whatwg.org/multipage/browsers.html#ancestor-browsing-context Referenced in:

- 1. Terminology

https://html.spec.whatwg.org/multipage/browsers.html#browsing-context Referenced in:

- 1. Terminology (2)
- 3. API

https://html.spec.whatwg.org/multipage/browsers.html#browsing-context-container Referenced in:

- 3. API (2)

https://html.spec.whatwg.org/multipage/interactive-elements.html#the-dialog-element Referenced in:

- 2. Model
- 3. API (2)

https://html.spec.whatwg.org/multipage/webappapis.html#event-handlers Referenced in:

- 3. API (2)

https://html.spec.whatwg.org/multipage/webappapis.html#event-handler-content-attributes Referenced in:

- 3. API

https://html.spec.whatwg.org/multipage/webappapis.html#event-handler-event-type Referenced in:

- 3. API (2)

https://html.spec.whatwg.org/multipage/webappapis.html#event-handler-idl-attributes Referenced in:

- 3. API

https://html.spec.whatwg.org/multipage/webappapis.html#event-loop Referenced in:

- 2. Model

https://html.spec.whatwg.org/multipage/dom.html#concept-document-feature-policy Referenced in:

- 6. Feature Policy Integration

https://html.spec.whatwg.org/multipage/browsers.html#fully-active Referenced in:

- 3. API (2)

https://html.spec.whatwg.org/multipage/iframe-embed-object.html#the-iframe-element Referenced in:

- 2. Model
- 3. API
- 6. Feature Policy Integration
- 7. Security and Privacy Considerations (2)

https://html.spec.whatwg.org/multipage/infrastructure.html#in-parallel Referenced in:

- 3. API (2)

https://html.spec.whatwg.org/multipage/browsers.html#nested-browsing-context Referenced in:

- 3. API
- 7. Security and Privacy Considerations

https://html.spec.whatwg.org/multipage/browsers.html#top-level-browsing-context Referenced in:

- 3. API (2)
- 4. UI

https://html.spec.whatwg.org/multipage/interaction.html#triggered-by-user-activation Referenced in:

- 2. Model

https://html.spec.whatwg.org/multipage/browsing-the-web.html#unloading-document-cleanup-steps Referenced in:

- 2. Model

https://infra.spec.whatwg.org/#set-append Referenced in:

- 3. API (2) (3) (4) (5) (6) (7)
- 5.1. New stacking layer

https://infra.spec.whatwg.org/#iteration-break Referenced in:

- 3. API (2) (3)

https://infra.spec.whatwg.org/#list-contain Referenced in:

- 2. Model

https://infra.spec.whatwg.org/#iteration-continue Referenced in:

- 3. API

https://infra.spec.whatwg.org/#list-empty Referenced in:

- 2. Model

https://infra.spec.whatwg.org/#list-iterate Referenced in:

- 2. Model (2)
- 3. API (2) (3)

https://infra.spec.whatwg.org/#html-namespace Referenced in:

- 3. API

https://infra.spec.whatwg.org/#ordered-set Referenced in:

- 2. Model
- 3. API (2) (3)
- 5.1. New stacking layer

https://infra.spec.whatwg.org/#pair Referenced in:

- 2. Model

https://infra.spec.whatwg.org/#list-remove Referenced in:

- 2. Model (2)
- 5.1. New stacking layer

https://infra.spec.whatwg.org/#string Referenced in:

- 2. Model

https://infra.spec.whatwg.org/#iteration-while Referenced in:

- 3. API (2)

https://heycam.github.io/webidl/#LenientSetter Referenced in:

- 3. API (2) (3)

https://heycam.github.io/webidl/#Unscopable Referenced in:

- 3. API

https://heycam.github.io/webidl/#idl-boolean Referenced in:

- 3. API (2)

### Terms defined by reference

- [DOM] defines the following terms:
  - Document
  - DocumentOrShadowRoot
  - Element
  - ShadowRoot
  - ancestor
  - bubbles
  - composed
  - connected
  - context object
  - document
  - element
  - fire an event
  - host
  - namespace
  - node document
  - removing steps
  - retargeting
  - root
  - shadow host
  - shadow root
  - shadow-including inclusive ancestor
  - shadow-including inclusive descendant
  - shadow-including tree order
  - tree
  - tree order
- [feature-policy-1] defines the following terms:
  - container policy
  - default allowlist
  - feature-policy
  - policy-controlled feature
- [HTML] defines the following terms:
  - EventHandler
  - Window
  - active document
  - allow
  - allowed to use
  - allowfullscreen
  - ancestor browsing context
  - browsing context
  - browsing context container
  - dialog
  - event handler
  - event handler content attribute
  - event handler event type
  - event handler idl attribute
  - event loop
  - feature policy
  - fully active
  - iframe
  - in parallel
  - nested browsing context
  - top-level browsing context
  - triggered by user activation
  - unloading document cleanup steps
- [INFRA] defines the following terms:
  - append
  - break
  - contain
  - continue
  - empty
  - for each
  - html namespace
  - ordered set
  - pair
  - remove
  - string
  - while
- [WEBIDL] defines the following terms:
  - LenientSetter
  - Unscopable
  - boolean

## References

### Normative References

[CSS]
  Bert Bos; et al. Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification. URL: http://dev.w3.org/csswg/css2/
[DOM]
  Anne van Kesteren. DOM Standard. Living Standard. URL: https://dom.spec.whatwg.org/
[FEATURE-POLICY-1]
  Ian Clelland. Feature Policy. URL: https://w3c.github.io/webappsec-feature-policy/
[HTML]
  Anne van Kesteren; et al. HTML Standard. Living Standard. URL: https://html.spec.whatwg.org/multipage/
[INFRA]
  Anne van Kesteren; Domenic Denicola. Infra Standard. Living Standard. URL: https://infra.spec.whatwg.org/
[MATHML]
  Patrick D F Ion; Robert R Miner. Mathematical Markup Language (MathML) 1.01 Specification. 7 July 1999. REC. URL: https://www.w3.org/TR/REC-MathML/
[SVG]
  Erik Dahlström; et al. Scalable Vector Graphics (SVG) 1.1 (Second Edition). 16 August 2011. REC. URL: https://www.w3.org/TR/SVG11/
[WEBIDL]
  Boris Zbarsky. Web IDL. URL: https://heycam.github.io/webidl/

## IDL Index

    enum FullscreenNavigationUI {
      "auto",
      "show",
      "hide"
    };

    dictionary FullscreenOptions {
      FullscreenNavigationUI navigationUI = "auto";
    };

    partial interface Element {
      Promise<void> requestFullscreen(optional FullscreenOptions options = {});

      attribute EventHandler onfullscreenchange;
      attribute EventHandler onfullscreenerror;
    };

    partial interface Document {
      [LenientSetter] readonly attribute boolean fullscreenEnabled;
      [LenientSetter, Unscopable] readonly attribute boolean fullscreen; // historical

      Promise<void> exitFullscreen();

      attribute EventHandler onfullscreenchange;
      attribute EventHandler onfullscreenerror;
    };

    partial interface mixin DocumentOrShadowRoot {
      [LenientSetter] readonly attribute Element? fullscreenElement;
    };

#descendant-browsing-context Referenced in:

- 3. API

#fullscreen-flag Referenced in:

- 2. Model (2) (3) (4) (5) (6)
- 3. API (2)
- 5.3. :fullscreen pseudo-class

#iframe-fullscreen-flag Referenced in:

- 2. Model
- 3. API (2)

#fullscreen-element Referenced in:

- 2. Model (2) (3) (4) (5)
- 3. API (2) (3) (4) (5) (6) (7) (8) (9) (10) (11) (12) (13) (14) (15) (16) (17)
- 5.3. :fullscreen pseudo-class (2)

#list-of-pending-fullscreen-events Referenced in:

- 2. Model (2)
- 3. API (2) (3) (4) (5)

#fullscreen-an-element Referenced in:

- 3. API (2)

#unfullscreen-an-element Referenced in:

- 2. Model (2) (3)
- 3. API (2)

#unfullscreen-a-document Referenced in:

- 3. API (2) (3)

#fully-exit-fullscreen Referenced in:

- 2. Model
- 4. UI

#fullscreen-is-supported Referenced in:

- 3. API (2) (3)

#allowed-to-request-fullscreen Referenced in:

- 3. API

#run-the-fullscreen-steps Referenced in:

- 3. API (2)

#enumdef-fullscreennavigationui Referenced in:

- 3. API

#dictdef-fullscreenoptions Referenced in:

- 3. API

#fullscreen-element-ready-check Referenced in:

- 3. API (2)

#dom-element-requestfullscreen Referenced in:

- 3. API (2)
- 4. UI (2)
- 7. Security and Privacy Considerations

#dom-document-fullscreenenabled Referenced in:

- 3. API (2)

#dom-document-fullscreen Referenced in:

- 3. API

#dom-document-fullscreenelement Referenced in:

- 3. API (2) (3) (4)
- 5.3. :fullscreen pseudo-class

#simple-fullscreen-document Referenced in:

- 3. API (2) (3)

#collect-documents-to-unfullscreen Referenced in:

- 3. API (2)

#exit-fullscreen Referenced in:

- 2. Model (2)
- 3. API

#dom-document-exitfullscreen Referenced in:

- 3. API (2)
- 4. UI (2)

#handler-document-onfullscreenchange Referenced in:

- 3. API

#handler-document-onfullscreenerror Referenced in:

- 3. API

#top-layer Referenced in:

- 2. Model (2) (3) (4) (5) (6) (7)
- 3. API (2) (3)
- 5. Rendering
- 5.1. New stacking layer (2) (3) (4)
- 5.2. ::backdrop pseudo-element (2) (3)

#top-layer-add Referenced in:

- 2. Model

#css-pe-backdrop Referenced in:

- 5. Rendering
- 5.1. New stacking layer (2)
- 5.2. ::backdrop pseudo-element

#fullscreen-feature Referenced in:

- 3. API (2)