fix(chrome): emit every markup attribute and read checked and selected off the property

the dump emitted a fixed standard attribute set, so a spec reading data-cents or data-account-id saw undefined on the goja host and nothing at all in the trace. it now keys every attribute by the name the markup writes, derived keys overwriting. checked and selected come from the dom property rather than whatever a component left on the object, which is also what the page-side element handle now reports, so a ticked box reads as ticked instead of reporting its starting state forever.

pkg/spec/test/dom-state-probe.ts

@@ -0,0 +1,43 @@
+/// <reference lib="dom" />
+
+// The V8 host's element handle, read back state field by state field.
+//
+// internal/driver/chrome/element_state_test.go bundles this probe into a live
+// page and compares what it returns against the hierarchy dump the goja host
+// reads off the SAME page, before and after a real click. buildAx is the
+// shipped `state.ax`, so the answer comes from production code rather than a
+// copy of it. `attrChecked` rides along because the markup attribute is what an
+// implementation reading the wrong source would report, and a failure naming it
+// says so instead of just naming the wrong boolean.
+
+import { __testing__ } from "../src/web-runtime.ts";
+
+const { buildAx } = __testing__;
+
+interface Handle {
+  checked?: boolean;
+  enabled?: boolean;
+  focused?: boolean;
+  selected?: boolean;
+  attrs?: Record<string, string>;
+}
+
+interface Ax {
+  find(selector: unknown): Handle | undefined;
+}
+
+function elementState(id: string): unknown {
+  const handle = (buildAx() as Ax).find({ id });
+  if (!handle) return null;
+  return {
+    checked: handle.checked,
+    enabled: handle.enabled,
+    focused: handle.focused,
+    selected: handle.selected,
+    attrChecked: handle.attrs?.checked ?? null,
+  };
+}
+
+type StateGlobal = { __sanderlingElementState__: (id: string) => unknown };
+
+(globalThis as unknown as StateGlobal).__sanderlingElementState__ = elementState;

pkg/spec/test/web-runtime.test.ts

@@ -547,12 +547,14 @@ function domElement(spec: {
   attributes?: Record<string, string>;
   labels?: string[];
   text?: string;
+  checked?: boolean;
 }): unknown {
   const attributes = spec.attributes ?? {};
   return {
     tagName: spec.tag.toUpperCase(),
     type: spec.tag === "input" ? "text" : "",
     isContentEditable: false,
+    checked: spec.checked,
     id: attributes.id ?? "",
     className: attributes.class ?? "",
     textContent: spec.text ?? "",
@@ -620,6 +622,23 @@ test("attrs keys data attributes by the name the markup writes", () => {
   assert.deepEqual(handleOf(element).dataset, { txnCount: "3", accountId: "a-1" });
 });
 
+// docs/manual/spec-language.md lists `checked` on every element find returns,
+// and HTML keeps that state in the DOM property: the markup attribute only
+// records what the page started with. A handle reading the attribute reports a
+// checkbox's starting state forever, so a property over "the box is ticked"
+// holds on a page where nothing was ever ticked.
+test("checked reads the live property, not the markup attribute", () => {
+  const ticked = domElement({ tag: "input", attributes: { id: "toggle-all" }, checked: true });
+  assert.equal(handleOf(ticked).checked, true);
+
+  const cleared = domElement({
+    tag: "input",
+    attributes: { id: "toggle-all", checked: "" },
+    checked: false,
+  });
+  assert.equal(handleOf(cleared).checked, false);
+});
+
 test("attrs carries every other attribute alongside tag and aria-label", () => {
   const attrs = attrsOf(
     domElement({ tag: "input", attributes: { id: "txn-note", placeholder: "What's this for?" } }),