xtablo-source/apps/main/src/components/LanguageSelector.test.tsx
Arthur Belleville 1b402c6f3c
Add tests
2025-10-28 12:01:24 +01:00

60 lines
1.8 KiB
TypeScript

import { fireEvent, render, screen } from "@testing-library/react";
import { describe, expect, it, vi } from "vitest";
import { LanguageSelector } from "./LanguageSelector";
const mockChangeLanguage = vi.fn();
// Mock react-i18next
vi.mock("react-i18next", () => ({
useTranslation: () => ({
i18n: {
language: "en",
changeLanguage: mockChangeLanguage,
},
}),
}));
describe("LanguageSelector", () => {
beforeEach(() => {
vi.clearAllMocks();
});
it("renders without crashing", () => {
render(<LanguageSelector />);
// The SelectTrigger should be present
const trigger = screen.getByRole("combobox");
expect(trigger).toBeInTheDocument();
});
it("displays the select component", () => {
const { container } = render(<LanguageSelector />);
expect(container.querySelector('[role="combobox"]')).toBeInTheDocument();
});
it("shows current language selection", () => {
render(<LanguageSelector />);
// The trigger should show the current language code
expect(screen.getByRole("combobox")).toBeInTheDocument();
});
it("opens language options when clicked", () => {
render(<LanguageSelector />);
const trigger = screen.getByRole("combobox");
fireEvent.click(trigger);
// Language options should appear
expect(screen.getByRole("option", { name: /English/i })).toBeInTheDocument();
expect(screen.getByRole("option", { name: /Français/i })).toBeInTheDocument();
});
it("changes language when option is selected", () => {
render(<LanguageSelector />);
const trigger = screen.getByRole("combobox");
fireEvent.click(trigger);
const frenchOption = screen.getByRole("option", { name: /Français/i });
fireEvent.click(frenchOption);
expect(mockChangeLanguage).toHaveBeenCalledWith("fr");
});
});