repremium/mokosh
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(03-01): Task 1 — probe HTML for A29 rrweb DOM verification (SPEC §10 #4)

Browse Source 
- Append form (text + email + password + submit) + table (thead + 2 rows)
  + modal trigger + hidden modal div below existing `<pre id="status">`
  scaffold; preserves `<head>` block + tokens.css link untouched (A18/A21
  invariant).
- Modal trigger uses inline onclick to toggle style.display — rrweb
  records the attribute mutation, satisfying IncrementalSnapshot
  emission per RESEARCH Pitfall 1 (synthetic probe HTML emits Meta +
  FullSnapshot but NOT IncrementalSnapshot without a DOM mutation
  between page load and SAVE).
- Per RESEARCH Pitfall 4: the rrweb-alpha.4-leaky multi-line input
  element (rrweb-io/rrweb#1596) is excluded; only single-line inputs.
- Per UI-SPEC §"Test Fixture Conventions": data-test-* attributes
  only; no data-mokosh-* (production-welcome-page reserved); no
  tokens.css import on the probe sub-tree (head already imports the
  canonical tokens for A18/A21).
- npm run build exit 0; all 7 acceptance grep gates GREEN.
This commit is contained in:
Mark
2026-05-20 19:11:41 +02:00
parent 5892371eae
commit c02914df86
1 changed files with 36 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
tests/uat/extension-page-harness.html
View File

@@ -19,6 +19,42 @@
<p>This page lives at <code>chrome-extension://&lt;id&gt;/tests/uat/extension-page-harness.html</code>.</p>
<p>Puppeteer navigates a tab here and drives assertions via <code>window.__mokoshHarness.*</code>.</p>
<pre id="status">Ready.</pre>
<!--
Plan 03-01 Wave 1 — probe HTML for A29 rrweb DOM verification
(SPEC §10 #4). Provides form + table + modal-trigger so rrweb's
record() emits Meta + FullSnapshot + IncrementalSnapshot events
against this page. Per RESEARCH Pitfall 4: this fixture omits
the rrweb-alpha.4-leaky multi-line input element (rrweb-io/rrweb
issue #1596 leaks its value even with maskInputOptions set);
only single-line inputs are used below. Per UI-SPEC Section
"Test Fixture Conventions": probe HTML uses plain data-test-*
attributes; no data-mokosh-* (production-welcome-page reserved);
no tokens.css import (the harness head already imports the
canonical tokens for A18/A21 — probe sub-tree should appear
unstyled to keep rrweb snapshots focused on structural DOM).
-->
<form id="probe-form" data-test="probe-form">
<input type="text" id="probe-text" data-test="probe-text" />
<input type="email" id="probe-email" data-test="probe-email" />
<input type="password" id="probe-password" data-test="probe-password" />
<button type="submit" id="probe-submit" data-test="probe-submit">Submit</button>
</form>
<table id="probe-table" data-test="probe-table">
<thead>
<tr><th>col-a</th><th>col-b</th></tr>
</thead>
<tbody>
<tr><td>row-1-a</td><td>row-1-b</td></tr>
<tr><td>row-2-a</td><td>row-2-b</td></tr>
</tbody>
</table>
<button id="probe-modal-trigger" data-test="probe-modal-trigger"
onclick="(function(){var m=document.getElementById('probe-modal');if(m){m.style.display=(m.style.display==='block'?'none':'block');}})()">
Toggle modal
</button>
<div id="probe-modal" data-test="probe-modal" style="display:none;">
<p>Probe modal content (Plan 03-01 A29 IncrementalSnapshot trigger).</p>
</div>
<script type="module" src="./extension-page-harness.ts"></script>
</body>
</html>