test(button-set): add unit tests

This commit is contained in:
Eric Liu 2025-04-12 13:17:32 -07:00
commit b9de4591be
3 changed files with 36 additions and 14 deletions

View file

@ -0,0 +1,10 @@
<script lang="ts">
import { ButtonSet, Button } from "carbon-components-svelte";
export let stacked = false;
</script>
<ButtonSet data-testid="button-set" {stacked}>
<Button kind="secondary">Cancel</Button>
<Button>Submit</Button>
</ButtonSet>

View file

@ -0,0 +1,26 @@
import { render, screen } from "@testing-library/svelte";
import ButtonSet from "./ButtonSet.test.svelte";
describe("ButtonSet", () => {
it("renders buttons juxtaposed by default", () => {
render(ButtonSet);
const buttonSet = screen.getByTestId("button-set");
expect(buttonSet).toBeInTheDocument();
expect(buttonSet).toHaveClass("bx--btn-set");
});
it("renders buttons vertically when stacked prop is true", () => {
render(ButtonSet, { stacked: true });
const buttonSet = screen.getByTestId("button-set");
expect(buttonSet).toBeInTheDocument();
expect(buttonSet).toHaveClass("bx--btn-set");
expect(buttonSet).toHaveClass("bx--btn-set--stacked");
const buttons = screen.getAllByRole("button");
expect(buttons).toHaveLength(2);
expect(buttons[0]).toHaveTextContent("Cancel");
expect(buttons[1]).toHaveTextContent("Submit");
});
});