mirror of
https://github.com/priyanshujain/sanderling.git
synced 2026-10-02 11:07:10 +00:00
visibleLabel reads hintText first for an editable element. The dump never emitted it, so an empty web input fell through text, description and descendant text to its class name, and the model was shown an identifier no user can read on exactly the fields a labelling experiment varies. Same ladder as fieldHint in web-runtime.ts, so one field is named one way on both hosts. Claude-Session: https://claude.ai/code/session_01A5KmftdEJ49A9z5mF5ESrX
99 lines
3.6 KiB
HTML
99 lines
3.6 KiB
HTML
<!doctype html>
|
|
<html id="page">
|
|
<head id="page-head">
|
|
<meta id="page-charset" charset="utf-8" />
|
|
<title id="page-title">fact parity</title>
|
|
<style id="page-style">
|
|
:root {
|
|
--frame-w: 420px;
|
|
--frame-h: 640px;
|
|
}
|
|
body {
|
|
margin: 0;
|
|
}
|
|
#scroller {
|
|
width: 320px;
|
|
height: 120px;
|
|
overflow: auto;
|
|
}
|
|
#scroller-content {
|
|
height: 600px;
|
|
}
|
|
#sideways {
|
|
width: 320px;
|
|
height: 40px;
|
|
overflow: auto;
|
|
}
|
|
#sideways-content {
|
|
width: 900px;
|
|
height: 20px;
|
|
}
|
|
#fits {
|
|
width: 320px;
|
|
height: 120px;
|
|
overflow: auto;
|
|
}
|
|
#fits-content {
|
|
height: 40px;
|
|
}
|
|
#collapsed {
|
|
display: none;
|
|
}
|
|
#filler {
|
|
height: 900px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body id="page-body">
|
|
<button id="save">save</button>
|
|
<button id="cancel" disabled>cancel</button>
|
|
<a id="link" href="#detail">detail</a>
|
|
<select id="choice">
|
|
<option id="choice-first">first</option>
|
|
</select>
|
|
<input id="amount" type="text" value="10" />
|
|
<!-- One field per rung of the hint ladder both producers name an editable
|
|
field by. A rung read on one side only sends the model a different name
|
|
for the same field on the two hosts, which is the observation channel
|
|
the label-source arms vary. -->
|
|
<label id="hint-label-text" for="hint-label">Amount</label>
|
|
<input id="hint-label" type="text" placeholder="0.00" name="amount-field" />
|
|
<input id="hint-aria" type="text" aria-label="Search" placeholder="Type here" name="q" />
|
|
<input id="hint-placeholder" type="text" placeholder="What's this for?" name="note-field" />
|
|
<input id="hint-name" type="text" name="reference-field" />
|
|
<input id="agree" type="checkbox" placeholder="not a hint" />
|
|
<textarea id="notes"></textarea>
|
|
<div id="bio" contenteditable="true">bio</div>
|
|
<div id="menu" role="button">menu</div>
|
|
<!-- One element per ARIA role both producers resolve as clickable. A role
|
|
covered on one side only makes that control reachable for one host,
|
|
which is how the whole set is kept honest: role="option" is the shape
|
|
the replay UI gives its step rows. -->
|
|
<div id="role-link" role="link">link</div>
|
|
<div id="role-checkbox" role="checkbox">checkbox</div>
|
|
<div id="role-radio" role="radio">radio</div>
|
|
<div id="role-switch" role="switch">switch</div>
|
|
<div id="role-tab" role="tab">tab</div>
|
|
<div id="role-menuitem" role="menuitem">menu item</div>
|
|
<div id="role-menuitemcheckbox" role="menuitemcheckbox">menu item checkbox</div>
|
|
<div id="role-menuitemradio" role="menuitemradio">menu item radio</div>
|
|
<div id="role-treeitem" role="treeitem">tree item</div>
|
|
<ul id="role-listbox" role="listbox">
|
|
<li id="role-option" role="option">option</li>
|
|
<li id="role-option-disabled" role="option" aria-disabled="true">disabled option</li>
|
|
</ul>
|
|
<div id="attribute-click" onclick="void 0">attribute click</div>
|
|
<div id="delegating-root">delegating root</div>
|
|
<div id="plain">plain</div>
|
|
<div id="edit-text-field" class="EditTextField">styled</div>
|
|
<span id="collapsed">collapsed</span>
|
|
<div id="scroller"><div id="scroller-content"></div></div>
|
|
<div id="sideways"><div id="sideways-content"></div></div>
|
|
<div id="fits"><div id="fits-content"></div></div>
|
|
<div id="filler"></div>
|
|
<script id="page-script">
|
|
document.getElementById("delegating-root").onclick = function () {};
|
|
</script>
|
|
</body>
|
|
</html>
|