Every locale formatter takes the language as an argument. Under the React
Compiler a formatter that read the i18n singleton was memoized on its other
arguments, so a card kept "2 hr 4 min" after a switch to Hungarian; plexLang()
had the same flaw and left Plex queries in the old language. Components now
take the language from useTranslation, and the signature makes forgetting it
a type error.
- ratings, file sizes, stream stats: the language's decimal mark ("8,3")
- view and subscriber counts compact in the language ("1,2 E")
- seconds as the language's unit ("6 mp") in the sliders and the stats
- a person's birth and death dates as dates, not ISO strings
- A-Z lists by the shown name in the language's alphabet (compareText),
the tag catalog re-sorted by its translated names
- lint local/locale-format (was date-format) also refuses Intl.NumberFormat
outside lib/format.ts, localeCompare, and a component reading the language
off the i18n singleton
36 lines
1.2 KiB
TypeScript
36 lines
1.2 KiB
TypeScript
// @vitest-environment jsdom
|
|
//
|
|
// E30 S3: a card's numbers follow a language switch. The formatters read the UI language, but the
|
|
// React Compiler memoizes a call on its ARGUMENTS — `formatRuntime(card.duration_seconds)` stayed
|
|
// "2 hr 4 min" after switching to Hungarian while the hero beside it said "2 ó 16 p". Real catalog.
|
|
import { describe, it, expect, afterEach, vi } from "vitest";
|
|
import { render, screen, cleanup, act } from "@testing-library/react";
|
|
import { setLanguage } from "../i18n";
|
|
import { PlexPosterCard } from "./plexCards";
|
|
import type { PlexCard } from "../lib/api";
|
|
|
|
afterEach(() => {
|
|
cleanup();
|
|
setLanguage("en");
|
|
});
|
|
|
|
const movie: PlexCard = {
|
|
id: "m1",
|
|
type: "movie",
|
|
title: "Heat",
|
|
thumb: "/api/plex/image/m1",
|
|
duration_seconds: 2 * 3600 + 4 * 60,
|
|
rating: 8.3,
|
|
};
|
|
|
|
describe("a card after a language switch", () => {
|
|
it("says its runtime and rating in the new language", () => {
|
|
setLanguage("en");
|
|
render(<PlexPosterCard card={movie} onOpen={vi.fn()} />);
|
|
expect(screen.getByText("2 hr 4 min")).toBeTruthy();
|
|
act(() => setLanguage("hu"));
|
|
expect(screen.getByText("2 ó 4 p")).toBeTruthy();
|
|
expect(screen.getByText("8,3")).toBeTruthy();
|
|
});
|
|
});
|