ToggleEvent: newState property

Baseline 2023

Newly available

Since ⁨November 2023⁩, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Learn more
See full compatibility
Report feedback

The newState read-only property of the ToggleEvent interface is a string representing the state the element is transitioning to.

Value

A string. Possible values are "open" (the popover is being shown) or "closed" (the popover is being hidden).

Examples

const popover = document.getElementById("mypopover");

// …

popover.addEventListener("beforetoggle", (event) => {
  if (event.newState === "open") {
    console.log("Popover is being shown");
  } else {
    console.log("Popover is being hidden");
  }
});