ui/phase-13: planet inspector — read-only
Plumbs the map → inspector pathway: a click on a planet selects it through the new SelectionStore, the sidebar Inspector tab swaps its empty-state copy for a per-kind read-only field set, and a mobile-only bottom-sheet mirrors the same content over the map. Field projection in api/game-state.ts now surfaces every documented planet field.
This commit is contained in:
@@ -4,8 +4,12 @@
|
||||
// engine container.
|
||||
//
|
||||
// Phase 11 only renders planets, so the helpers keep the report shape
|
||||
// minimal (turn / dimensions / planet vectors). Later phases extend
|
||||
// the helper as ships, fleets, sciences, etc. land.
|
||||
// minimal (turn / dimensions / planet vectors). Phase 13 extended the
|
||||
// fixture with the optional rich planet fields (size, resources,
|
||||
// stockpiles, population, industry, colonists, production, free
|
||||
// industry) so the inspector e2e can drive the read-only display
|
||||
// against realistic values. Later phases extend the helper as ships,
|
||||
// fleets, sciences, etc. land.
|
||||
|
||||
import { Builder } from "flatbuffers";
|
||||
|
||||
@@ -22,9 +26,21 @@ export interface PlanetFixture {
|
||||
name: string;
|
||||
x: number;
|
||||
y: number;
|
||||
size?: number;
|
||||
resources?: number;
|
||||
capital?: number;
|
||||
material?: number;
|
||||
}
|
||||
|
||||
export interface OtherPlanetFixture extends PlanetFixture {
|
||||
export interface InhabitedFixture extends PlanetFixture {
|
||||
population?: number;
|
||||
colonists?: number;
|
||||
industry?: number;
|
||||
production?: string;
|
||||
freeIndustry?: number;
|
||||
}
|
||||
|
||||
export interface OtherPlanetFixture extends InhabitedFixture {
|
||||
owner: string;
|
||||
}
|
||||
|
||||
@@ -32,7 +48,7 @@ export interface ReportFixture {
|
||||
turn: number;
|
||||
mapWidth?: number;
|
||||
mapHeight?: number;
|
||||
localPlanets?: PlanetFixture[];
|
||||
localPlanets?: InhabitedFixture[];
|
||||
otherPlanets?: OtherPlanetFixture[];
|
||||
uninhabitedPlanets?: PlanetFixture[];
|
||||
unidentifiedPlanets?: { number: number; x: number; y: number }[];
|
||||
@@ -43,28 +59,49 @@ export function buildReportPayload(fixture: ReportFixture): Uint8Array {
|
||||
|
||||
const localOffsets = (fixture.localPlanets ?? []).map((planet) => {
|
||||
const name = builder.createString(planet.name);
|
||||
const production =
|
||||
planet.production !== undefined
|
||||
? builder.createString(planet.production)
|
||||
: null;
|
||||
LocalPlanet.startLocalPlanet(builder);
|
||||
LocalPlanet.addNumber(builder, BigInt(planet.number));
|
||||
LocalPlanet.addX(builder, planet.x);
|
||||
LocalPlanet.addY(builder, planet.y);
|
||||
LocalPlanet.addName(builder, name);
|
||||
LocalPlanet.addSize(builder, 10);
|
||||
LocalPlanet.addResources(builder, 0.5);
|
||||
LocalPlanet.addPopulation(builder, 0);
|
||||
LocalPlanet.addIndustry(builder, 0);
|
||||
LocalPlanet.addSize(builder, planet.size ?? 10);
|
||||
LocalPlanet.addResources(builder, planet.resources ?? 0.5);
|
||||
LocalPlanet.addCapital(builder, planet.capital ?? 0);
|
||||
LocalPlanet.addMaterial(builder, planet.material ?? 0);
|
||||
LocalPlanet.addPopulation(builder, planet.population ?? 0);
|
||||
LocalPlanet.addIndustry(builder, planet.industry ?? 0);
|
||||
LocalPlanet.addColonists(builder, planet.colonists ?? 0);
|
||||
if (production !== null) LocalPlanet.addProduction(builder, production);
|
||||
LocalPlanet.addFreeIndustry(builder, planet.freeIndustry ?? 0);
|
||||
return LocalPlanet.endLocalPlanet(builder);
|
||||
});
|
||||
|
||||
const otherOffsets = (fixture.otherPlanets ?? []).map((planet) => {
|
||||
const name = builder.createString(planet.name);
|
||||
const owner = builder.createString(planet.owner);
|
||||
const production =
|
||||
planet.production !== undefined
|
||||
? builder.createString(planet.production)
|
||||
: null;
|
||||
OtherPlanet.startOtherPlanet(builder);
|
||||
OtherPlanet.addNumber(builder, BigInt(planet.number));
|
||||
OtherPlanet.addX(builder, planet.x);
|
||||
OtherPlanet.addY(builder, planet.y);
|
||||
OtherPlanet.addName(builder, name);
|
||||
OtherPlanet.addOwner(builder, owner);
|
||||
OtherPlanet.addSize(builder, 9);
|
||||
OtherPlanet.addSize(builder, planet.size ?? 9);
|
||||
OtherPlanet.addResources(builder, planet.resources ?? 0.5);
|
||||
OtherPlanet.addCapital(builder, planet.capital ?? 0);
|
||||
OtherPlanet.addMaterial(builder, planet.material ?? 0);
|
||||
OtherPlanet.addPopulation(builder, planet.population ?? 0);
|
||||
OtherPlanet.addIndustry(builder, planet.industry ?? 0);
|
||||
OtherPlanet.addColonists(builder, planet.colonists ?? 0);
|
||||
if (production !== null) OtherPlanet.addProduction(builder, production);
|
||||
OtherPlanet.addFreeIndustry(builder, planet.freeIndustry ?? 0);
|
||||
return OtherPlanet.endOtherPlanet(builder);
|
||||
});
|
||||
|
||||
@@ -76,7 +113,10 @@ export function buildReportPayload(fixture: ReportFixture): Uint8Array {
|
||||
UninhabitedPlanet.addX(builder, planet.x);
|
||||
UninhabitedPlanet.addY(builder, planet.y);
|
||||
UninhabitedPlanet.addName(builder, name);
|
||||
UninhabitedPlanet.addSize(builder, 6);
|
||||
UninhabitedPlanet.addSize(builder, planet.size ?? 6);
|
||||
UninhabitedPlanet.addResources(builder, planet.resources ?? 0.5);
|
||||
UninhabitedPlanet.addCapital(builder, planet.capital ?? 0);
|
||||
UninhabitedPlanet.addMaterial(builder, planet.material ?? 0);
|
||||
return UninhabitedPlanet.endUninhabitedPlanet(builder);
|
||||
},
|
||||
);
|
||||
|
||||
@@ -0,0 +1,223 @@
|
||||
// Phase 13 end-to-end coverage for the planet inspector. Boots an
|
||||
// authenticated session and a mocked gateway with a single local
|
||||
// planet placed at the world centre, navigates to the map view, and
|
||||
// drives a real canvas click into the renderer's `clicked` event.
|
||||
// On desktop the sidebar inspector tab swaps from the empty state to
|
||||
// the planet view; on the mobile project the bottom-sheet appears
|
||||
// and the close button clears it.
|
||||
|
||||
import { fromJson, type JsonValue } from "@bufbuild/protobuf";
|
||||
import { expect, test, type Page } from "@playwright/test";
|
||||
import { ByteBuffer } from "flatbuffers";
|
||||
|
||||
import { ExecuteCommandRequestSchema } from "../../src/proto/galaxy/gateway/v1/edge_gateway_pb";
|
||||
import { UUID } from "../../src/proto/galaxy/fbs/common";
|
||||
import { GameReportRequest } from "../../src/proto/galaxy/fbs/report";
|
||||
import { forgeExecuteCommandResponseJson } from "./fixtures/sign-response";
|
||||
import {
|
||||
buildMyGamesListPayload,
|
||||
type GameFixture,
|
||||
} from "./fixtures/lobby-fbs";
|
||||
import { buildReportPayload } from "./fixtures/report-fbs";
|
||||
|
||||
const SESSION_ID = "phase-13-inspector-session";
|
||||
const GAME_ID = "13131313-1313-1313-1313-131313131313";
|
||||
const WORLD = 4000;
|
||||
const CENTRE = WORLD / 2;
|
||||
|
||||
interface MockOpts {
|
||||
currentTurn: number;
|
||||
report: Parameters<typeof buildReportPayload>[0];
|
||||
}
|
||||
|
||||
async function mockGateway(page: Page, opts: MockOpts): Promise<void> {
|
||||
const game: GameFixture = {
|
||||
gameId: GAME_ID,
|
||||
gameName: "Phase 13 Game",
|
||||
gameType: "private",
|
||||
status: "running",
|
||||
ownerUserId: "user-1",
|
||||
minPlayers: 2,
|
||||
maxPlayers: 8,
|
||||
enrollmentEndsAtMs: BigInt(Date.now() + 86_400_000),
|
||||
createdAtMs: BigInt(Date.now() - 86_400_000),
|
||||
updatedAtMs: BigInt(Date.now()),
|
||||
currentTurn: opts.currentTurn,
|
||||
};
|
||||
|
||||
await page.route(
|
||||
"**/galaxy.gateway.v1.EdgeGateway/ExecuteCommand",
|
||||
async (route) => {
|
||||
const reqText = route.request().postData();
|
||||
if (reqText === null) {
|
||||
await route.fulfill({ status: 400 });
|
||||
return;
|
||||
}
|
||||
const req = fromJson(
|
||||
ExecuteCommandRequestSchema,
|
||||
JSON.parse(reqText) as JsonValue,
|
||||
);
|
||||
|
||||
let resultCode = "ok";
|
||||
let payload: Uint8Array;
|
||||
switch (req.messageType) {
|
||||
case "lobby.my.games.list":
|
||||
payload = buildMyGamesListPayload([game]);
|
||||
break;
|
||||
case "user.games.report": {
|
||||
// Drain the request to keep the decoder happy even though
|
||||
// we ignore the turn — the fixture serves a single snapshot.
|
||||
GameReportRequest.getRootAsGameReportRequest(
|
||||
new ByteBuffer(req.payloadBytes),
|
||||
).gameId(new UUID());
|
||||
payload = buildReportPayload(opts.report);
|
||||
break;
|
||||
}
|
||||
default:
|
||||
resultCode = "internal_error";
|
||||
payload = new Uint8Array();
|
||||
}
|
||||
|
||||
const body = await forgeExecuteCommandResponseJson({
|
||||
requestId: req.requestId,
|
||||
timestampMs: BigInt(Date.now()),
|
||||
resultCode,
|
||||
payloadBytes: payload,
|
||||
});
|
||||
await route.fulfill({
|
||||
status: 200,
|
||||
contentType: "application/json",
|
||||
body,
|
||||
});
|
||||
},
|
||||
);
|
||||
|
||||
await page.route(
|
||||
"**/galaxy.gateway.v1.EdgeGateway/SubscribeEvents",
|
||||
async () => {
|
||||
await new Promise<void>(() => {});
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
async function bootSession(page: Page): Promise<void> {
|
||||
await page.goto("/__debug/store");
|
||||
await expect(page.getByTestId("debug-store-ready")).toBeVisible();
|
||||
await page.waitForFunction(() => window.__galaxyDebug?.ready === true);
|
||||
await page.evaluate(() => window.__galaxyDebug!.clearSession());
|
||||
await page.evaluate(
|
||||
(id) => window.__galaxyDebug!.setDeviceSessionId(id),
|
||||
SESSION_ID,
|
||||
);
|
||||
}
|
||||
|
||||
async function setupShell(page: Page): Promise<void> {
|
||||
await mockGateway(page, {
|
||||
currentTurn: 4,
|
||||
report: {
|
||||
turn: 4,
|
||||
mapWidth: WORLD,
|
||||
mapHeight: WORLD,
|
||||
localPlanets: [
|
||||
{
|
||||
number: 17,
|
||||
name: "Galactica",
|
||||
x: CENTRE,
|
||||
y: CENTRE,
|
||||
size: 1000,
|
||||
resources: 10,
|
||||
capital: 0,
|
||||
material: 0,
|
||||
population: 850,
|
||||
colonists: 25,
|
||||
industry: 700,
|
||||
production: "drive",
|
||||
freeIndustry: 175,
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
||||
await bootSession(page);
|
||||
await page.goto(`/games/${GAME_ID}/map`);
|
||||
await expect(page.getByTestId("active-view-map")).toHaveAttribute(
|
||||
"data-status",
|
||||
"ready",
|
||||
);
|
||||
await expect(page.getByTestId("map-canvas-wrap")).toHaveAttribute(
|
||||
"data-planet-count",
|
||||
"1",
|
||||
);
|
||||
}
|
||||
|
||||
async function clickCanvasCentre(page: Page): Promise<void> {
|
||||
const canvas = page.locator("canvas");
|
||||
const box = await canvas.boundingBox();
|
||||
expect(box).not.toBeNull();
|
||||
if (box === null) throw new Error("canvas has no bounding box");
|
||||
const cx = box.x + box.width / 2;
|
||||
const cy = box.y + box.height / 2;
|
||||
await page.mouse.click(cx, cy);
|
||||
}
|
||||
|
||||
test("clicking a planet on the map shows it in the desktop inspector tab", async ({
|
||||
page,
|
||||
}, testInfo) => {
|
||||
test.skip(
|
||||
testInfo.project.name.startsWith("chromium-mobile"),
|
||||
"sidebar is hidden on mobile breakpoint",
|
||||
);
|
||||
await setupShell(page);
|
||||
|
||||
// Empty state before any selection.
|
||||
const sidebar = page.getByTestId("sidebar-tool-inspector");
|
||||
await expect(sidebar).toContainText("select an object on the map");
|
||||
|
||||
await clickCanvasCentre(page);
|
||||
|
||||
// Both the sidebar inspector and the bottom-sheet receive the
|
||||
// same selection — the sheet is hidden by CSS at the desktop
|
||||
// breakpoint but still mounted in the DOM, so the assertions
|
||||
// scope explicitly to the sidebar to avoid the strict-mode
|
||||
// duplicate-locator trap.
|
||||
const inspector = sidebar.getByTestId("inspector-planet");
|
||||
await expect(inspector).toBeVisible();
|
||||
await expect(inspector).toHaveAttribute("data-planet-id", "17");
|
||||
await expect(sidebar.getByTestId("inspector-planet-name")).toHaveText(
|
||||
"Galactica",
|
||||
);
|
||||
await expect(
|
||||
sidebar.getByTestId("inspector-planet-field-population"),
|
||||
).toContainText("850");
|
||||
await expect(
|
||||
sidebar.getByTestId("inspector-planet-field-industry"),
|
||||
).toContainText("700");
|
||||
await expect(
|
||||
sidebar.getByTestId("inspector-planet-field-production"),
|
||||
).toContainText("drive");
|
||||
});
|
||||
|
||||
test("clicking a planet on mobile raises the bottom-sheet, close clears it", async ({
|
||||
page,
|
||||
}, testInfo) => {
|
||||
test.skip(
|
||||
!testInfo.project.name.startsWith("chromium-mobile"),
|
||||
"sheet is mobile-only",
|
||||
);
|
||||
await setupShell(page);
|
||||
|
||||
// No sheet before the click.
|
||||
await expect(page.getByTestId("inspector-planet-sheet")).toHaveCount(0);
|
||||
|
||||
await clickCanvasCentre(page);
|
||||
|
||||
const sheet = page.getByTestId("inspector-planet-sheet");
|
||||
await expect(sheet).toBeVisible();
|
||||
const inspector = sheet.getByTestId("inspector-planet");
|
||||
await expect(inspector).toHaveAttribute("data-planet-id", "17");
|
||||
await expect(sheet.getByTestId("inspector-planet-name")).toHaveText(
|
||||
"Galactica",
|
||||
);
|
||||
|
||||
await page.getByTestId("inspector-planet-sheet-close").click();
|
||||
await expect(page.getByTestId("inspector-planet-sheet")).toHaveCount(0);
|
||||
});
|
||||
@@ -1,7 +1,8 @@
|
||||
// Component tests for the Phase 10 in-game shell sidebar. Validates
|
||||
// the default selected tab, the Calculator / Inspector / Order
|
||||
// switching, the empty-state copy that matches the IA section, and
|
||||
// the `?sidebar=` URL seed convention used by the mobile bottom-tabs.
|
||||
// switching, the empty-state copy that matches the IA section, the
|
||||
// `?sidebar=` URL seed convention used by the mobile bottom-tabs,
|
||||
// and the Phase 13 selection-driven planet inspector content.
|
||||
|
||||
import "@testing-library/jest-dom/vitest";
|
||||
import { fireEvent, render } from "@testing-library/svelte";
|
||||
@@ -14,6 +15,15 @@ import {
|
||||
} from "vitest";
|
||||
|
||||
import { i18n } from "../src/lib/i18n/index.svelte";
|
||||
import {
|
||||
GAME_STATE_CONTEXT_KEY,
|
||||
GameStateStore,
|
||||
} from "../src/lib/game-state.svelte";
|
||||
import {
|
||||
SELECTION_CONTEXT_KEY,
|
||||
SelectionStore,
|
||||
} from "../src/lib/selection.svelte";
|
||||
import type { GameReport, ReportPlanet } from "../src/api/game-state";
|
||||
|
||||
const pageMock = vi.hoisted(() => ({
|
||||
url: new URL("http://localhost/games/g1/map"),
|
||||
@@ -26,6 +36,53 @@ vi.mock("$app/state", () => ({
|
||||
|
||||
import Sidebar from "../src/lib/sidebar/sidebar.svelte";
|
||||
|
||||
function makePlanet(overrides: Partial<ReportPlanet>): ReportPlanet {
|
||||
return {
|
||||
number: 0,
|
||||
name: "",
|
||||
x: 0,
|
||||
y: 0,
|
||||
kind: "local",
|
||||
owner: null,
|
||||
size: null,
|
||||
resources: null,
|
||||
industryStockpile: null,
|
||||
materialsStockpile: null,
|
||||
industry: null,
|
||||
population: null,
|
||||
colonists: null,
|
||||
production: null,
|
||||
freeIndustry: null,
|
||||
...overrides,
|
||||
};
|
||||
}
|
||||
|
||||
function makeReport(planets: ReportPlanet[]): GameReport {
|
||||
return {
|
||||
turn: 1,
|
||||
mapWidth: 1000,
|
||||
mapHeight: 1000,
|
||||
planetCount: planets.length,
|
||||
planets,
|
||||
};
|
||||
}
|
||||
|
||||
function withStores(report: GameReport | null): {
|
||||
gameState: GameStateStore;
|
||||
selection: SelectionStore;
|
||||
context: Map<unknown, unknown>;
|
||||
} {
|
||||
const gameState = new GameStateStore();
|
||||
gameState.report = report;
|
||||
gameState.status = report === null ? "idle" : "ready";
|
||||
const selection = new SelectionStore();
|
||||
const context = new Map<unknown, unknown>([
|
||||
[GAME_STATE_CONTEXT_KEY, gameState],
|
||||
[SELECTION_CONTEXT_KEY, selection],
|
||||
]);
|
||||
return { gameState, selection, context };
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
i18n.resetForTests("en");
|
||||
pageMock.url = new URL("http://localhost/games/g1/map");
|
||||
@@ -95,4 +152,63 @@ describe("game-shell sidebar", () => {
|
||||
await fireEvent.click(ui.getByTestId("sidebar-close"));
|
||||
expect(onClose).toHaveBeenCalledTimes(1);
|
||||
});
|
||||
|
||||
test("inspector tab swaps to the planet view when a planet is selected", async () => {
|
||||
const planet = makePlanet({
|
||||
number: 17,
|
||||
name: "Galactica",
|
||||
kind: "local",
|
||||
x: 50,
|
||||
y: 75,
|
||||
size: 1000,
|
||||
resources: 10,
|
||||
population: 800,
|
||||
colonists: 0,
|
||||
industry: 600,
|
||||
industryStockpile: 0,
|
||||
materialsStockpile: 0,
|
||||
production: "drive",
|
||||
freeIndustry: 200,
|
||||
});
|
||||
const { selection, context } = withStores(makeReport([planet]));
|
||||
const ui = render(
|
||||
Sidebar,
|
||||
{
|
||||
props: { open: false, onClose: () => {} },
|
||||
context,
|
||||
},
|
||||
);
|
||||
expect(ui.getByTestId("sidebar-tool-inspector")).toHaveTextContent(
|
||||
"select an object on the map",
|
||||
);
|
||||
|
||||
selection.selectPlanet(17);
|
||||
await Promise.resolve();
|
||||
expect(ui.queryByText("select an object on the map")).toBeNull();
|
||||
expect(ui.getByTestId("inspector-planet")).toHaveAttribute(
|
||||
"data-planet-id",
|
||||
"17",
|
||||
);
|
||||
expect(ui.getByTestId("inspector-planet-name")).toHaveTextContent(
|
||||
"Galactica",
|
||||
);
|
||||
});
|
||||
|
||||
test("selection that points at a missing planet falls back to the empty state", () => {
|
||||
const { selection, context } = withStores(
|
||||
makeReport([makePlanet({ number: 1, name: "Visible", kind: "local" })]),
|
||||
);
|
||||
selection.selectPlanet(999);
|
||||
const ui = render(
|
||||
Sidebar,
|
||||
{
|
||||
props: { open: false, onClose: () => {} },
|
||||
context,
|
||||
},
|
||||
);
|
||||
expect(ui.queryByTestId("inspector-planet")).toBeNull();
|
||||
expect(ui.getByTestId("sidebar-tool-inspector")).toHaveTextContent(
|
||||
"select an object on the map",
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -0,0 +1,218 @@
|
||||
// Vitest component coverage for the read-only planet inspector.
|
||||
// Each kind has a dedicated case so the per-kind field gating
|
||||
// (which fields are present, which are hidden) is verified
|
||||
// explicitly. The component is purely presentational, so the tests
|
||||
// drive it with synthetic `ReportPlanet` literals — no store.
|
||||
|
||||
import "@testing-library/jest-dom/vitest";
|
||||
import { render } from "@testing-library/svelte";
|
||||
import { beforeEach, describe, expect, test } from "vitest";
|
||||
|
||||
import { i18n } from "../src/lib/i18n/index.svelte";
|
||||
import type { ReportPlanet } from "../src/api/game-state";
|
||||
import Planet from "../src/lib/inspectors/planet.svelte";
|
||||
|
||||
beforeEach(() => {
|
||||
i18n.resetForTests("en");
|
||||
});
|
||||
|
||||
function makePlanet(overrides: Partial<ReportPlanet>): ReportPlanet {
|
||||
return {
|
||||
number: 0,
|
||||
name: "",
|
||||
x: 0,
|
||||
y: 0,
|
||||
kind: "local",
|
||||
owner: null,
|
||||
size: null,
|
||||
resources: null,
|
||||
industryStockpile: null,
|
||||
materialsStockpile: null,
|
||||
industry: null,
|
||||
population: null,
|
||||
colonists: null,
|
||||
production: null,
|
||||
freeIndustry: null,
|
||||
...overrides,
|
||||
};
|
||||
}
|
||||
|
||||
describe("planet inspector", () => {
|
||||
test("local planet renders the full economy field set", () => {
|
||||
const ui = render(Planet, {
|
||||
props: {
|
||||
planet: makePlanet({
|
||||
number: 7,
|
||||
name: "Home World",
|
||||
kind: "local",
|
||||
x: 100.25,
|
||||
y: 200,
|
||||
size: 1000,
|
||||
resources: 10,
|
||||
population: 950,
|
||||
colonists: 50,
|
||||
industry: 800,
|
||||
industryStockpile: 12.5,
|
||||
materialsStockpile: 30,
|
||||
production: "drive",
|
||||
freeIndustry: 187.5,
|
||||
}),
|
||||
},
|
||||
});
|
||||
const section = ui.getByTestId("inspector-planet");
|
||||
expect(section).toHaveAttribute("data-planet-id", "7");
|
||||
expect(section).toHaveAttribute("data-planet-kind", "local");
|
||||
expect(ui.getByTestId("inspector-planet-name")).toHaveTextContent(
|
||||
"Home World",
|
||||
);
|
||||
expect(ui.getByTestId("inspector-planet-kind")).toHaveTextContent(
|
||||
"your planet",
|
||||
);
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-coordinates"),
|
||||
).toHaveTextContent("(100.25, 200)");
|
||||
expect(ui.getByTestId("inspector-planet-field-size")).toHaveTextContent(
|
||||
"size",
|
||||
);
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-natural_resources"),
|
||||
).toHaveTextContent("10");
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-population"),
|
||||
).toHaveTextContent("950");
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-colonists"),
|
||||
).toHaveTextContent("50");
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-industry"),
|
||||
).toHaveTextContent("800");
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-industry_stockpile"),
|
||||
).toHaveTextContent("12.5");
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-materials_stockpile"),
|
||||
).toHaveTextContent("30");
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-production"),
|
||||
).toHaveTextContent("drive");
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-free_industry"),
|
||||
).toHaveTextContent("187.5");
|
||||
expect(ui.queryByTestId("inspector-planet-field-owner")).toBeNull();
|
||||
expect(ui.queryByTestId("inspector-planet-no-data")).toBeNull();
|
||||
});
|
||||
|
||||
test("other-race planet shows the owner row", () => {
|
||||
const ui = render(Planet, {
|
||||
props: {
|
||||
planet: makePlanet({
|
||||
number: 9,
|
||||
name: "Far Away",
|
||||
kind: "other",
|
||||
owner: "Federation",
|
||||
size: 700,
|
||||
resources: 5,
|
||||
population: 500,
|
||||
colonists: 12,
|
||||
industry: 400,
|
||||
industryStockpile: 5,
|
||||
materialsStockpile: 8,
|
||||
production: "weapons",
|
||||
freeIndustry: 75,
|
||||
}),
|
||||
},
|
||||
});
|
||||
expect(ui.getByTestId("inspector-planet-kind")).toHaveTextContent(
|
||||
"other race planet",
|
||||
);
|
||||
expect(ui.getByTestId("inspector-planet-field-owner")).toHaveTextContent(
|
||||
"Federation",
|
||||
);
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-population"),
|
||||
).toHaveTextContent("500");
|
||||
});
|
||||
|
||||
test("uninhabited planet hides population, industry, and production rows", () => {
|
||||
const ui = render(Planet, {
|
||||
props: {
|
||||
planet: makePlanet({
|
||||
number: 3,
|
||||
name: "Bare Rock",
|
||||
kind: "uninhabited",
|
||||
size: 250,
|
||||
resources: 1.5,
|
||||
industryStockpile: 0,
|
||||
materialsStockpile: 0,
|
||||
}),
|
||||
},
|
||||
});
|
||||
expect(ui.getByTestId("inspector-planet-kind")).toHaveTextContent(
|
||||
"uninhabited planet",
|
||||
);
|
||||
expect(ui.getByTestId("inspector-planet-name")).toHaveTextContent(
|
||||
"Bare Rock",
|
||||
);
|
||||
expect(ui.getByTestId("inspector-planet-field-size")).toHaveTextContent(
|
||||
"250",
|
||||
);
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-natural_resources"),
|
||||
).toHaveTextContent("1.5");
|
||||
expect(ui.queryByTestId("inspector-planet-field-population")).toBeNull();
|
||||
expect(ui.queryByTestId("inspector-planet-field-colonists")).toBeNull();
|
||||
expect(ui.queryByTestId("inspector-planet-field-industry")).toBeNull();
|
||||
expect(ui.queryByTestId("inspector-planet-field-production")).toBeNull();
|
||||
expect(ui.queryByTestId("inspector-planet-field-free_industry")).toBeNull();
|
||||
expect(ui.queryByTestId("inspector-planet-field-owner")).toBeNull();
|
||||
});
|
||||
|
||||
test("unidentified planet shows the no-data hint and only coordinates", () => {
|
||||
const ui = render(Planet, {
|
||||
props: {
|
||||
planet: makePlanet({
|
||||
number: 42,
|
||||
kind: "unidentified",
|
||||
x: 1234,
|
||||
y: -5,
|
||||
}),
|
||||
},
|
||||
});
|
||||
expect(ui.getByTestId("inspector-planet-kind")).toHaveTextContent(
|
||||
"unidentified planet",
|
||||
);
|
||||
expect(ui.queryByTestId("inspector-planet-name")).toBeNull();
|
||||
expect(ui.getByTestId("inspector-planet-no-data")).toHaveTextContent(
|
||||
"no data",
|
||||
);
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-coordinates"),
|
||||
).toHaveTextContent("(1,234, -5)");
|
||||
expect(ui.queryByTestId("inspector-planet-field-size")).toBeNull();
|
||||
expect(ui.queryByTestId("inspector-planet-field-natural_resources")).toBeNull();
|
||||
});
|
||||
|
||||
test("missing production string falls back to the localised placeholder", () => {
|
||||
const ui = render(Planet, {
|
||||
props: {
|
||||
planet: makePlanet({
|
||||
number: 5,
|
||||
name: "Idle",
|
||||
kind: "local",
|
||||
size: 800,
|
||||
resources: 1,
|
||||
population: 1,
|
||||
colonists: 0,
|
||||
industry: 0,
|
||||
industryStockpile: 0,
|
||||
materialsStockpile: 0,
|
||||
production: "",
|
||||
freeIndustry: 0,
|
||||
}),
|
||||
},
|
||||
});
|
||||
expect(
|
||||
ui.getByTestId("inspector-planet-field-production"),
|
||||
).toHaveTextContent("none");
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,47 @@
|
||||
// SelectionStore unit tests. The store is in-memory only and carries
|
||||
// no async lifecycle, so the cases focus on the rune transitions and
|
||||
// the post-`dispose` no-op contract.
|
||||
|
||||
import { describe, expect, test } from "vitest";
|
||||
|
||||
import { SelectionStore } from "../src/lib/selection.svelte";
|
||||
|
||||
describe("SelectionStore", () => {
|
||||
test("initial state has no selection", () => {
|
||||
const store = new SelectionStore();
|
||||
expect(store.selected).toBeNull();
|
||||
});
|
||||
|
||||
test("selectPlanet records the planet id", () => {
|
||||
const store = new SelectionStore();
|
||||
store.selectPlanet(42);
|
||||
expect(store.selected).toEqual({ kind: "planet", id: 42 });
|
||||
});
|
||||
|
||||
test("selectPlanet replaces the previous selection", () => {
|
||||
const store = new SelectionStore();
|
||||
store.selectPlanet(1);
|
||||
store.selectPlanet(2);
|
||||
expect(store.selected).toEqual({ kind: "planet", id: 2 });
|
||||
});
|
||||
|
||||
test("clear resets the selection to null", () => {
|
||||
const store = new SelectionStore();
|
||||
store.selectPlanet(7);
|
||||
store.clear();
|
||||
expect(store.selected).toBeNull();
|
||||
});
|
||||
|
||||
test("dispose blocks subsequent mutations", () => {
|
||||
const store = new SelectionStore();
|
||||
store.selectPlanet(3);
|
||||
store.dispose();
|
||||
expect(store.selected).toBeNull();
|
||||
|
||||
store.selectPlanet(4);
|
||||
expect(store.selected).toBeNull();
|
||||
|
||||
store.clear();
|
||||
expect(store.selected).toBeNull();
|
||||
});
|
||||
});
|
||||
@@ -9,7 +9,7 @@
|
||||
import "@testing-library/jest-dom/vitest";
|
||||
import { describe, expect, test } from "vitest";
|
||||
|
||||
import type { GameReport } from "../src/api/game-state";
|
||||
import type { GameReport, ReportPlanet } from "../src/api/game-state";
|
||||
import { reportToWorld } from "../src/map/state-binding";
|
||||
|
||||
function makeReport(overrides: Partial<GameReport> = {}): GameReport {
|
||||
@@ -23,6 +23,29 @@ function makeReport(overrides: Partial<GameReport> = {}): GameReport {
|
||||
};
|
||||
}
|
||||
|
||||
// makePlanet fills the rich-projection fields the binding does not
|
||||
// inspect with `null`s so the binding-focused tests stay readable.
|
||||
function makePlanet(overrides: Partial<ReportPlanet>): ReportPlanet {
|
||||
return {
|
||||
number: 0,
|
||||
name: "",
|
||||
x: 0,
|
||||
y: 0,
|
||||
kind: "local",
|
||||
owner: null,
|
||||
size: null,
|
||||
resources: null,
|
||||
industryStockpile: null,
|
||||
materialsStockpile: null,
|
||||
industry: null,
|
||||
population: null,
|
||||
colonists: null,
|
||||
production: null,
|
||||
freeIndustry: null,
|
||||
...overrides,
|
||||
};
|
||||
}
|
||||
|
||||
describe("reportToWorld", () => {
|
||||
test("uses report dimensions for the World", () => {
|
||||
const world = reportToWorld(makeReport({ mapWidth: 3200, mapHeight: 1600 }));
|
||||
@@ -34,10 +57,10 @@ describe("reportToWorld", () => {
|
||||
const world = reportToWorld(
|
||||
makeReport({
|
||||
planets: [
|
||||
{ number: 1, name: "Home", x: 100, y: 100, kind: "local", owner: null, size: 12, resources: 0.5 },
|
||||
{ number: 2, name: "Alpha", x: 200, y: 100, kind: "other", owner: "Federation", size: 8, resources: 0.3 },
|
||||
{ number: 3, name: "Rock", x: 100, y: 200, kind: "uninhabited", owner: null, size: 4, resources: 0.1 },
|
||||
{ number: 4, name: "", x: 200, y: 200, kind: "unidentified", owner: null, size: null, resources: null },
|
||||
makePlanet({ number: 1, name: "Home", x: 100, y: 100, kind: "local", size: 12, resources: 0.5 }),
|
||||
makePlanet({ number: 2, name: "Alpha", x: 200, y: 100, kind: "other", owner: "Federation", size: 8, resources: 0.3 }),
|
||||
makePlanet({ number: 3, name: "Rock", x: 100, y: 200, kind: "uninhabited", size: 4, resources: 0.1 }),
|
||||
makePlanet({ number: 4, name: "", x: 200, y: 200, kind: "unidentified" }),
|
||||
],
|
||||
}),
|
||||
);
|
||||
@@ -51,7 +74,7 @@ describe("reportToWorld", () => {
|
||||
const world = reportToWorld(
|
||||
makeReport({
|
||||
planets: [
|
||||
{ number: 42, name: "Home", x: 123.5, y: 456.25, kind: "local", owner: null, size: 10, resources: 0.5 },
|
||||
makePlanet({ number: 42, name: "Home", x: 123.5, y: 456.25, kind: "local", size: 10, resources: 0.5 }),
|
||||
],
|
||||
}),
|
||||
);
|
||||
@@ -68,10 +91,10 @@ describe("reportToWorld", () => {
|
||||
const world = reportToWorld(
|
||||
makeReport({
|
||||
planets: [
|
||||
{ number: 1, name: "L", x: 0, y: 0, kind: "local", owner: null, size: 1, resources: 0 },
|
||||
{ number: 2, name: "O", x: 1, y: 0, kind: "other", owner: "Foe", size: 1, resources: 0 },
|
||||
{ number: 3, name: "U", x: 2, y: 0, kind: "uninhabited", owner: null, size: 1, resources: 0 },
|
||||
{ number: 4, name: "?", x: 3, y: 0, kind: "unidentified", owner: null, size: null, resources: null },
|
||||
makePlanet({ number: 1, name: "L", kind: "local", size: 1, resources: 0 }),
|
||||
makePlanet({ number: 2, name: "O", x: 1, kind: "other", owner: "Foe", size: 1, resources: 0 }),
|
||||
makePlanet({ number: 3, name: "U", x: 2, kind: "uninhabited", size: 1, resources: 0 }),
|
||||
makePlanet({ number: 4, name: "?", x: 3, kind: "unidentified" }),
|
||||
],
|
||||
}),
|
||||
);
|
||||
@@ -102,8 +125,8 @@ describe("reportToWorld", () => {
|
||||
const world = reportToWorld(
|
||||
makeReport({
|
||||
planets: [
|
||||
{ number: 1, name: "Home", x: 0, y: 0, kind: "local", owner: null, size: 1, resources: 0 },
|
||||
{ number: 2, name: "?", x: 0, y: 0, kind: "unidentified", owner: null, size: null, resources: null },
|
||||
makePlanet({ number: 1, name: "Home", kind: "local", size: 1, resources: 0 }),
|
||||
makePlanet({ number: 2, name: "?", kind: "unidentified" }),
|
||||
],
|
||||
}),
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user