missing-view-transition-name

This rule reports a style() call that applies a view transition without .for(). The transition adds its class, but the element has no view-transition-name, so the browser does not capture it.

Reported

const transition = style.viewTransition({ old: "duration-150" });
style(transition);missing-view-transition-name: a view transition class without a name does not participate; add .for(key) or declare view-transition-name

Fixed

const transition = style.viewTransition({ old: "duration-150" });
style(transition.for("card"));

How to fix

• Call .for() with a key that stays the same for the item before and after the update, such as its ID.
• When the call combines several transitions, call .for() on one of them.

The rule does not check that keys are unique across the page.

Rule settings