Fix(unitex): Updat group checkbox label and use expect.element in tests

Author: jonathanarnault

packages/demo/src/App.spec.tsx

@@ -1,4 +1,4 @@
-import { describe, expect, it, vi } from "vitest";
+import { describe, expect, it } from "vitest";
 import { userEvent } from "vitest/browser";
 import { render } from "vitest-browser-react";
 import App from "./App";
@@ -7,11 +7,13 @@ describe("App", () => {
 	it("should render the upload button", async () => {
 		const screen = await render(<App />);
 
-		expect(
-			screen.getByRole("button", {
-				name: "Document TEI",
-			}),
-		).toBeInTheDocument();
+		await expect
+			.element(
+				screen.getByRole("button", {
+					name: "Document TEI",
+				}),
+			)
+			.toBeInTheDocument();
 	});
 
 	it("should render the XML document when a tei file is uploaded", async () => {
@@ -49,8 +51,8 @@ describe("App", () => {
 
 		await screen.getByRole("button", { name: "Lancer la visionneuse" }).click();
 
-		await vi.waitFor(() => {
-			expect(screen.getByText("TEI Test Title")).toBeInTheDocument();
-		});
+		await expect
+			.element(screen.getByText("TEI Test Title"))
+			.toBeInTheDocument();
 	});
 });

packages/demo/src/i18n/I18NProvider.spec.tsx

@@ -18,6 +18,6 @@ describe("I18NProvider", () => {
 			</I18nProvider>,
 		);
 
-		expect(screen.getByText("Viewer")).toBeDefined();
+		await expect.element(screen.getByText("Viewer")).toBeDefined();
 	});
 });

packages/demo/src/viewer/ViewerPage.spec.tsx

@@ -33,7 +33,9 @@ describe("ViewerPage", () => {
 	it("should render Viewer when document is provided and viewerLaunched is true", async () => {
 		const screen = await render(<ViewerPage />);
 
-		expect(screen.getByText("TEI Test Title")).toBeInTheDocument();
+		await expect
+			.element(screen.getByText("TEI Test Title"))
+			.toBeInTheDocument();
 	});
 
 	it("should not render Viewer when document is not provided", async () => {
@@ -45,7 +47,9 @@ describe("ViewerPage", () => {
 
 		const screen = await render(<ViewerPage />);
 
-		expect(screen.getByText("TEI Test Title")).not.toBeInTheDocument();
+		await expect
+			.element(screen.getByText("TEI Test Title"))
+			.not.toBeInTheDocument();
 	});
 
 	it("should not render Viewer when viewerLaunched is false", async () => {
@@ -68,6 +72,8 @@ describe("ViewerPage", () => {
 
 		const screen = await render(<ViewerPage />);
 
-		expect(screen.getByText("TEI Test Title")).not.toBeInTheDocument();
+		await expect
+			.element(screen.getByText("TEI Test Title"))
+			.not.toBeInTheDocument();
 	});
 });

packages/react-tei/src/DocumentTitle.spec.tsx

@@ -111,6 +111,6 @@ describe("DocumentTitle", () => {
 			),
 		});
 
-		expect(screen.container).toBeEmptyDOMElement();
+		await expect.element(screen.container).toBeEmptyDOMElement();
 	});
 });

packages/react-tei/src/SidePanel/enrichmentTerm/EnrichmentTermAnnotationBlocks.tsx

@@ -23,9 +23,6 @@ export function EnrichmentTermAnnotationBlock({
 		useListEnrichmentTermAnnotationByBlockType(block);
 
 	const toggleContext = displayStatus === "all" ? "hide" : "show";
-	const sectionlabel = t(`termEnrichment.${block}`, {
-		count: annotations.length,
-	});
 	const checkboxLabel = t("termEnrichment.toggleBlock", {
 		context: toggleContext,
 	});
@@ -47,7 +44,7 @@ export function EnrichmentTermAnnotationBlock({
 				}}
 			>
 				<FormControlLabel
-					label={sectionlabel}
+					label={t("termEnrichment.underlineWordsInText")}
 					control={
 						<Tooltip title={checkboxLabel} placement="left">
 							<Checkbox

packages/react-tei/src/Viewer.spec.tsx

@@ -53,8 +53,12 @@ describe("Viewer", () => {
 			screen.getByRole("heading", { level: 3, name: "Section 1" }),
 		).toBeInTheDocument();
 
-		expect(screen.getByText("This is a test document.")).toBeInTheDocument();
-		expect(screen.getByText("Content of section 1.")).toBeInTheDocument();
+		await expect
+			.element(screen.getByText("This is a test document."))
+			.toBeInTheDocument();
+		await expect
+			.element(screen.getByText("Content of section 1."))
+			.toBeInTheDocument();
 	});
 
 	it("should render a table", async () => {
@@ -98,10 +102,10 @@ describe("Viewer", () => {
 			}),
 		).toBeVisible();
 
-		expect(screen.getByRole("caption")).toBeVisible();
-		expect(screen.getByRole("caption")).toHaveTextContent(
-			"Table 1 Sample Table",
-		);
+		await expect.element(screen.getByRole("caption")).toBeVisible();
+		await expect
+			.element(screen.getByRole("caption"))
+			.toHaveTextContent("Table 1 Sample Table");
 
 		expect(
 			screen.getByRole("columnheader", { name: "Header 1" }),
@@ -110,8 +114,12 @@ describe("Viewer", () => {
 			screen.getByRole("columnheader", { name: "Header 2" }),
 		).toBeVisible();
 
-		expect(screen.getByRole("cell", { name: "Data 1" })).toBeVisible();
-		expect(screen.getByRole("cell", { name: "Data 2" })).toBeVisible();
+		await expect
+			.element(screen.getByRole("cell", { name: "Data 1" }))
+			.toBeVisible();
+		await expect
+			.element(screen.getByRole("cell", { name: "Data 2" }))
+			.toBeVisible();
 		expect(
 			screen.getByRole("note").filter({
 				hasText: "This is a table note.",

packages/react-tei/src/abstract/MultilingualAbstract.spec.tsx

@@ -228,7 +228,7 @@ describe("MultilingualAbstract", () => {
 			wrapper: I18nProvider,
 		});
 
-		expect(screen.getByRole("region")).not.toBeInTheDocument();
+		await expect.element(screen.getByRole("region")).not.toBeInTheDocument();
 	});
 
 	it("should not render anything if no language attribute is present", async () => {

packages/react-tei/src/i18n/I18NProvider.spec.tsx

@@ -18,6 +18,6 @@ describe("I18NProvider", () => {
 			</I18nProvider>,
 		);
 
-		expect(screen.getByText("Résumé")).toBeDefined();
+		await expect.element(screen.getByText("Résumé")).toBeDefined();
 	});
 });

packages/react-tei/src/tags/DateTag.spec.tsx

@@ -65,6 +65,6 @@ describe("DateTag", () => {
 				</TagCatalogProvider>
 			),
 		});
-		expect(screen.container).toBeEmptyDOMElement();
+		await expect.element(screen.container).toBeEmptyDOMElement();
 	});
 });

packages/react-tei/src/tags/Head.spec.tsx

@@ -102,6 +102,6 @@ describe("Head", () => {
 				</TagCatalogProvider>
 			),
 		});
-		expect(screen.container).toBeEmptyDOMElement();
+		await expect.element(screen.container).toBeEmptyDOMElement();
 	});
 });