Files
star-map/src/app/features/galaxy-system/system-object-card.component.spec.ts
T
Claude 7b0f32f71a Assemble a body's readouts once, not once per panel
Follow-up to review on #3. The card and the detail page each built their own Measured/Derived
split, kind label and provenance sentence — the drift buildBodyViewModel exists to prevent,
re-forked one layer up, and the drift would have been in which side of the measured/derived line
a quantity falls on, which is the distinction those panels exist to draw. One bodyReadouts(body)
now returns both blocks and the sentence, and both templates iterate it. The two surfaces render
identical rows as a result, and the card gains the inclination the detail page already showed.

Also from that review:

- KIND_LABELS was duplicated between the two panels; it now lives beside bodyReadouts. The third
  copy the review pointed at is a different union (search results are star/body/exoplanet, and
  label a body "Body"), so it stays where it is.
- CardRow was HudReadout renamed. Both are now Readout, which HudReadout extends with its
  derived flag.
- The enterable-systems count was a 21-line lazy memo over arrays that are already in hand; it is
  one expression where those arrays are assigned.
- buildBodyViewModel now carries hostStarId, so the detail scene stops rescanning both catalogues
  for something the builder had already resolved.
- heliocentricPeriodDays was called twice for the same body.
- The superscript helper was a split/map/join; it is a replace.
- info-panel had five computed() each wrapping one pure call with a non-null assertion, beside a
  template that inlined the same kind of call directly. They are gone with the shared readouts.
- Dropped a tautological test that compared a pure function to itself. Replaced with one that
  asserts the host star id the builder now carries.
- Removed the orphaned doc comment left behind when formatParsecs/formatAu moved out.

And one the review raised as out of scope but is worth taking: formatRadiusKm grouped thousands
above its decimal threshold and not below it, so 69,911 km sat beside a bare 6371 km. Both are
grouped now.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WaySiNst4HhDXBHnMy8p5G
2026-08-06 03:52:11 +00:00

117 lines
4.3 KiB
TypeScript

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { beforeEach, describe, expect, it } from 'vitest';
import { BodyDetailViewModel } from '../body-detail/body-detail.model';
import { PlanetAppearance } from '../../shared/astro/planet-appearance';
import { SystemObjectCardComponent } from './system-object-card.component';
const appearance = (overrides: Partial<PlanetAppearance> = {}): PlanetAppearance =>
({
planetClass: 'temperate',
palette: { structure: 'mottled' },
equilibriumTemperatureK: 255,
bulkDensityGramsPerCm3: 5.51,
polarCapExtentDeg: 25,
seed: 1,
...overrides,
}) as PlanetAppearance;
const earth: BodyDetailViewModel = {
id: 'earth',
name: 'Earth',
kind: 'planet',
hostStarName: 'Sol',
radiusKm: 6371,
orbit: { semiMajorAxisAu: 1, eccentricity: 0.0167 },
appearance: appearance(),
hasPhotography: true,
orbitalPeriodDays: 365.25,
orbitalPeriodSource: 'derived',
};
describe('SystemObjectCardComponent', () => {
let fixture: ComponentFixture<SystemObjectCardComponent>;
function render(body: BodyDetailViewModel): HTMLElement {
fixture.componentRef.setInput('body', body);
fixture.detectChanges();
return fixture.nativeElement as HTMLElement;
}
/** The label/value pairs under one of the two headings, in order. */
function block(host: HTMLElement, heading: 'Measured' | 'Derived'): string[] {
const headings = [...host.querySelectorAll('p')].filter((p) => p.textContent?.trim() === heading);
const list = headings[0]?.nextElementSibling;
return list ? [...list.querySelectorAll('dt')].map((dt) => dt.textContent?.trim() ?? '') : [];
}
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [SystemObjectCardComponent],
}).compileComponents();
fixture = TestBed.createComponent(SystemObjectCardComponent);
});
it('files a period computed from the semi-major axis under Derived', () => {
const host = render(earth);
expect(block(host, 'Derived')).toContain('Period');
expect(block(host, 'Measured')).not.toContain('Period');
});
it('files a published period under Measured instead', () => {
// Same field, opposite heading — the provenance flag is what decides, not the field's name.
const host = render({ ...earth, orbitalPeriodSource: 'measured' });
expect(block(host, 'Measured')).toContain('Period');
expect(block(host, 'Derived')).not.toContain('Period');
});
it('omits the period entirely when there is none to show', () => {
const host = render({ ...earth, orbitalPeriodDays: undefined, orbitalPeriodSource: undefined });
expect(block(host, 'Measured')).not.toContain('Period');
expect(block(host, 'Derived')).not.toContain('Period');
});
it('never shows an empty Measured block', () => {
const bare: BodyDetailViewModel = {
...earth,
radiusKm: undefined,
orbit: {},
orbitalPeriodDays: undefined,
orbitalPeriodSource: undefined,
discoveryYear: undefined,
};
expect(render(bare).textContent).not.toContain('Measured');
});
it('says a photographed surface is a photograph', () => {
expect(render(earth).textContent).toContain('photography');
});
it('says an illustrated surface is not an observation', () => {
expect(render({ ...earth, hasPhotography: false }).textContent).toContain('Not an observation');
});
it('explains a missing temperature rather than leaving the row blank', () => {
const host = render({
...earth,
hasPhotography: false,
appearance: appearance({ equilibriumTemperatureK: null }),
});
expect(block(host, 'Derived')).not.toContain('Equilibrium temp.');
expect(host.textContent).toContain('host star is not in the catalogue');
});
it('emits rather than navigating, so the scene decides what selection means', () => {
const host = render(earth);
let opened = 0;
let dismissed = 0;
fixture.componentInstance.openRequested.subscribe(() => (opened += 1));
fixture.componentInstance.dismissed.subscribe(() => (dismissed += 1));
host.querySelector<HTMLButtonElement>('button[aria-label="Close"]')!.click();
[...host.querySelectorAll('button')].find((button) => button.textContent?.includes('Full view'))!.click();
expect({ opened, dismissed }).toEqual({ opened: 1, dismissed: 1 });
});
});