2ab34bc11a
- Add logo.svg image element to Header component before the h1 title - Add header-logo CSS class with sizing and flex-shrink styles - Update header-left alignment from baseline to center - Add Header component tests covering logo rendering and position
29 lines
1000 B
TypeScript
29 lines
1000 B
TypeScript
import { describe, it, expect, vi } from "vitest";
|
|
import { render, screen } from "@testing-library/react";
|
|
import { Header } from "../Header";
|
|
|
|
describe("Header", () => {
|
|
it("renders a logo image with correct src and alt", () => {
|
|
render(<Header />);
|
|
const logo = screen.getByAltText("hai logo");
|
|
expect(logo).toBeDefined();
|
|
expect(logo.tagName).toBe("IMG");
|
|
expect((logo as HTMLImageElement).src).toContain("/logo.svg");
|
|
});
|
|
|
|
it("renders the logo before the h1 element", () => {
|
|
render(<Header />);
|
|
const logo = screen.getByAltText("hai logo");
|
|
const h1 = screen.getByRole("heading", { level: 1 });
|
|
// Logo should be a preceding sibling of the h1
|
|
expect(logo.compareDocumentPosition(h1) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
|
|
});
|
|
|
|
it("renders the settings button", () => {
|
|
const onOpen = vi.fn();
|
|
render(<Header onOpenSettings={onOpen} />);
|
|
const btn = screen.getByTitle("Settings");
|
|
expect(btn).toBeDefined();
|
|
});
|
|
});
|