v152 · ua image replacement

The three things it adds

Two events and a boolean. Small enough that the whole proposal can be checked in one table — and small enough that the checking has to be done carefully, because a page that gets a false negative here will keep drawing a zoom lens over somebody else's picture.

Each addition, probed

The proposal's surface against this browser
additionpresent?how it was checkedwhat it is for

The control rows matter more than usual here. An event has no presence test — addEventListener accepts any name — so the only honest check is the on… reflected handler property, and the controls confirm that this check finds a property that does exist and misses one that does not.

The whole of HTMLImageElement

Printed in full rather than filtered, so the absence is visible in context: this is a large interface that has accumulated a lot, and the three additions would be unremarkable among them.

How to write the check

// The property is the feature test. It reflects state, so it exists
// whether or not a replacement is currently happening.
const supported = "replacedByUserAgent" in document.createElement("img");

// Attaching the listeners is harmless either way — an event that never
// fires costs nothing, and this is one fewer branch to get wrong.
image.addEventListener("uareplacestart", onStart);
image.addEventListener("uareplaceend", onEnd);

// What you must NOT do: assume uareplaceend means "back to normal".
// It fires on success, on failure, and on revert.
function onEnd() {
  restoreUi(image.replacedByUserAgent);   // ask, do not assume
}

see also