fix(replay-ui): read data-* attributes by their markup names

The web runtime now publishes raw markup attribute names, so attrs["step"]
read nothing where the markup writes data-step. Three properties went
vacuous and exactlyOneStepIsSelected reported false against a UI that was
fine.

The test also fails if a dataOf key gains no matching attribute, or if an
attribute it derives is rendered nowhere.

replay-ui/sanderling/data-attributes.ts

@@ -0,0 +1,7 @@
+// attrs is keyed by the names the markup writes (rawAttributes in
+// pkg/spec/src/web-runtime.ts), and the goja host the properties run in exposes
+// attrs and nothing else (internal/verifier/marshal.go): there is no dataset
+// field to read a camelCased key off, so the spec converts the key itself.
+export function attributeOf(key: string): string {
+  return `data-${key.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`)}`;
+}

replay-ui/sanderling/spec.ts

@@ -12,6 +12,7 @@
 
 import { type AccessibilityElement, type Key, PressKey, Tap, actions, always, extract, from, next, weighted } from "@sanderling/spec";
 import { defaultActions, noUncaughtExceptions } from "@sanderling/spec/defaults";
+import { attributeOf } from "./data-attributes";
 
 function numberOf(value: string | undefined): number | null {
   if (value === undefined || value === "") return null;
@@ -21,7 +22,7 @@ function numberOf(value: string | undefined): number | null {
 
 function dataOf(element: AccessibilityElement | undefined, key: string): string | undefined {
   const attrs = (element as unknown as { attrs?: Record<string, string> } | undefined)?.attrs;
-  return attrs ? attrs[key] : undefined;
+  return attrs ? attrs[attributeOf(key)] : undefined;
 }
 
 // The toolbar's own claim about which step is on screen, and how many there are.