Files
meshcore-analyzer/.github
Kpa-clawbot ab34d9fb65 fix(#1206): keep VCR bar from occluding the live packet feed (#1213)
Red commit: `bcfc74de` (CI:
https://github.com/Kpa-clawbot/CoreScope/actions?query=branch%3Afix%2Fissue-1206)

Fixes #1206.

## Problem
On Live Map the VCR (timeline/playback) bar overlays the bottom of the
viewport. Bottom-pinned overlays — the live packet feed, the legend, any
corner panel — used hard-coded `bottom: 58–88px` offsets that are
smaller than the real bar height (two-row mobile layout +
`env(safe-area-inset-bottom)` push it to ~80px and beyond). The last N
packet-feed rows slid under the bar and became unreadable / unclickable.

## Fix
Publish the bar's measured height as a CSS variable on the live page
and bind every bottom-anchored overlay to it.

- `public/live.js` — new `initVCRHeightTracker()` runs after init; uses
  `ResizeObserver` + `resize` / `visualViewport.resize` to keep
  `--vcr-bar-height` on `.live-page` in sync with `#vcrBar`.
- `public/live.css` — `.live-feed`, `.feed-show-btn`, and the
  `.live-overlay[data-position="bl"|"br"]` corner slots now use
  `bottom: calc(var(--vcr-bar-height, 58px) + 10px)`. The feed's
  `max-height` is also capped against `100dvh - top - vcr - margin`
  so its scroll container can never extend past the bar.
- Stale per-breakpoint overrides (the `@supports(env(safe-area-inset))`
  hard-coded `78px + safe-area` for feed/legend) are removed in favor
  of the single tracked variable.

## TDD
- Red commit `bcfc74de` adds `test-issue-1206-vcr-overlap-e2e.js`:
  asserts `#liveFeed.getBoundingClientRect().bottom <= #vcrBar.top`
  (and same for the last row) at desktop 1280x800 and mid 720x800.
  Verified locally that reverting the green commit makes the feed-bottom
  assertions fail (feed bottom 742px > VCR top 721px) — see PR body for
  exact numbers from the local run.
- Green commit `1ad17e7f` makes all 5 assertions pass.

## Browser verified
Local Go server with `test-fixtures/e2e-fixture.db`, headless Chromium
via the new E2E test — all 5 assertions green.

## E2E assertion added
`test-issue-1206-vcr-overlap-e2e.js:84` (bottom-row vs VCR-top) plus
container check at `:74`.

---------

Co-authored-by: openclaw-bot <bot@openclaw.local>
Co-authored-by: clawbot <bot@corescope.local>
2026-05-16 05:55:21 +00:00
..