ViewTransition: transitionRoot property

Limited availability

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

Want more support for this feature? Tell us why.

Learn more
See full compatibility

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

The transitionRoot read-only property of the ViewTransition interface is a reference to the root Element of the view transition scope.

Value

An Element.

For document-scoped view transitions, transitionRoot is a reference to the Document.documentElement property, which for standard web documents is a reference to the <html> element.
For element-scoped view transitions, transitionRoot is a reference to the Element that startViewTransition() was called on to create the view transition.

Examples

Basic usage

This snippet shows how to use transitionRoot to retrieve a reference to the element the view transition was created on.

const myElement = document.querySelector(".my-element");

// ...

function handleVT() {
  const vt = myElement.startViewTransition(() => {
    updateDOMSomehow();
  });

  // ...

  // Returns reference to myElement
  vt.transitionRoot;
}