chore: import upstream snapshot with attribution

js/nativeplot/NativePlot.test.ts

@@ -0,0 +1,123 @@
+import { test, describe, afterEach, expect } from "vitest";
+import { cleanup, render, fireEvent, waitFor } from "@self/tootils/render";
+import { run_shared_prop_tests } from "@self/tootils/shared-prop-tests";
+
+import NativePlot from "./Index.svelte";
+import type { NativePlotProps } from "./types";
+
+const plot_value = {
+	columns: ["x", "y", "series"],
+	data: [
+		[1, 4, "alpha"],
+		[2, 5, "alpha"],
+		[1, 7, "beta"],
+		[2, 8, "beta"]
+	],
+	datatypes: {
+		x: "quantitative",
+		y: "quantitative",
+		series: "nominal"
+	},
+	mark: "line"
+} satisfies NativePlotProps["value"];
+
+const default_props = {
+	value: plot_value,
+	x: "x",
+	y: "y",
+	color: null,
+	title: null,
+	x_title: null,
+	y_title: null,
+	color_title: null,
+	x_bin: null,
+	y_aggregate: undefined,
+	color_map: null,
+	colors_in_legend: null,
+	x_lim: null,
+	y_lim: null,
+	x_label_angle: 0,
+	y_label_angle: 0,
+	x_axis_format: null,
+	y_axis_format: null,
+	x_axis_labels_visible: true,
+	caption: null,
+	sort: null,
+	tooltip: "axis" as const,
+	buttons: null,
+	_selectable: false,
+	label: "Native Plot",
+	show_label: false,
+	scale: null,
+	min_width: 160,
+	loading_status: undefined,
+	height: 260
+};
+
+run_shared_prop_tests({
+	component: NativePlot,
+	name: "NativePlot",
+	base_props: { ...default_props, value: null },
+	has_label: false
+});
+
+async function waitForChart(container: HTMLElement): Promise<void> {
+	await waitFor(() => {
+		expect(container.querySelector("svg")).toBeInTheDocument();
+	});
+}
+
+describe("Props: colors_in_legend", () => {
+	afterEach(() => cleanup());
+
+	test("colors_in_legend: [] hides all color legend entries", async () => {
+		const { container } = await render(NativePlot, {
+			...default_props,
+			color: "series",
+			colors_in_legend: []
+		});
+
+		await waitForChart(container);
+
+		expect(container).not.toHaveTextContent("alpha");
+		expect(container).not.toHaveTextContent("beta");
+		expect(container).not.toHaveTextContent("series");
+	});
+
+	test("colors_in_legend limits visible color legend entries", async () => {
+		const { container } = await render(NativePlot, {
+			...default_props,
+			color: "series",
+			colors_in_legend: ["alpha"]
+		});
+
+		await waitForChart(container);
+
+		expect(container).toHaveTextContent("alpha");
+		expect(container).not.toHaveTextContent("beta");
+	});
+});
+
+describe("Props: buttons", () => {
+	afterEach(() => cleanup());
+
+	test("clicking the fullscreen button toggles fullscreen mode", async () => {
+		const { container, getByLabelText } = await render(NativePlot, {
+			...default_props,
+			buttons: ["fullscreen"]
+		});
+
+		await waitForChart(container);
+
+		await fireEvent.click(getByLabelText("Fullscreen"));
+		await waitFor(() => {
+			expect(getByLabelText("Exit fullscreen mode")).toBeVisible();
+		});
+
+		await fireEvent.click(getByLabelText("Exit fullscreen mode"));
+		await waitFor(() => {
+			expect(getByLabelText("Fullscreen")).toBeVisible();
+		});
+		await waitForChart(container);
+	});
+});