Files
kandev/apps/web/components/gitlab/my-gitlab/row-title-link.test.tsx
T

30 lines
1.2 KiB
TypeScript

import { cleanup, render, screen } from "@testing-library/react";
import { afterEach, describe, expect, it } from "vitest";
import { RowTitleLink } from "./row-title-link";
const longTitle =
"§7 item 4 (km-product#27) — EntityLocker is not the REQ-011 FR-8 answer lock (no change proposed; recording the distinction)";
afterEach(cleanup);
describe("RowTitleLink", () => {
it("keeps a long title inside its column instead of overlapping row actions", () => {
render(<RowTitleLink href="https://gitlab.example.com/x/-/issues/3" title={longTitle} />);
const link = screen.getByRole("link");
// Block-level flex: an inline-flex link sizes to content and overflows the row.
expect(link.className).toContain("flex");
expect(link.className).not.toContain("inline-flex");
expect(link.className).toContain("min-w-0");
const text = screen.getByText(longTitle);
expect(text.className).toContain("truncate");
});
it("exposes the full title on hover since the text may be clipped", () => {
render(<RowTitleLink href="https://gitlab.example.com/x/-/issues/3" title={longTitle} />);
expect(screen.getByRole("link").getAttribute("title")).toBe(longTitle);
});
});