diff --git a/src/components/AccountCard.test.tsx b/src/components/AccountCard.test.tsx index e3e30f4..d922991 100644 --- a/src/components/AccountCard.test.tsx +++ b/src/components/AccountCard.test.tsx @@ -45,6 +45,51 @@ describe("AccountCard", () => { expect(screen.getByText("2")).toBeInTheDocument(); }); + it("shows a Sequence Number label with an explanatory tooltip", () => { + vi.mocked(useSorokit).mockReturnValue({ + address: "GABC", + account: { sequence: "123456", subentryCount: 2 }, + isLoadingAccount: false, + } as unknown as ReturnType); + + render(); + const label = screen.getByText("Sequence Number"); + expect(label).toBeInTheDocument(); + expect(label).toHaveAttribute( + "title", + "Used to prevent duplicate transactions" + ); + }); + + it("shows the XLM reserve impact for subentries", () => { + vi.mocked(useSorokit).mockReturnValue({ + address: "GABC", + account: { sequence: "123456", subentryCount: 2 }, + isLoadingAccount: false, + } as unknown as ReturnType); + + render(); + expect( + screen.getByText("Subentries: 2 (+1 XLM reserved)") + ).toBeInTheDocument(); + }); + + it("associates the content region with the card heading via aria-labelledby", () => { + vi.mocked(useSorokit).mockReturnValue({ + address: "GABC", + account: { sequence: "123456", subentryCount: 2 }, + isLoadingAccount: false, + } as unknown as ReturnType); + + const { container } = render(); + const heading = container.querySelector("#account-card-heading"); + const region = container.querySelector( + '[aria-labelledby="account-card-heading"]' + ); + expect(heading).toBeInTheDocument(); + expect(region).toBeInTheDocument(); + }); + it("returns null when no address is present", () => { vi.mocked(useSorokit).mockReturnValue({ address: null, diff --git a/src/components/AccountCard.tsx b/src/components/AccountCard.tsx index 74e5da3..c0a1067 100644 --- a/src/components/AccountCard.tsx +++ b/src/components/AccountCard.tsx @@ -12,7 +12,7 @@ export function AccountCard() {
-

Account

+

Account

Stellar account details

@@ -27,7 +27,7 @@ export function AccountCard() { ) )}
-
+
{isLoadingAccount ? (
@@ -43,11 +43,21 @@ export function AccountCard() { {account.sequence} + + Sequence Number + {account.subentryCount} + + Subentries: {account.subentryCount} (+ + {Number(account.subentryCount) * 0.5} XLM reserved) +
)} diff --git a/vitest.config.ts b/vitest.config.ts new file mode 100644 index 0000000..8af4e9f --- /dev/null +++ b/vitest.config.ts @@ -0,0 +1,17 @@ +import { defineConfig } from "vitest/config"; +import react from "@vitejs/plugin-react"; +import path from "path"; + +export default defineConfig({ + plugins: [react()], + test: { + globals: true, + environment: "jsdom", + setupFiles: ["./src/setupTests.ts"], + }, + resolve: { + alias: { + "@": path.resolve(__dirname, "./src"), + }, + }, +});