Track B temporary Storybook LAN preview

Historical scope: the Track B session below was verified on 2026-10-07. Ordinary users should follow the official source installation guide and use npm run storybook or start-storybook.bat at the repository root; the current default port is 6024. LAN Preview is optional internal QA. The old 6007 package port and the temporary 6008 session are historical observations. No server binding, network profile or firewall configuration is changed by this documentation update.

Purpose: TEMPORARY INTERNAL LAN PREVIEW / LAN TEMP PREVIEW for Storybook cleanup. This is a development server with HMR, not official static hosting or a permanent URL.

Worktree: <TRACK_B_WORKTREE>
Branch: chore/storybook-cleanup
Port: 6008; bind: 0.0.0.0
TEMP_STORYBOOK_URL: http://<QA_HOST_IPV4>:6008/
Local: http://localhost:6008/
IPv4 <QA_HOST_IPV4> was verified on 2026-10-07. Recheck it before later sharing; do not assume a fixed address.

Start and inspect

For optional QA, first install/build dependencies using the official guide. Run from the current repository root in PowerShell; 6008 below is an example QA port, not the current default. Confirm it is available and the existing network policy permits LAN QA before starting. Replace <QA_HOST_IPV4> with the address observed for that session. The old worktree placeholder records provenance and is not a command path:

git status -sb
git branch --show-current
git rev-parse HEAD
# Only when node_modules is absent:
# npm ci
.\node_modules\.bin\storybook.cmd dev -p 6008 --host 0.0.0.0 --no-open --disable-telemetry --exact-port

The installed Storybook binary is version 10.6.1. --exact-port prevents silent fallback to another port. The package.json script used 6007 during that session; the current official script uses 6024. The direct command above selects a separate QA port explicitly. If 6008 is occupied, identify its process before stopping or replacing it.

Get-NetIPAddress -AddressFamily IPv4
Get-NetTCPConnection -State Listen -LocalPort 6008 |
  Select-Object LocalAddress, LocalPort, OwningProcess
# For a known PID from the result:
# Get-CimInstance Win32_Process -Filter 'ProcessId=<PID>' |
#   Select-Object ProcessId, CommandLine

Keep the server running while the preview is in use. For shutdown, stop only the confirmed Track B listener (Ctrl+C in its owning terminal, or its identified PID). Do not stop other tracks or other Node processes.

The 2026-10-07 session reused an existing localhost-only Track B listener and replaced only the LAN listener with an explicit 6008 command. Thus localhost and LAN may be served by different processes using the same Track B source. Verify both addresses after subsequent changes.

QA viewports

Use Chrome at browser zoom 100% and Storybook zoom 100%. Select a preset from the toolbar; use enough browser height to avoid clipping the configured iframe height.

HM Desktop · 1280: 1280 × 900
HM Desktop Boundary · 1024: 1024 × 900; Desktop GNB/LNB
HM Mobile Boundary · 1023: 1023 × 900; Mobile GNB/LNB
HM Mobile · 390: 390 × 844

These are QA presets, not production breakpoint changes. GNB Mobile and Mobile Menu Open start at the shared hmMobile390 preset. LNB's existing hmMobile 390 × 844 preset and direct iframe Story IDs remain intact.

The Codex in-app browser showed a fractional-width boundary anomaly at 1023: innerWidth rounded to 1023 while both (max-width: 1023px) and (min-width: 1024px) were false. Chrome at devicePixelRatio 1 passed the exact boundary. Use Chrome for these two boundary checks; do not compensate by changing Production CSS.

Hierarchy and classification

The sidebar order remains Foundation → Components → Patterns → Center Graphic → Theme. Existing verification filtering hides QA/tool stories by default while preserving direct URLs and tag-filter access.

When Storybook cleanup requires an inventory, refresh it from the repository root:

node .storybook/qa/generate-inventory.mjs

See STORY-INVENTORY.md and story-inventory.json. The helper uses the installed Storybook 10.6.1 CSF parser and reads every src/**/*.stories.ts(x) file. Tags in this inventory are source-defined meta/story tags; framework-generated dev/test/manifest tags are available in Storybook's index.json.

KEEP and HIDE describe current navigation. MERGE_CANDIDATE is an advisory review flag, not a removal decision. The current batch does not delete stories or rename titles/exports/IDs. Confirm equivalent QA coverage and search references before future merging or deletion.

Preserve the boundary

All edits must stay in Storybook configuration, stories, or Storybook-only helpers/layout/documentation. Do not modify Track A, packages, themes, Runtime Theme contracts/loaders, package exports/CSS contracts, package versions, publishing, CI/CD, staticDirs for Publishing, or official hosting. Do not merge, rebase, or cherry-pick this batch into main.

For each completed cleanup batch, run typecheck, build-storybook, and git diff --check against the final source state. Build outputs are validation artifacts, not a deployment.

LAN verification

Same-host LAN IP success does not prove access from another physical PC. On a second physical PC, check manager/sidebar/preview, fonts/themes/assets, navigation and HMR. Until then record SECOND_PHYSICAL_PC: NOT_VERIFIED.

The 2026-10-07 network profile was Public, with firewall profiles enabled and pre-existing inbound Node allow rules. No firewall rule or network profile was changed. If a second PC cannot connect, diagnose routing, client isolation and existing firewall policy; do not automatically add rules or change profiles.

5.7 KiB Raw Blame History Unescape Escape