BlueSky & more on desktop
lazurite.stormlightlabs.org/
tauri
rust
typescript
bluesky
appview
atproto
solid
1import { MemoryRouter, Route } from "@solidjs/router";
2import { render, screen } from "@solidjs/testing-library";
3import { describe, expect, it } from "vitest";
4import { RailButton } from "../AppRailButton";
5
6function renderInRouter(ui: () => ReturnType<typeof RailButton>) {
7 return render(() => (
8 <MemoryRouter root={ui}>
9 <Route path="*" component={() => null} />
10 </MemoryRouter>
11 ));
12}
13
14describe("RailButton", () => {
15 it("shows label text when not compact", () => {
16 renderInRouter(() => <RailButton href="/auth" label="Accounts" icon="profile" />);
17
18 expect(screen.getByText("Accounts")).toBeInTheDocument();
19 });
20
21 it("hides label text when compact", () => {
22 renderInRouter(() => <RailButton href="/auth" label="Accounts" icon="profile" compact />);
23
24 const label = screen.getByText("Accounts");
25 expect(label).toHaveClass("max-w-0");
26 expect(label).toHaveClass("opacity-0");
27 expect(label).toHaveAttribute("aria-hidden", "true");
28 });
29
30 it("uses rounded-lg (not rounded-full) for reduced rounding", () => {
31 renderInRouter(() => <RailButton href="/auth" label="Accounts" icon="profile" />);
32
33 const link = screen.getByRole("link");
34 expect(link.className).toContain("rounded-lg");
35 expect(link.className).not.toContain("rounded-full");
36 });
37
38 it("renders an unread badge when the count is positive", () => {
39 renderInRouter(() => <RailButton badge={3} href="/notifications" label="Notifications" icon="notifications" />);
40
41 expect(screen.getByRole("status", { name: "3 unread" })).toBeInTheDocument();
42 });
43});