Answer the review: sky toggles in system view too, one media query, idempotent openSearch

Three findings from the automated review, all confirmed before acting.

The Sky toggle did nothing in system view. Its write lived only in the galaxy
crossfade, which the tick parks while the system group is up — and the sky is
still on screen there. It is now also written on toggle, in applyDisplay. The
suggested form of that fix crashed the scene on mount: the effect that calls
applyDisplay fires once at construction, before the engine has a scene, and
getScene() throws — the dock rendered no tabs at all. Guarded on
engine.isInitialized; verified with a screenshot of Proxima with the sky off.

isWideViewport built a fresh MediaQueryList on every document pointer-down;
one module-level query is read instead. And openSearch in the e2e support
clicked the Search tab unconditionally, which would fold it closed if a test
ever called it while already open; it now checks aria-selected first.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016jxMkwA2rbicdGxHosecYi
This commit is contained in:
2026-08-18 21:35:52 +02:00
co-authored by Claude Fable 5
parent 4a1cc5240a
commit 8b507427d8
3 changed files with 16 additions and 4 deletions
+5 -1
View File
@@ -5,6 +5,10 @@ import { Locator, Page } from '@playwright/test';
* type has to open it first — the way a user does, or with the `/` shortcut. Returns the field.
*/
export async function openSearch(page: Page): Promise<Locator> {
await page.getByRole('tab', { name: 'Search' }).click();
// Clicking the active tab folds it closed, so only click when it is not already open.
const tab = page.getByRole('tab', { name: 'Search' });
if ((await tab.getAttribute('aria-selected')) !== 'true') {
await tab.click();
}
return page.getByPlaceholder('Search stars, planets, exoplanets…');
}
@@ -648,14 +648,20 @@ export class GalaxySystemSceneComponent implements AfterViewInit, OnDestroy {
/** Refreshes the readout panel for whichever scale the view is currently at. */
/**
* Shows or hides the layers that hold still between frames: the label layer and the system
* view's orbits and grid. The galaxy grids, deep-sky shell and skybox are crossfaded every
* frame instead, so their toggles live in `updateGalacticCrossfade`.
* view's orbits and grid. The galaxy grids and deep-sky shell are crossfaded every frame
* instead, so their toggles live in `updateGalacticCrossfade`. The skybox is both: the
* crossfade rewrites its intensity while the galaxy is up, but the crossfade is parked in
* system view, where the sky is still on screen — so it is also set here, once, on toggle.
*/
private applyDisplay(display: HudDisplay): void {
if (this.labelOverlay) {
this.labelOverlay.domElement.style.display = display.labels ? '' : 'none';
}
this.systemRenderer?.setLayerVisibility({ orbits: display.orbits, grid: display.grid });
// The effect that calls this fires once at construction, before the engine has a scene.
if (this.engine.isInitialized) {
this.engine.getScene().backgroundIntensity = display.sky ? 1 - this.galacticStrength : 0;
}
}
private updateHud(camera: THREE.PerspectiveCamera): void {
+3 -1
View File
@@ -38,9 +38,11 @@ const TAB_LABELS: Record<DockTab, string> = { search: 'Search', readout: 'Readou
/** Tailwind's `sm` breakpoint: below it the dock is a bare tab strip and its panel is a sheet. */
const WIDE_VIEWPORT = '(min-width: 640px)';
/** One live query, read on every pointer-down, rather than a new MediaQueryList per read. */
const wideViewportQuery = typeof window !== 'undefined' && typeof window.matchMedia === 'function' ? window.matchMedia(WIDE_VIEWPORT) : null;
function isWideViewport(): boolean {
return typeof window === 'undefined' || typeof window.matchMedia !== 'function' ? true : window.matchMedia(WIDE_VIEWPORT).matches;
return wideViewportQuery?.matches ?? true;
}
/**