85 lines
4.0 KiB
TypeScript
85 lines
4.0 KiB
TypeScript
import fs from "node:fs";
|
|
import path from "node:path";
|
|
|
|
import { describe, expect, it } from "vitest";
|
|
|
|
const inputRoot = path.resolve(process.cwd(), "apps/web/app/components/ui/input");
|
|
|
|
function readInput(relativePath: string) {
|
|
return fs.readFileSync(path.join(inputRoot, relativePath), "utf8");
|
|
}
|
|
|
|
describe("input component i18n", () => {
|
|
it("keeps preview demo copy behind semantic translation keys", () => {
|
|
const source = readInput("PreviewInputs.tsx");
|
|
const optionPreviewSources = [
|
|
"previews/checkbox/PreviewInputCheckboxCards.tsx",
|
|
"previews/radio/PreviewInputRadioGroup.tsx",
|
|
"previews/radio/PreviewInputRadioGroupCards.tsx",
|
|
"previews/radio/PreviewInputRadioGroupWithState.tsx",
|
|
"previews/selector/PreviewInputCombobox.tsx",
|
|
"previews/selector/PreviewInputSelect.tsx",
|
|
"previews/selector/PreviewInputSelectWithState.tsx",
|
|
"previews/selector/PreviewInputSelector.tsx",
|
|
"previews/selector/PreviewInputSelectorWithState.tsx",
|
|
].map(readInput);
|
|
const titleOnlyPreviewSources = [
|
|
"previews/checkbox/PreviewInputCheckbox.tsx",
|
|
"previews/checkbox/PreviewInputCheckboxWithState.tsx",
|
|
"previews/date/PreviewInputDate.tsx",
|
|
"previews/date/PreviewInputDateWithState.tsx",
|
|
"previews/number/PreviewInputNumber.tsx",
|
|
"previews/number/PreviewInputNumberWithAllOptions.tsx",
|
|
"previews/PreviewInputText.tsx",
|
|
"previews/text/PreviewInputMultiText.tsx",
|
|
"previews/text/PreviewInputText.tsx",
|
|
"previews/text/PreviewInputTextWithAllOptions.tsx",
|
|
"previews/text/PreviewInputTextWithHintAndHelp.tsx",
|
|
].map(readInput);
|
|
|
|
expect(source).toContain("components.previewInputs.sections.text");
|
|
expect(source).toContain("components.previewInputs.examples.inputTextSimple");
|
|
expect(source).toContain("components.previewInputs.options.option1");
|
|
expect(source).not.toContain("ui.autogenerated");
|
|
expect(source).not.toContain('title="Simple"');
|
|
expect(source).not.toContain(">Hint<");
|
|
expect(source).not.toContain('help="Sample help text"');
|
|
expect(source).not.toContain('name: "Option 1"');
|
|
for (const nestedSource of optionPreviewSources) {
|
|
expect(nestedSource).toContain("components.input.preview.title");
|
|
expect(nestedSource).toContain("components.previewInputs.options.option1");
|
|
expect(nestedSource).not.toContain('title="Title"');
|
|
expect(nestedSource).not.toContain('name: "Option 1"');
|
|
}
|
|
for (const nestedSource of titleOnlyPreviewSources) {
|
|
expect(nestedSource).toContain("components.input.preview.title");
|
|
expect(nestedSource).not.toContain('title="Title"');
|
|
}
|
|
});
|
|
|
|
it("keeps rich text editor toolbar copy behind semantic translation keys", () => {
|
|
const source = readInput("InputRichTextEditor.client.tsx");
|
|
|
|
expect(source).toContain("components.richTextEditor.toolbar.bold");
|
|
expect(source).toContain("components.richTextEditor.toolbar.heading");
|
|
expect(source).toContain("components.richTextEditor.toolbar.textColor");
|
|
expect(source).toContain("components.richTextEditor.toolbar.enterUrl");
|
|
expect(source).not.toContain("ui.autogenerated");
|
|
expect(source).not.toContain("i18nT");
|
|
expect(source).not.toContain('window.prompt("Enter URL"');
|
|
expect(source).not.toContain('useState("Saved")');
|
|
expect(source).not.toContain('setSaveStatus("Saving...")');
|
|
});
|
|
|
|
it("keeps unlabeled checkboxes and toggles accessible by name", () => {
|
|
const source = readInput("InputCheckbox.tsx");
|
|
|
|
expect(source).toContain("const accessibleName = title || name || undefined");
|
|
expect(source).toContain("aria-label={accessibleName}");
|
|
// Subframe-Checkbox-Migration (upstream): die Bedingung wurde praeziser gefasst — der
|
|
// zugaengliche Name greift jetzt auch, wenn zwar withLabel gesetzt ist, aber kein title
|
|
// vorliegt (also keine sichtbare <label> rendert). a11y-Garantie bleibt erhalten.
|
|
expect(source).toContain("aria-label={!withLabel || !title ? accessibleName : undefined}");
|
|
});
|
|
});
|