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:
Ilia Denisov
@@ -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");
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user