Update npm dependencies (#3179)

docs/user_guide/docs/dataEntry.es.md

@@ -56,9 +56,9 @@ mantén pulsado en una pantalla táctil).
 ## Nueva entrada con forma vernácula duplicada {#new-entry-with-duplicate-vernacular-form}
 
 Si presenta una nueva entrada con idéntica forma vernácula y glosa a una entrada existente, se actualizará dicha entrada
-en lugar de crearse una nueva entrada. Por ejemplo, si presenta [Vernáculo: finger; Glosa: dedo] en el dominio 2.1.3.1
-(Brazo) y de nuevo en el dominio 2.1.3.3 (Dedo, dedo del pie), el resultado será una única entrada para "finger" con un
-única acepción que tiene glosa "dedo" y dos dominios.
+en lugar de crearse una nueva entrada. Por ejemplo, si presenta [Vernáculo: finger; Glosa: dedo] en el dominio 2.1.3.1 (Brazo)
+y de nuevo en el dominio 2.1.3.3 (Dedo, dedo del pie), el resultado será una única entrada para "finger" con un única acepción
+que tiene glosa "dedo" y dos dominios.
 
 The Combine dispone de una función opcional de facilitar la introducción de palabras que ya existen en el proyecto pero
 que se recogen de nuevo en nuevo dominio semántico. Esta función puede activarse o desactivarse en

docs/user_guide/docs/dataEntry.md

@@ -54,8 +54,8 @@ recording's speaker, right click the green triangle (or press-and-hold on a touc
 
 If you submit a new entry with identical vernacular form and gloss to an existing entry, that entry will be updated
 instead of a new entry created. For example, if you submit [Vernacular: dedo; Gloss: finger] in domain 2.1.3.1 (Arm) and
-again in domain 2.1.3.3 (Finger, Toe), the result will be a single entry for "dedo" with a single sense that has gloss
-"finger" and two domains.
+again in domain 2.1.3.3 (Finger, Toe), the result will be a single entry for "dedo" with a single sense that has gloss "finger"
+and two domains.
 
 The Combine has an optional feature to facilitate entry of words that already exist in the project but which are
 collected again in a new semantic domain. This feature can be turned on or off in

docs/user_guide/docs/dataEntry.zh.md

@@ -47,8 +47,8 @@ recording's speaker, right click the green triangle (or press-and-hold on a touc
 ## 含重复土语形式的新词条 {#new-entry-with-duplicate-vernacular-form}
 
 如果用户提交的新词条与土语现有的词条有相同的形式和注释，该词条将被更新，不会创建一个新词条。 举例说明：如果用户在域值
