mirror of
https://github.com/Kpa-clawbot/meshcore-analyzer.git
synced 2026-08-06 17:29:44 +00:00
8c3e397d39
Red commit: aabe8143d1
## Summary
Drop `max-width: 1200px` on `.observers-page` in `public/style.css`. The
observers table is column-dense and already runs `data-priority`
auto-hide on narrower viewports, so the 1200px cap crushed columns on
wide monitors while the mobile hide-column CSS had already dropped
columns for narrower widths — the exact "starts auto-hiding but never
expands back" behavior described in #1846.
Removes the cap so the browser layout uses available viewport width (as
`.analytics-page` does).
## Change
- `public/style.css:2113` — remove `max-width: 1200px` from
`.observers-page`.
- `test-issue-1846-observers-width.js` — new regression guard. Parses
`.observers-page` rule from `style.css`; fails if a `max-width` cap
`<1600px` is re-introduced (matches the `.analytics-page` convention
referenced in triage).
- `.github/workflows/deploy.yml` — wire the new test into the frontend
unit test job.
## Test discipline
- Red commit `aabe8143`: test only, no CSS change — CI fails on
assertion (`max-width 1200px must be >= 1600px`).
- Green commit `665e88a6`: CSS fix — test passes.
## Browser verification
Browser tool unavailable in this session (gateway restart required).
Change is a pure CSS width-cap removal on a single class; no JS, no
HTML, no theming implications. The regression guard makes silent
reintroduction impossible.
## E2E assertion
Regression guard is source-grep, not DOM-level:
`test-issue-1846-observers-width.js:41` (`.observers-page` block
max-width allowlist). Justification: bug is a single declarative CSS
attribute; a DOM E2E for it would just assert
`getComputedStyle(...).maxWidth === 'none'`, which mirrors the source
assertion at higher cost. If a follow-up wants a Playwright
viewport-resize check, easy to add.
## Preflight
`bash ~/.openclaw/skills/pr-preflight/scripts/run-all.sh origin/master`
— clean on the green HEAD.
Fixes #1846
---------
Co-authored-by: corescope-bot <bot@corescope.dev>
66 lines
2.4 KiB
JavaScript
66 lines
2.4 KiB
JavaScript
/**
|
|
* #1846 — Observers page pinned to 1200px on wide screens; columns crushed
|
|
* while responsive auto-hide has already fired for narrow widths.
|
|
*
|
|
* Root cause: public/style.css `.observers-page { max-width: 1200px; }`
|
|
* caps a column-dense table at 1200px, leaving unused space on wide
|
|
* monitors while narrow viewports still trigger data-priority column
|
|
* auto-hide.
|
|
*
|
|
* Fix: drop the narrow cap on `.observers-page`. Either remove `max-width`
|
|
* entirely (preferred — let the browser use available width) or raise it
|
|
* to a value >= 1600px (matches `.analytics-page` convention).
|
|
*
|
|
* This is a regression guard: a future author must not re-introduce a
|
|
* narrow (<1600px) `max-width` on `.observers-page` without deleting or
|
|
* updating this test.
|
|
*/
|
|
'use strict';
|
|
|
|
const fs = require('fs');
|
|
const path = require('path');
|
|
|
|
const css = fs.readFileSync(path.join(__dirname, 'public', 'style.css'), 'utf8');
|
|
|
|
let passed = 0, failed = 0;
|
|
function assert(cond, msg) {
|
|
if (cond) { passed++; console.log(' ok ', msg); }
|
|
else { failed++; console.log(' FAIL', msg); }
|
|
}
|
|
|
|
console.log('# #1846 observers-page width regression guard');
|
|
|
|
// Match the .observers-page block (single-line rule).
|
|
// e.g. ".observers-page { padding: 20px; max-width: 1200px; margin: 0 auto; }"
|
|
const re = /\.observers-page\s*\{([^}]*)\}/g;
|
|
const blocks = [];
|
|
let m;
|
|
while ((m = re.exec(css)) !== null) blocks.push(m[1]);
|
|
|
|
assert(blocks.length > 0, `.observers-page rule exists in public/style.css (found ${blocks.length})`);
|
|
|
|
for (const body of blocks) {
|
|
const mw = body.match(/max-width\s*:\s*([^;]+);?/i);
|
|
if (!mw) {
|
|
assert(true, `.observers-page has no narrow max-width cap`);
|
|
continue;
|
|
}
|
|
const val = mw[1].trim();
|
|
// Allowlist: none / unset / initial / a length >= 1600px.
|
|
if (/^(none|unset|initial|revert)$/i.test(val)) {
|
|
assert(true, `.observers-page max-width is ${val} (uncapped)`);
|
|
continue;
|
|
}
|
|
const pxMatch = val.match(/^(\d+(?:\.\d+)?)px$/i);
|
|
if (pxMatch) {
|
|
const px = parseFloat(pxMatch[1]);
|
|
assert(px >= 1600, `.observers-page max-width ${val} must be >= 1600px (matches .analytics-page convention) — see #1846`);
|
|
continue;
|
|
}
|
|
// Non-px unit (e.g. %, vw) — accept, hard to reason about.
|
|
assert(true, `.observers-page max-width is non-px (${val}) — accepted`);
|
|
}
|
|
|
|
console.log(`\n# ${passed} passed, ${failed} failed`);
|
|
process.exit(failed === 0 ? 0 : 1);
|