<script module lang="ts">
	import { defineMeta, type StoryContext } from "@storybook/addon-svelte-csf";
	import { expect } from "storybook/test";
	import RefChip from "./RefChip.svelte";

	type PlayContext = Pick<StoryContext<Record<string, unknown>>, "canvas">;

	const linksToTree = async ({ canvas }: PlayContext) => {
		await expect(canvas.getByText("at")).toBeVisible();
		await expect(canvas.getByRole("link", { name: "main" })).toHaveAttribute(
			"href",
			"/dawn/tangled/tree/main"
		);
	};

	const encodesRef = async ({ canvas }: PlayContext) => {
		await expect(canvas.getByRole("link", { name: "feature/split-diffs" })).toHaveAttribute(
			"href",
			"/dawn/tangled/tree/feature%2Fsplit-diffs"
		);
	};

	const { Story } = defineMeta({
		title: "Repo/RefChip",
		component: RefChip,
		tags: ["autodocs"],
		args: {
			ownerHandle: "dawn",
			repoName: "tangled",
			ref: "main"
		}
	});
</script>

<Story name="Branch" play={linksToTree} />
<Story name="Branch with slash" args={{ ref: "feature/split-diffs" }} play={encodesRef} />