-2.1.3.1(手臂) 提交了[土语: dedo; 注释: 手指] 后，又在域值2.1.3.3(手指，脚趾) 提交，结果 “dedo”这词条、含注释为“手指” 单
-个词义及有两个域值。
+2.1.3.1(手臂) 提交了[土语: dedo; 注释: 手指] 后，又在域值2.1.3.3(手指，脚趾) 提交，结果 “dedo”这词条、含注释为“手指” 单个
+词义及有两个域值。
 
 The Combine 有一个可选功能，便于输入项目中已经存在的词条，但 这词条在新语义域中再次被收集。 该功能可以在
 [项目设置 > 自动完成](project.md#autocomplete)打开和关闭。 当该功能打开后，用户在数据输入中键入土语时，就会出现一条下拉

src/components/Buttons/LoadingDoneButton.tsx

@@ -6,8 +6,8 @@ import { useTranslation } from "react-i18next";
 
 import { themeColors } from "types/theme";
 
-interface LoadingDoneProps {
-  buttonProps?: ButtonProps;
+interface LoadingDoneButtonProps {
+  buttonProps?: ButtonProps & { "data-testid"?: string };
   children?: ReactNode;
   disabled?: boolean;
   done?: boolean;
@@ -19,7 +19,7 @@ interface LoadingDoneProps {
  * A button that shows a spinning wheel when loading and "done" when done
  */
 export default function LoadingDoneButton(
-  props: LoadingDoneProps
+  props: LoadingDoneButtonProps
 ): ReactElement {
   const { t } = useTranslation();
 

src/components/DataEntry/DataEntryTable/EntryCellComponents/tests/GlossWithSuggestions.test.tsx

@@ -11,6 +11,7 @@ jest.mock("@mui/base/node/useAutocomplete/useAutocomplete", () => ({
     getInputProps: () => ({ onMouseDown: jest.fn() }),
     getListboxProps: () => ({ ref: {} }),
     getRootProps: jest.fn(),
+    groupedOptions: [],
   }),
 }));
 

src/components/DataEntry/DataEntryTable/EntryCellComponents/tests/VernWithSuggestions.test.tsx

@@ -11,6 +11,7 @@ jest.mock("@mui/base/node/useAutocomplete/useAutocomplete", () => ({
     getInputProps: () => ({ onMouseDown: jest.fn() }),
     getListboxProps: () => ({ ref: {} }),
     getRootProps: jest.fn(),
+    groupedOptions: [],
   }),
 }));
 

src/components/GoalTimeline/tests/GoalRedux.test.tsx

@@ -1,5 +1,6 @@
 import "@testing-library/jest-dom";
-import { act, cleanup } from "@testing-library/react";
+import { cleanup } from "@testing-library/react";
+import { act } from "react";
 
 import { Edit, MergeUndoIds, Permission, User, UserEdit } from "api/models";
 import * as LocalStorage from "backend/localStorage";

src/components/PasswordReset/Request.tsx

@@ -84,6 +84,7 @@ export default function ResetRequest(): ReactElement {
                 <LoadingDoneButton
                   buttonProps={{
                     color: "primary",
+                    "data-testid": PasswordRequestIds.ButtonSubmit,
                     id: PasswordRequestIds.ButtonSubmit,
                     onClick: () => onSubmit,
                     variant: "contained",

src/components/PasswordReset/tests/Request.test.tsx

@@ -1,7 +1,9 @@
 import "@testing-library/jest-dom";
-import { act, cleanup, render, screen } from "@testing-library/react";
+import { cleanup, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { act } from "react";
 
+import MockBypassLoadableButton from "components/Buttons/LoadingDoneButton";
 import ResetRequest, {
   PasswordRequestIds,
 } from "components/PasswordReset/Request";
@@ -13,6 +15,9 @@ jest.mock("react-router-dom", () => ({
 jest.mock("backend", () => ({
   resetPasswordRequest: (...args: any[]) => mockResetPasswordRequest(...args),
 }));
+jest.mock("components/Buttons", () => ({
+  LoadingDoneButton: MockBypassLoadableButton,
+}));
 
 const mockResetPasswordRequest = jest.fn();
 
@@ -45,7 +50,9 @@ describe("ResetRequest", () => {
 
     // Agent
     const field = screen.getByTestId(PasswordRequestIds.FieldEmailOrUsername);
-    await agent.type(field, "a");
+    await act(async () => {
+      await agent.type(field, "a");
+    });
 
     // After
     expect(button).toBeEnabled();
@@ -57,18 +64,26 @@ describe("ResetRequest", () => {
     await renderUserSettings();
 
     // Before
-    expect(screen.queryAllByRole("textbox")).toHaveLength(1);
-    expect(screen.queryAllByRole("button")).toHaveLength(1);
+    expect(
+      screen.queryByTestId(PasswordRequestIds.FieldEmailOrUsername)
+    ).toBeTruthy();
+    expect(screen.queryByTestId(PasswordRequestIds.ButtonSubmit)).toBeTruthy();
     expect(screen.queryByTestId(PasswordRequestIds.ButtonLogin)).toBeNull();
 
     // Agent
     const field = screen.getByTestId(PasswordRequestIds.FieldEmailOrUsername);
-    await agent.type(field, "a");
-    await agent.click(screen.getByRole("button"));
+    await act(async () => {
+      await agent.type(field, "a");
+    });
+    await act(async () => {
+      await agent.click(screen.getByRole("button"));
+    });
 
     // After
-    expect(screen.queryAllByRole("textbox")).toHaveLength(0);
-    expect(screen.queryAllByRole("button")).toHaveLength(1);
+    expect(
+      screen.queryByTestId(PasswordRequestIds.FieldEmailOrUsername)
+    ).toBeNull();
+    expect(screen.queryByTestId(PasswordRequestIds.ButtonSubmit)).toBeNull();
     expect(screen.queryByTestId(PasswordRequestIds.ButtonLogin)).toBeTruthy();
   });
 });

src/components/PasswordReset/tests/ResetPage.test.tsx

@@ -1,13 +1,12 @@
 import "@testing-library/jest-dom";
 import {
   type RenderOptions,
-  act,
   cleanup,
   render,
   screen,
 } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { type ReactElement, type ReactNode } from "react";
+import { type ReactElement, type ReactNode, act } from "react";
 import { Provider } from "react-redux";
 import { MemoryRouter, Route, Routes } from "react-router-dom";
 import configureMockStore from "redux-mock-store";
@@ -75,8 +74,10 @@ describe("PasswordReset", () => {
       PasswordResetTestIds.ConfirmPassword
     );
 
-    await user.type(passwdField, shortPassword);
-    await user.type(passwdConfirm, shortPassword);
+    await act(async () => {
+      await user.type(passwdField, shortPassword);
+      await user.type(passwdConfirm, shortPassword);
+    });
 
     const reqErrors = screen.queryAllByTestId(
       PasswordResetTestIds.PasswordReqError
@@ -102,8 +103,10 @@ describe("PasswordReset", () => {
       PasswordResetTestIds.ConfirmPassword
     );
 
-    await user.type(passwdField, passwordEntry);
-    await user.type(passwdConfirm, confirmEntry);
+    await act(async () => {
+      await user.type(passwdField, passwordEntry);
+      await user.type(passwdConfirm, confirmEntry);
+    });
 
     const reqErrors = screen.queryAllByTestId(
       PasswordResetTestIds.PasswordReqError
@@ -129,8 +132,10 @@ describe("PasswordReset", () => {
       PasswordResetTestIds.ConfirmPassword
     );
 
-    await user.type(passwdField, passwordEntry);
-    await user.type(passwdConfirm, confirmEntry);
+    await act(async () => {
+      await user.type(passwdField, passwordEntry);
+      await user.type(passwdConfirm, confirmEntry);
+    });
 
     const reqErrors = screen.queryAllByTestId(
       PasswordResetTestIds.PasswordReqError
@@ -157,12 +162,16 @@ describe("PasswordReset", () => {
       PasswordResetTestIds.ConfirmPassword
     );
 
-    await user.type(passwdField, passwordEntry);
-    await user.type(passwdConfirm, confirmEntry);
+    await act(async () => {
+      await user.type(passwdField, passwordEntry);
+      await user.type(passwdConfirm, confirmEntry);
+    });
 
     const submitButton = screen.getByTestId(PasswordResetTestIds.SubmitButton);
     mockPasswordReset.mockResolvedValueOnce(false);
-    await user.click(submitButton);
+    await act(async () => {
+      await user.click(submitButton);
+    });
 
     const resetErrors = screen.queryAllByTestId(
       PasswordResetTestIds.PasswordResetFail

src/components/ProjectSettings/tests/index.test.tsx

@@ -1,9 +1,10 @@
 import { LocalizationProvider } from "@mui/x-date-pickers";
 import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
 import "@testing-library/jest-dom";
-import { act, cleanup, render, screen } from "@testing-library/react";
+import { cleanup, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { match } from "css-mediaquery";
+import { act } from "react";
 import { Provider } from "react-redux";
 import { Store } from "redux";
 import configureMockStore from "redux-mock-store";
@@ -127,7 +128,9 @@ describe("ProjectSettings", () => {
     const tabs = Object.values(ProjectSettingsTab);
     expect(screen.queryAllByRole("tab")).toHaveLength(tabs.length);
     for (const tab of tabs) {
-      await agent.click(screen.getByTestId(tab));
+      await act(async () => {
+        await agent.click(screen.getByTestId(tab));
+      });
       isPanelVisible(tab);
     }
   });
@@ -142,7 +145,9 @@ describe("ProjectSettings", () => {
         const tabs = whichTabs(perm, hasSchedule);
         expect(screen.queryAllByRole("tab")).toHaveLength(tabs.length);
         for (const tab of tabs) {
-          await agent.click(screen.getByTestId(tab));
+          await act(async () => {
+            await agent.click(screen.getByTestId(tab));
+          });
           whichSettings(perm, hasSchedule, tab).forEach((s) =>
             screen.getByTestId(s)
           );
@@ -161,7 +166,9 @@ describe("ProjectSettings", () => {
         const tabs = whichTabs(perm, hasSchedule);
         expect(screen.queryAllByRole("tab")).toHaveLength(tabs.length);
         for (const tab of tabs) {
-          await agent.click(screen.getByTestId(tab));
+          await act(async () => {
+            await agent.click(screen.getByTestId(tab));
+          });
           whichSettings(perm, hasSchedule, tab).forEach((s) =>
             screen.getByTestId(s)
           );

src/components/ProjectUsers/tests/SpeakerConsentListItemIcon.test.tsx

@@ -1,8 +1,8 @@
 import { PlayArrow } from "@mui/icons-material";
 import "@testing-library/jest-dom";
-import { act, cleanup, render, screen } from "@testing-library/react";
+import { cleanup, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { ReactElement } from "react";
+import { ReactElement, act } from "react";
 
 import { ConsentType, Speaker } from "api/models";
 import SpeakerConsentListItemIcon, {
@@ -79,7 +79,9 @@ describe("SpeakerConsentListItemIcon", () => {
       expect(screen.queryByTestId(ListItemIconId.RecordAudio)).toBeNull();
       expect(screen.queryByTestId(ListItemIconId.UploadAudio)).toBeNull();
 
-      await agent.click(screen.getByRole("button"));
+      await act(async () => {
+        await agent.click(screen.getByRole("button"));
+      });
       expect(screen.queryByRole("menu")).not.toBeNull();
       expect(screen.queryByTestId(ListItemIconId.RecordAudio)).not.toBeNull();
       expect(screen.queryByTestId(ListItemIconId.UploadAudio)).not.toBeNull();
@@ -117,7 +119,9 @@ describe("SpeakerConsentListItemIcon", () => {
       });
       expect(screen.queryByRole("dialog")).toBeNull();
 
-      await agent.click(screen.getByRole("button"));
+      await act(async () => {
+        await agent.click(screen.getByRole("button"));
+      });
       expect(screen.queryByRole("dialog")).not.toBeNull();
     });
   });

src/components/SiteSettings/tests/index.test.tsx

@@ -1,6 +1,7 @@
 import "@testing-library/jest-dom";
-import { act, cleanup, render, screen } from "@testing-library/react";
+import { cleanup, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { act } from "react";
 
 import SiteSettings, { SiteSettingsTab } from "components/SiteSettings";
 
@@ -52,15 +53,21 @@ describe("SiteSettings", () => {
     await renderSiteSettings();
 
     // Banners tab
-    await agent.click(screen.getByTestId(SiteSettingsTab.Banners));
+    await act(async () => {
+      await agent.click(screen.getByTestId(SiteSettingsTab.Banners));
+    });
     isPanelVisible(SiteSettingsTab.Banners);
 
     // Projects tab
-    await agent.click(screen.getByTestId(SiteSettingsTab.Projects));
+    await act(async () => {
+      await agent.click(screen.getByTestId(SiteSettingsTab.Projects));
+    });
     isPanelVisible(SiteSettingsTab.Projects);
 
     // Users tab
-    await agent.click(screen.getByTestId(SiteSettingsTab.Users));
+    await act(async () => {
+      await agent.click(screen.getByTestId(SiteSettingsTab.Users));
+    });
     isPanelVisible(SiteSettingsTab.Users);
   });
 });

src/components/TreeView/TreeDepiction/tests/__snapshots__/DomainTileButton.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`DomainTileButton renders tile and matches the latest snapshot 1`] = `
 <button
-  className="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeMedium MuiButton-outlinedSizeMedium css-1rwt2y5-MuiButtonBase-root-MuiButton-root"
+  className="MuiButtonBase-root MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-outlined MuiButton-outlinedPrimary MuiButton-sizeMedium MuiButton-outlinedSizeMedium MuiButton-colorPrimary css-1rwt2y5-MuiButtonBase-root-MuiButton-root"
   disabled={false}
   id="1"
   onBlur={[Function]}