feat(cssom): HTMLStyleElement.sheet + lowercase on-handler lookup

`<style>.sheet` now returns the element's `CSSStyleSheet` (CSSOM): created
lazily once the `<style>` is connected, re-synced from its current text content
(so `cssRules` tracks the text), null when disconnected. This lets an
earlier-inserted script observe a later-inserted `<style>` already applied —
clearing dom/nodes/insertion-removing-steps/Node-appendChild-script-and-style
(the `<style>` cases) and Node-appendChild-text-and-script-in-style. (`<link>`
sheets, which need the fetched resource, are not modelled — those subtests stay
allowlisted.)

The on-attribute handler lookup in dispatch now lower-cases the event type
(`'on' + event.type.toLowerCase()`): IDL on-handler attribute names are
lowercase, but a mixed-case type like `webkitAnimationEnd` mapped to the
non-existent `onwebkitAnimationEnd`. No-op for the standard already-lowercase
types. With this, the prefixed `onwebkitanimation*` / `onwebkittransitionend`
handlers fire on the matching prefixed dispatch.

Because `style.sheet` makes their setup succeed, the four
dom/events/webkit-{animation-end,animation-iteration,animation-start,
transition-end}-event.html files now run (they were vacuously green — setup
threw on the missing `style.sheet`). Their prefixed on-handler/dispatch subtests
(4/file = 16) now pass; the `triggerAnimation()` subtests (9/file = 36) need a
real CSS animation/transition engine to fire a trusted animationend/
transitionend (rule 1 out-of-scope) and are allowlisted.

Gate 660/0/15 (1441 fail subtests: +36 honest out-of-scope animation-engine
exposure, −3 style cleared; +19 real subtests now pass); gem 1586/0/35; Redmine
(inline onclick) green.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Author: ursm

lib/capybara/simulated/js/bridge.bundle.js

@@ -3290,7 +3290,7 @@
       event.target = event._csimRetargets.has(node) ? event._csimRetargets.get(node) : event._csimTopRetarget;
     }
     if (!capture && node._attrs && !event._immediatePropagationStopped) {
-      const attrName = "on" + event.type;
+      const attrName = "on" + event.type.toLowerCase();
       const propHandler = typeof node[attrName] === "function" ? node[attrName] : null;
       const attrVal = propHandler ? null : node._attrs[attrName];
       let handler = propHandler;
@@ -8545,6 +8545,30 @@
       }
       Object.defineProperty(this, "content", { value: v, writable: true, configurable: true, enumerable: true });
     }
+    // `HTMLStyleElement.sheet` — the CSSStyleSheet associated with a connected
+    // `<style>` (CSSOM). It exists once the element is in a document and reflects
+    // the element's current text content, so an earlier-inserted script can
+    // observe a later-inserted `<style>` already applied (cssRules track the text
+    // live). Disconnected → null; `<link>` sheets (which need the fetched
+    // resource) are not modelled here. Created lazily and cached for stable identity.
+    get sheet() {
+      if (this._tag !== "style") return void 0;
+      if (!this.isConnected) {
+        this._sheet = null;
+        return null;
+      }
+      const type = (this._attrs.type || "").toLowerCase();
+      if (type && type !== "text/css") {
+        this._sheet = null;
+        return null;
+      }
+      if (!this._sheet) {
+        this._sheet = new globalThis.CSSStyleSheet();
+        this._sheet.ownerNode = this;
+      }
+      this._sheet.replaceSync(this.textContent || "");
+      return this._sheet;
+    }
     // `<dialog>` HTML interface — show() / showModal() / close() per
     // HTMLDialogElement. Turbo's confirm flow uses this: opens
     // `<dialog id="turbo-confirm">` via `showModal()`, waits for the

lib/capybara/simulated/js/src/dispatch.js

@@ -336,7 +336,11 @@ function fireListeners(node, event, capture) {
   // this, Redmine's `onclick="showAndScrollTo(...); return false"`
   // never runs and the issue-notes form stays collapsed.
   if (!capture && node._attrs && !event._immediatePropagationStopped) {
-    const attrName = 'on' + event.type;
+    // IDL on-handler attribute names are lowercase; an event type can be mixed
+    // case (e.g. `webkitAnimationEnd` → `onwebkitanimationend`), so lower-case
+    // the type for the property/attribute lookup. No-op for the standard
+    // already-lowercase event types.
+    const attrName = 'on' + event.type.toLowerCase();
     // Property assignment (`el.onclick = fn`) takes precedence over
     // any `onclick="..."` attribute per HTML spec — the setter
     // *replaces* the inline handler. jstoolbar registers its Edit /

lib/capybara/simulated/js/src/dom-nodes.js

@@ -2330,6 +2330,24 @@ class Element extends Node {
     if (this._tag === 'meta') { this.setAttribute('content', v == null ? '' : String(v)); return; }
     Object.defineProperty(this, 'content', {value: v, writable: true, configurable: true, enumerable: true});
   }
+  // `HTMLStyleElement.sheet` — the CSSStyleSheet associated with a connected
+  // `<style>` (CSSOM). It exists once the element is in a document and reflects
+  // the element's current text content, so an earlier-inserted script can
+  // observe a later-inserted `<style>` already applied (cssRules track the text
+  // live). Disconnected → null; `<link>` sheets (which need the fetched
+  // resource) are not modelled here. Created lazily and cached for stable identity.
+  get sheet() {
+    if (this._tag !== 'style') return undefined;
+    if (!this.isConnected) { this._sheet = null; return null; }
+    const type = (this._attrs.type || '').toLowerCase();
+    if (type && type !== 'text/css') { this._sheet = null; return null; }
+    if (!this._sheet) {
+      this._sheet = new globalThis.CSSStyleSheet();
+      this._sheet.ownerNode = this;
+    }
+    this._sheet.replaceSync(this.textContent || '');   // re-sync rules from the current text
+    return this._sheet;
+  }
   // `<dialog>` HTML interface — show() / showModal() / close() per
   // HTMLDialogElement. Turbo's confirm flow uses this: opens
   // `<dialog id="turbo-confirm">` via `showModal()`, waits for the

spec/support/wpt_expected_failures.yml

@@ -118,6 +118,70 @@ dom/events/scrolling/scrollend-fires-to-text-input.html:
   }).'
 dom/events/scrolling/wheel-event-no-scroll-after-prevent-default.html:
 - When `preventDefault` is called on a WheelEvent, scrolling should be prevented.
