61 lines
2.8 KiB
JavaScript
61 lines
2.8 KiB
JavaScript
import { render, screen } from "@testing-library/react";
|
|
import userEvent from "@testing-library/user-event";
|
|
import { beforeEach, describe, expect, test } from "vitest";
|
|
import { ExternalI18nProvider, useExternalI18n } from "./ExternalI18nProvider.jsx";
|
|
import { EXTERNAL_LOCALE_STORAGE_KEY } from "./messages.js";
|
|
|
|
describe("ExternalI18nProvider", () => {
|
|
beforeEach(() => {
|
|
localStorage.removeItem(EXTERNAL_LOCALE_STORAGE_KEY);
|
|
document.documentElement.lang = "";
|
|
document.documentElement.dir = "";
|
|
});
|
|
|
|
test("defaults to English instead of the browser locale", () => {
|
|
Object.defineProperty(navigator, "language", { configurable: true, value: "zh-CN" });
|
|
render(<ExternalI18nProvider><LocaleProbe /></ExternalI18nProvider>);
|
|
|
|
expect(screen.getByTestId("locale")).toHaveTextContent("en");
|
|
expect(screen.getByTestId("title")).toHaveTextContent("HYApp External Admin");
|
|
expect(document.documentElement).toHaveAttribute("lang", "en");
|
|
expect(document.documentElement).toHaveAttribute("dir", "ltr");
|
|
});
|
|
|
|
test("supports and persists Chinese, Arabic RTL and Turkish", async () => {
|
|
const user = userEvent.setup();
|
|
const firstRender = render(<ExternalI18nProvider><LocaleProbe /></ExternalI18nProvider>);
|
|
|
|
await user.click(screen.getByRole("button", { name: "ar" }));
|
|
expect(screen.getByTestId("title")).toHaveTextContent("إدارة HYApp الخارجية");
|
|
expect(document.documentElement).toHaveAttribute("lang", "ar");
|
|
expect(document.documentElement).toHaveAttribute("dir", "rtl");
|
|
expect(document.body).toHaveAttribute("dir", "rtl");
|
|
expect(localStorage.getItem(EXTERNAL_LOCALE_STORAGE_KEY)).toBe("ar");
|
|
|
|
await user.click(screen.getByRole("button", { name: "tr" }));
|
|
expect(screen.getByTestId("title")).toHaveTextContent("HYApp Harici Yönetim");
|
|
expect(document.documentElement).toHaveAttribute("lang", "tr");
|
|
expect(document.documentElement).toHaveAttribute("dir", "ltr");
|
|
|
|
await user.click(screen.getByRole("button", { name: "zh-CN" }));
|
|
expect(screen.getByTestId("title")).toHaveTextContent("HYApp 外管后台");
|
|
expect(localStorage.getItem(EXTERNAL_LOCALE_STORAGE_KEY)).toBe("zh-CN");
|
|
|
|
firstRender.unmount();
|
|
render(<ExternalI18nProvider><LocaleProbe /></ExternalI18nProvider>);
|
|
expect(screen.getByTestId("locale")).toHaveTextContent("zh-CN");
|
|
expect(screen.getByTestId("title")).toHaveTextContent("HYApp 外管后台");
|
|
});
|
|
});
|
|
|
|
function LocaleProbe() {
|
|
const { locale, setLocale, t } = useExternalI18n();
|
|
return (
|
|
<div>
|
|
<span data-testid="locale">{locale}</span>
|
|
<span data-testid="title">{t("app.title")}</span>
|
|
{["zh-CN", "ar", "tr"].map((value) => <button key={value} type="button" onClick={() => setLocale(value)}>{value}</button>)}
|
|
</div>
|
|
);
|
|
}
|