+dom/events/webkit-animation-end-event.html:
+- event types for prefixed and unprefixed animationend event handlers should be named
+  appropriately
+- event types for prefixed and unprefixed animationend event listeners should be named
+  appropriately
+- onwebkitanimationend event handler should not trigger if an unprefixed event handler
+  also exists
+- onwebkitanimationend event handler should not trigger if an unprefixed listener
+  also exists
+- onwebkitanimationend event handler should trigger for an animation
+- webkitAnimationEnd event listener is case sensitive
+- webkitAnimationEnd event listener should not trigger if an unprefixed event handler
+  also exists
+- webkitAnimationEnd event listener should not trigger if an unprefixed listener also
+  exists
+- webkitAnimationEnd event listener should trigger for an animation
+dom/events/webkit-animation-iteration-event.html:
+- event types for prefixed and unprefixed animationiteration event handlers should
+  be named appropriately
+- event types for prefixed and unprefixed animationiteration event listeners should
+  be named appropriately
+- onwebkitanimationiteration event handler should not trigger if an unprefixed event
+  handler also exists
+- onwebkitanimationiteration event handler should not trigger if an unprefixed listener
+  also exists
+- onwebkitanimationiteration event handler should trigger for an animation
+- webkitAnimationIteration event listener is case sensitive
+- webkitAnimationIteration event listener should not trigger if an unprefixed event
+  handler also exists
+- webkitAnimationIteration event listener should not trigger if an unprefixed listener
+  also exists
+- webkitAnimationIteration event listener should trigger for an animation
+dom/events/webkit-animation-start-event.html:
+- event types for prefixed and unprefixed animationstart event handlers should be
+  named appropriately
+- event types for prefixed and unprefixed animationstart event listeners should be
+  named appropriately
+- onwebkitanimationstart event handler should not trigger if an unprefixed event handler
+  also exists
+- onwebkitanimationstart event handler should not trigger if an unprefixed listener
+  also exists
+- onwebkitanimationstart event handler should trigger for an animation
+- webkitAnimationStart event listener is case sensitive
+- webkitAnimationStart event listener should not trigger if an unprefixed event handler
+  also exists
+- webkitAnimationStart event listener should not trigger if an unprefixed listener
+  also exists
+- webkitAnimationStart event listener should trigger for an animation
+dom/events/webkit-transition-end-event.html:
+- event types for prefixed and unprefixed transitionend event handlers should be named
+  appropriately
+- event types for prefixed and unprefixed transitionend event listeners should be
+  named appropriately
+- onwebkittransitionend event handler should not trigger if an unprefixed event handler
+  also exists
+- onwebkittransitionend event handler should not trigger if an unprefixed listener
+  also exists
+- onwebkittransitionend event handler should trigger for an animation
+- webkitTransitionEnd event listener is case sensitive
+- webkitTransitionEnd event listener should not trigger if an unprefixed event handler
+  also exists
+- webkitTransitionEnd event listener should not trigger if an unprefixed listener
+  also exists
+- webkitTransitionEnd event listener should trigger for an animation
 dom/interface-objects.html: HARNESS_ERROR
 dom/lists/DOMTokenList-iteration.html:
 - classList inheritance from Array.prototype
@@ -195,10 +259,6 @@ dom/nodes/insertion-removing-steps/Node-appendChild-script-and-source-from-fragm
 - Empty <source> immediately sets media.networkState during DOM insertion, so that
   an earlier-running script can observe networkState
 dom/nodes/insertion-removing-steps/Node-appendChild-script-and-style.html:
-- An earlier-inserted <script> synchronously observes a later-inserted <style> (via
-  a DocumentFragment) being applied
-- An earlier-inserted <script> synchronously observes a later-inserted <style> (via
-  a div) being applied
 - Earlier-inserted <script> (via a DocumentFragment) synchronously observes a later-inserted
   <link rel=stylesheet>'s CSSStyleSheet creation
 - Earlier-inserted <script> (via a append()) synchronously observes a later-inserted
@@ -208,10 +268,6 @@ dom/nodes/insertion-removing-steps/Node-appendChild-script-and-style.html:
 dom/nodes/insertion-removing-steps/Node-appendChild-script-in-script.html:
 - An outer script whose preparation/execution gets triggered by the insertion of a
   'nested'/'inner' script, executes *before* the inner script executes
-dom/nodes/insertion-removing-steps/Node-appendChild-text-and-script-in-style.html:
-- All style rules appended to a <style> element are inserted and script-observable
-  to scripts inserted in the `<style>` element, by the time scripts execute after
-  DOM insertions.
 dom/nodes/moveBefore/child-style-preserve.html:
 - child-style-preserve
 dom/nodes/moveBefore/continue-css-animation-left.html: