eduvia/workavia-calendar-front
11
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[#82] added cozy-ui for internationnalisation (#267)

Browse Source 
Co-authored-by: Camille Moussu <cmoussu@linagora.com>
This commit is contained in:
Camille Moussu
2025-11-06 15:46:58 +01:00
committed by GitHub
parent c1f37e3ebd
commit 36bc027d6d
49 changed files with 12003 additions and 5002 deletions
Download Patch File Download Diff File Expand all files Collapse all files
__test__/components/Calendar.test.tsx
+33 -31
View File
@@ -1,10 +1,10 @@
import { fireEvent, screen, waitFor } from "@testing-library/react";
import { act, fireEvent, screen, waitFor } from "@testing-library/react";
import CalendarApp from "../../src/components/Calendar/Calendar";
import * as eventThunks from "../../src/features/Calendars/CalendarSlice";
import { renderWithProviders } from "../utils/Renderwithproviders";
import { searchUsers } from "../../src/features/User/userAPI";
import * as calendarThunks from "../../src/features/Calendars/CalendarSlice";
import { act, useRef } from "react";
import { useRef } from "react";
import userEvent from "@testing-library/user-event";
import CalendarLayout from "../../src/components/Calendar/CalendarLayout";
@@ -41,7 +41,7 @@ describe("CalendarSelection", () => {
calendars: {
list: {
"user1/cal1": {
name: "Calendar personnal",
name: "Calendar personal",
id: "user1/cal1",
color: { light: "#FF0000", dark: "#000" },
ownerEmails: ["alice@example.com"],
@@ -146,11 +146,11 @@ describe("CalendarSelection", () => {
preloadedState
);
});
expect(screen.getByText("Personnal Calendars")).toBeInTheDocument();
expect(screen.getByText("Delegated Calendars")).toBeInTheDocument();
expect(screen.getByText("Other Calendars")).toBeInTheDocument();
expect(screen.getByText("calendar.personal")).toBeInTheDocument();
expect(screen.getByText("calendar.delegated")).toBeInTheDocument();
expect(screen.getByText("calendar.other")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar personnal")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar personal")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar delegated")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar shared")).toBeInTheDocument();
});
@@ -162,16 +162,16 @@ describe("CalendarSelection", () => {
preloadedState
);
});
expect(screen.getByText("Personnal Calendars")).toBeInTheDocument();
expect(screen.getByText("Delegated Calendars")).toBeInTheDocument();
expect(screen.getByText("Other Calendars")).toBeInTheDocument();
expect(screen.getByText("calendar.personal")).toBeInTheDocument();
expect(screen.getByText("calendar.delegated")).toBeInTheDocument();
expect(screen.getByText("calendar.other")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar personnal")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar personal")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar delegated")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar shared")).toBeInTheDocument();
const sharedAccordionSummary = screen
.getByText("Other Calendars")
.getByText("calendar.other")
.closest(".MuiAccordionSummary-root");
const addButton = screen.getAllByTestId("AddIcon")[2];
@@ -185,12 +185,12 @@ describe("CalendarSelection", () => {
});
expect(sharedAccordionSummary).toHaveAttribute("aria-expanded", "true");
});
it("BUGFIX: remove dots in mini calendar when unselecting personnal calendar", async () => {
it("BUGFIX: remove dots in mini calendar when unselecting personal calendar", async () => {
await act(async () =>
renderWithProviders(<CalendarLayout />, preloadedState)
);
const checkbox = screen.getByLabelText("Calendar personnal");
const checkbox = screen.getByLabelText("Calendar personal");
// checkbox checked : events shown
expect(
screen.getByTestId(
@@ -223,9 +223,9 @@ describe("CalendarSelection", () => {
renderWithProviders(<CalendarLayout />, preloadedState)
);
// hide personnal event first
// hide personal event first
await act(async () => {
fireEvent.click(screen.getByLabelText("Calendar personnal"));
fireEvent.click(screen.getByLabelText("Calendar personal"));
});
const checkbox = screen.getByLabelText("Calendar delegated");
@@ -250,9 +250,9 @@ describe("CalendarSelection", () => {
renderWithProviders(<CalendarLayout />, preloadedState)
);
// hide personnal event first
// hide personal event first
await act(async () => {
fireEvent.click(screen.getByLabelText("Calendar personnal"));
fireEvent.click(screen.getByLabelText("Calendar personal"));
});
const checkbox = screen.getByLabelText("Calendar shared");
@@ -286,7 +286,7 @@ describe("CalendarSelection", () => {
);
});
expect(screen.getByLabelText("Calendar personnal")).toBeChecked();
expect(screen.getByLabelText("Calendar personal")).toBeChecked();
expect(screen.getByLabelText("Calendar delegated")).toBeChecked();
expect(screen.getByLabelText("Calendar shared")).toBeChecked();
});
@@ -299,12 +299,12 @@ describe("CalendarSelection", () => {
);
});
expect(screen.getByLabelText("Calendar personnal")).toBeChecked();
expect(screen.getByLabelText("Calendar personal")).toBeChecked();
expect(screen.getByLabelText("Calendar delegated")).not.toBeChecked();
expect(screen.getByLabelText("Calendar shared")).not.toBeChecked();
await act(async () => {
fireEvent.click(screen.getByLabelText("Calendar personnal"));
fireEvent.click(screen.getByLabelText("Calendar personal"));
fireEvent.click(screen.getByLabelText("Calendar shared"));
});
@@ -333,7 +333,7 @@ describe("calendar Availability search", () => {
calendars: {
list: {
"user1/cal1": {
name: "Calendar personnal",
name: "Calendar personal",
id: "user1/cal1",
color: { light: "#FF0000", dark: "#000" },
ownerEmails: ["alice@example.com"],
@@ -364,7 +364,7 @@ describe("calendar Availability search", () => {
renderWithProviders(<CalendarTestWrapper />, preloadedState)
);
const input = screen.getByPlaceholderText(/start typing a name or email/i);
const input = screen.getByPlaceholderText("peopleSearch.placeholder");
act(() => {
userEvent.type(input, "New");
});
@@ -394,7 +394,7 @@ describe("calendar Availability search", () => {
renderWithProviders(<CalendarTestWrapper />, preloadedState)
);
const input = screen.getByPlaceholderText(/start typing a name or email/i);
const input = screen.getByPlaceholderText("peopleSearch.placeholder");
await act(async () => userEvent.type(input, "Alice"));
const option = await screen.findByText("Alice");
@@ -423,7 +423,7 @@ describe("calendar Availability search", () => {
renderWithProviders(<CalendarTestWrapper />, preloadedState)
);
const input = screen.getByPlaceholderText(/start typing a name or email/i);
const input = screen.getByPlaceholderText("peopleSearch.placeholder");
await act(async () => userEvent.type(input, "New"));
const option = await screen.findByText("New User");
@@ -433,10 +433,12 @@ describe("calendar Availability search", () => {
});
expect(spy).toHaveBeenCalled();
await act(async () => {
fireEvent.click(screen.getByRole("button", { name: /create event/i }));
fireEvent.click(
screen.getByRole("button", { name: "event.createEvent" })
);
});
await waitFor(() => {
expect(screen.getAllByText(/Create Event/i)).toHaveLength(2);
expect(screen.getAllByText("event.createEvent")).toHaveLength(2);
expect(screen.getAllByText(/New User/i)).toHaveLength(2);
});
});
@@ -460,7 +462,7 @@ describe("calendar Availability search", () => {
renderWithProviders(<CalendarTestWrapper />, preloadedState)
);
const input = screen.getByPlaceholderText(/start typing a name or email/i);
const input = screen.getByPlaceholderText("peopleSearch.placeholder");
await act(async () => userEvent.type(input, "New"));
const option = await screen.findByText("New User");
@@ -473,12 +475,12 @@ describe("calendar Availability search", () => {
});
await waitFor(() => {
expect(screen.getAllByText(/Create Event/i)).toHaveLength(2);
expect(screen.getAllByText("event.createEvent")).toHaveLength(2);
expect(screen.getAllByText(/New User/i)).toHaveLength(2);
});
});
it("BUGFIX: can untoggle all personnal calendars", async () => {
it("BUGFIX: can untoggle all calendar.personal", async () => {
await act(async () =>
renderWithProviders(<CalendarTestWrapper />, {
user: preloadedState.user,
@@ -489,7 +491,7 @@ describe("calendar Availability search", () => {
})
);
const checkbox = screen.getByLabelText("Calendar personnal");
const checkbox = screen.getByLabelText("Calendar personal");
expect(checkbox).toBeChecked();
fireEvent.click(checkbox); // toggle off
__test__/components/CalendarColors.test.tsx
+3 -4
View File
@@ -1,6 +1,5 @@
import { fireEvent, screen, waitFor } from "@testing-library/react";
import { fireEvent, screen, waitFor, act } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { act } from "react";
import CalendarSearch from "../../src/components/Calendar/CalendarSearch";
import * as CalendarApi from "../../src/features/Calendars/CalendarApi";
import * as CalendarSlice from "../../src/features/Calendars/CalendarSlice";
@@ -188,7 +187,7 @@ describe("CalendarSearch", () => {
await waitFor(() => {
expect(
screen.getByText("No more Calendar for Test User")
screen.getByText("calendar.noMoreCalendarsFor(name=Test User)")
).toBeInTheDocument();
});
@@ -223,7 +222,7 @@ describe("CalendarSearch", () => {
await waitFor(() => {
expect(
screen.getByText("No publicly available calendars for Test User")
screen.getByText("calendar.noPublicCalendarsFor(name=Test User)")
).toBeInTheDocument();
});
});
__test__/components/CalendarSelection.test.tsx
+22 -14
View File
@@ -44,7 +44,7 @@ describe("CalendarSelection", () => {
jest.clearAllMocks();
cleanup();
});
it("renders personal, delegated and other calendars", () => {
it("renders personal, delegated and calendar.other", () => {
renderWithProviders(
<CalendarSelection
selectedCalendars={["user1/cal1"]}
@@ -56,9 +56,9 @@ describe("CalendarSelection", () => {
}
);
expect(screen.getByText("Personnal Calendars")).toBeInTheDocument();
expect(screen.getByText("Delegated Calendars")).toBeInTheDocument();
expect(screen.getByText("Other Calendars")).toBeInTheDocument();
expect(screen.getByText("calendar.personal")).toBeInTheDocument();
expect(screen.getByText("calendar.delegated")).toBeInTheDocument();
expect(screen.getByText("calendar.other")).toBeInTheDocument();
expect(screen.getByLabelText("Calendar personal")).toBeChecked();
expect(screen.getByLabelText("Calendar delegated")).not.toBeChecked();
@@ -125,11 +125,13 @@ describe("CalendarSelection", () => {
fireEvent.click(addButtons[1]);
await waitFor(() =>
expect(screen.getByText(/Add new calendar/i)).toBeInTheDocument()
expect(
screen.getByText("calendarPopover.tabs.addNew")
).toBeInTheDocument()
);
});
it("Navigates to deletion dialog and deletes personnal cal", async () => {
it("Navigates to deletion dialog and deletes personal cal", async () => {
const spy = jest
.spyOn(calendarThunks, "removeCalendarAsync")
.mockImplementation((payload) => {
@@ -152,7 +154,9 @@ describe("CalendarSelection", () => {
userEvent.click(screen.getByText(/delete/i));
await waitFor(() =>
expect(screen.getByText("Remove Calendar personal?")).toBeInTheDocument()
expect(
screen.getByText("calendar.delete.title(name=Calendar personal)")
).toBeInTheDocument()
);
fireEvent.click(screen.getByRole("button", { name: /delete/i }));
@@ -182,7 +186,9 @@ describe("CalendarSelection", () => {
userEvent.click(screen.getByText(/remove/i));
await waitFor(() =>
expect(screen.getByText("Remove Calendar delegated?")).toBeInTheDocument()
expect(
screen.getByText("calendar.delete.title(name=Calendar delegated)")
).toBeInTheDocument()
);
fireEvent.click(screen.getByRole("button", { name: /remove/i }));
@@ -204,10 +210,12 @@ describe("CalendarSelection", () => {
const addButtons = screen.getAllByTestId("AddIcon");
fireEvent.click(addButtons[1]); // seccond Add button (other)
expect(screen.getByText("Browse other calendars")).toBeInTheDocument();
expect(
screen.getByText("calendar.browseOtherCalendars")
).toBeInTheDocument();
});
it("when only personnal calendars are in the state, only personnal calendars and the title for other to be added are shown", () => {
it("when only calendar.personal are in the state, only calendar.personal and the title for other to be added are shown", () => {
renderWithProviders(
<CalendarSelection
selectedCalendars={[]}
@@ -224,9 +232,9 @@ describe("CalendarSelection", () => {
}
);
expect(screen.getByText("Personnal Calendars")).toBeInTheDocument();
expect(screen.queryByText("Delegated Calendars")).not.toBeInTheDocument();
expect(screen.queryByText("Other Calendars")).toBeInTheDocument();
expect(screen.getByText("calendar.personal")).toBeInTheDocument();
expect(screen.queryByText("calendar.delegated")).not.toBeInTheDocument();
expect(screen.queryByText("calendar.other")).toBeInTheDocument();
});
it("renders nothing when no calendars are present", () => {
@@ -256,7 +264,7 @@ describe("CalendarSelection", () => {
}
);
const delegatedAccordionSummary = screen
.getByText("Delegated Calendars")
.getByText("calendar.delegated")
.closest(".MuiAccordionSummary-root");
fireEvent.click(delegatedAccordionSummary!);
__test__/components/DuplicateEvent.test.tsx
+12 -7
View File
@@ -1,6 +1,5 @@
import { fireEvent, screen, waitFor } from "@testing-library/react";
import EventDuplication from "../../src/components/Event/EventDuplicate";
import EventDisplayModal from "../../src/features/Events/EventDisplay";
import EventPopover from "../../src/features/Events/EventModal";
import { renderWithProviders } from "../utils/Renderwithproviders";
import EventPreviewModal from "../../src/features/Events/EventDisplayPreview";
@@ -31,8 +30,8 @@ const preloadedState = {
URL: "calendars/667037022b752d0026472254/cal1/event1.ics",
title: "Test Event",
calId: "667037022b752d0026472254/cal1",
start: day,
end: day,
start: day.toISOString(),
end: day.toISOString(),
timezone: "UTC",
organizer: { cn: "test", cal_address: "test@test.com" },
attendee: [
@@ -77,7 +76,9 @@ describe("EventDuplication", () => {
preloadedState
);
fireEvent.click(screen.getByRole("menuitem", { name: /Duplicate event/i }));
fireEvent.click(
screen.getByRole("menuitem", { name: "eventDuplication.duplicateEvent" })
);
expect(onOpenDuplicate).toHaveBeenCalled();
});
@@ -126,7 +127,7 @@ describe("EventPopover", () => {
fireEvent.change(screen.getByLabelText(/Title/i), {
target: { value: "Duplicated Event" },
});
fireEvent.click(screen.getByRole("button", { name: /Save/i }));
fireEvent.click(screen.getByRole("button", { name: "actions.save" }));
waitFor(() => expect(onClose).toHaveBeenCalled());
});
@@ -145,8 +146,12 @@ describe("EventDisplayModal", () => {
);
fireEvent.click(screen.getByTestId("MoreVertIcon"));
fireEvent.click(screen.getByRole("menuitem", { name: /Duplicate event/i }));
expect(screen.getAllByText(/Duplicate Event/i)[1]).toBeInTheDocument();
fireEvent.click(
screen.getByRole("menuitem", { name: "eventDuplication.duplicateEvent" })
);
expect(
screen.getAllByText("eventDuplication.duplicateEvent")[1]
).toBeInTheDocument();
expect(
screen.getByDisplayValue(
preloadedState.calendars.list["667037022b752d0026472254/cal1"].events
__test__/components/Menubar.test.tsx
+2 -2
View File
@@ -34,7 +34,7 @@ describe("Calendar App Component Display Tests", () => {
/>,
preloadedState
);
const logoElement = screen.getByAltText("Calendar");
const logoElement = screen.getByAltText("menubar.logoAlt");
expect(logoElement).toBeInTheDocument();
});
it("renders the main title", () => {
@@ -52,7 +52,7 @@ describe("Calendar App Component Display Tests", () => {
/>,
preloadedState
);
expect(screen.getByAltText("Calendar")).toBeInTheDocument();
expect(screen.getByAltText("menubar.logoAlt")).toBeInTheDocument();
});
it("shows avatar with user initials", () => {
__test__/components/RepeatEvent.test.tsx
+39 -21
View File
@@ -99,20 +99,22 @@ async function setupEventPopover(
);
// Fill in title
const titleInput = screen.getByLabelText("Title");
const titleInput = screen.getByLabelText("event.form.title");
fireEvent.change(titleInput, { target: { value: "Meeting" } });
// Click More options to expand the dialog
const showMoreButton = screen.getByRole("button", { name: /More options/i });
const showMoreButton = screen.getByRole("button", {
name: "common.moreOptions",
});
fireEvent.click(showMoreButton);
// Check Repeat checkbox to show repeat options
const repeatCheckbox = screen.getByLabelText("Repeat");
const repeatCheckbox = screen.getByLabelText("event.form.repeat");
fireEvent.click(repeatCheckbox);
// Wait for RepeatEvent component to be rendered
await waitFor(() => {
expect(screen.getByText("Day(s)")).toBeInTheDocument();
expect(screen.getByText("event.repeat.frequency.days")).toBeInTheDocument();
});
}
@@ -154,7 +156,7 @@ describe("RepeatEvent Component", () => {
fireEvent.mouseDown(frequencySelect);
// Select Week(s)
const weeklyOption = screen.getByText("Week(s)");
const weeklyOption = screen.getByText("event.repeat.frequency.weeks");
fireEvent.click(weeklyOption);
expect(setRepetition).toHaveBeenCalledWith(
@@ -183,7 +185,7 @@ describe("RepeatEvent Component", () => {
it("toggles day selection for weekly frequency", () => {
const { setRepetition } = setupRepeatEvent({ freq: "weekly" });
const mondayCheckbox = screen.getByLabelText("MO");
const mondayCheckbox = screen.getByLabelText("event.repeat.days.monday");
fireEvent.click(mondayCheckbox);
expect(setRepetition).toHaveBeenCalledWith(
@@ -203,9 +205,11 @@ describe("Repeat Event Integration Tests", () => {
// When Repeat checkbox is checked, repetition is set to empty object
// We need to set the frequency manually
const frequencySelect = screen.getByText("Day(s)");
const frequencySelect = screen.getByText("event.repeat.frequency.days");
fireEvent.mouseDown(frequencySelect);
const dailyOption = screen.getByRole("option", { name: "Day(s)" });
const dailyOption = screen.getByRole("option", {
name: "event.repeat.frequency.days",
});
fireEvent.click(dailyOption);
await expectRRule({ freq: "daily", interval: 1 });
@@ -259,13 +263,17 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Week(s) frequency
const frequencySelect = screen.getByText("Day(s)");
const frequencySelect = screen.getByText("event.repeat.frequency.days");
fireEvent.mouseDown(frequencySelect);
const weeklyOption = screen.getByRole("option", { name: "Week(s)" });
const weeklyOption = screen.getByRole("option", {
name: "event.repeat.frequency.weeks",
});
fireEvent.click(weeklyOption);
// Select Thursday
const thursdayCheckbox = screen.getByLabelText("TH");
const thursdayCheckbox = screen.getByLabelText(
"event.repeat.days.thursday"
);
fireEvent.click(thursdayCheckbox);
await expectRRule({
@@ -280,9 +288,11 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Week(s) frequency
const frequencySelect = screen.getByText("Day(s)");
const frequencySelect = screen.getByText("event.repeat.frequency.days");
fireEvent.mouseDown(frequencySelect);
const weeklyOption = screen.getByRole("option", { name: "Week(s)" });
const weeklyOption = screen.getByRole("option", {
name: "event.repeat.frequency.weeks",
});
fireEvent.click(weeklyOption);
// Set interval to 3
@@ -297,9 +307,11 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Month(s) frequency
const frequencySelect = screen.getByText("Day(s)");
const frequencySelect = screen.getByText("event.repeat.frequency.days");
fireEvent.mouseDown(frequencySelect);
const monthlyOption = screen.getByRole("option", { name: "Month(s)" });
const monthlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.months",
});
fireEvent.click(monthlyOption);
await expectRRule({ freq: "monthly", interval: 1 });
@@ -310,9 +322,11 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Month(s) frequency
const frequencySelect = screen.getByText("Day(s)");
const frequencySelect = screen.getByText("event.repeat.frequency.days");
fireEvent.mouseDown(frequencySelect);
const monthlyOption = screen.getByRole("option", { name: "Month(s)" });
const monthlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.months",
});
fireEvent.click(monthlyOption);
// Select "After" end option
@@ -331,9 +345,11 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Year(s) frequency
const frequencySelect = screen.getByText("Day(s)");
const frequencySelect = screen.getByText("event.repeat.frequency.days");
fireEvent.mouseDown(frequencySelect);
const yearlyOption = screen.getByRole("option", { name: "Year(s)" });
const yearlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.years",
});
fireEvent.click(yearlyOption);
await expectRRule({ freq: "yearly", interval: 1 });
@@ -344,9 +360,11 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Year(s) frequency
const frequencySelect = screen.getByText("Day(s)");
const frequencySelect = screen.getByText("event.repeat.frequency.days");
fireEvent.mouseDown(frequencySelect);
const yearlyOption = screen.getByRole("option", { name: "Year(s)" });
const yearlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.years",
});
fireEvent.click(yearlyOption);
// First choose "After" with 5 occurrences
__test__/features/Calendars/CalendarModal.test.tsx
+14 -12
View File
@@ -33,7 +33,7 @@ describe("CalendarPopover", () => {
renderPopover();
expect(screen.getByLabelText(/Name/i)).toBeInTheDocument();
expect(screen.getByText(/add description/i)).toBeInTheDocument();
expect(screen.getByText("calendar.addDescription")).toBeInTheDocument();
});
it("updates name and description fields", () => {
@@ -43,7 +43,7 @@ describe("CalendarPopover", () => {
fireEvent.change(nameInput, { target: { value: "My Calendar" } });
expect(nameInput).toHaveValue("My Calendar");
fireEvent.click(screen.getByText(/add description/i));
fireEvent.click(screen.getByText("calendar.addDescription"));
const descInput = screen.getByLabelText(/Description/i);
fireEvent.change(descInput, { target: { value: "Test description" } });
expect(descInput).toHaveValue("Test description");
@@ -60,7 +60,7 @@ describe("CalendarPopover", () => {
fireEvent.change(screen.getByLabelText(/Name/i), {
target: { value: "Test Calendar" },
});
fireEvent.click(screen.getByText(/add description/i));
fireEvent.click(screen.getByText("calendar.addDescription"));
fireEvent.change(screen.getByLabelText(/Description/i), {
target: { value: "Test Description" },
});
@@ -168,7 +168,7 @@ describe("CalendarPopover (editing mode)", () => {
});
// Save
fireEvent.click(screen.getByRole("button", { name: /Save/i }));
fireEvent.click(screen.getByRole("button", { name: "actions.save" }));
await waitFor(() =>
expect(spy).toHaveBeenCalledWith(
@@ -291,7 +291,7 @@ describe("CalendarPopover - Tabs Scenarios", () => {
expect(publicButton).toHaveAttribute("aria-pressed", "false");
// Save
fireEvent.click(screen.getByRole("button", { name: /Save/i }));
fireEvent.click(screen.getByRole("button", { name: "actions.save" }));
await waitFor(() =>
expect(patchSpy).toHaveBeenCalledWith(
@@ -322,7 +322,7 @@ describe("CalendarPopover - Tabs Scenarios", () => {
fireEvent.click(screen.getByRole("tab", { name: /Access/i }));
// Expect text field with caldav link
const input = screen.getByLabelText(/CalDAV access/i);
const input = screen.getByLabelText("calendar.caldav_access");
expect(input).toHaveValue("https://cal.example.org/calendars/user1/cal1");
// Click copy button (find button containing ContentCopyIcon)
@@ -338,7 +338,7 @@ describe("CalendarPopover - Tabs Scenarios", () => {
// Snackbar should appear
await waitFor(() =>
expect(screen.getByText(/Link copied!/i)).toBeInTheDocument()
expect(screen.getByText("common.link_copied")).toBeInTheDocument()
);
});
@@ -371,11 +371,11 @@ describe("CalendarPopover - Tabs Scenarios", () => {
fireEvent.change(screen.getByLabelText(/Name/i), {
target: { value: "Imported Calendar" },
});
const fileInput = screen.getByLabelText(/select file/i);
const fileInput = screen.getByLabelText("common.select_file");
fireEvent.change(fileInput, { target: { files: [file] } });
// Click Import
fireEvent.click(screen.getByRole("button", { name: "Import" }));
fireEvent.click(screen.getByRole("button", { name: "actions.import" }));
await waitFor(() => expect(createSpy).toHaveBeenCalled());
await waitFor(() => expect(importSpy).toHaveBeenCalled());
@@ -402,10 +402,10 @@ describe("CalendarPopover - Tabs Scenarios", () => {
);
fireEvent.click(screen.getByRole("tab", { name: /Import/i }));
const fileInput = screen.getByLabelText(/select file/i);
const fileInput = screen.getByLabelText("common.select_file");
fireEvent.change(fileInput, { target: { files: [file] } });
fireEvent.click(screen.getByRole("button", { name: "Import" }));
fireEvent.click(screen.getByRole("button", { name: "actions.import" }));
await waitFor(() =>
expect(importSpy).toHaveBeenCalledWith(
@@ -427,7 +427,9 @@ describe("CalendarPopover - Tabs Scenarios", () => {
fireEvent.click(screen.getByRole("tab", { name: /Import/i }));
const importButton = screen.getByRole("button", { name: /Import/i });
const importButton = screen.getByRole("button", {
name: "actions.import",
});
expect(importButton).toBeDisabled();
});
});
__test__/features/Events/EventDisplay.test.tsx
+98 -661
View File
File diff suppressed because it is too large Load Diff
__test__/features/Events/EventModal.test.tsx
+34 -44
View File
@@ -110,7 +110,7 @@ describe("EventPopover", () => {
renderPopover();
// Check dialog title
expect(screen.getByText("Create Event")).toBeInTheDocument();
expect(screen.getByText("event.createEvent")).toBeInTheDocument();
// Check inputs exist by their roles
const titleInput = screen.getByRole("textbox", { name: /title/i });
@@ -118,7 +118,7 @@ describe("EventPopover", () => {
// Description input is only visible after clicking "Add description" button
const addDescriptionButton = screen.getByRole("button", {
name: /Add description/i,
name: "event.form.addDescription",
});
expect(addDescriptionButton).toBeInTheDocument();
@@ -127,20 +127,20 @@ describe("EventPopover", () => {
// Check button
expect(
screen.getByRole("button", { name: /More options/i })
screen.getByRole("button", { name: "common.moreOptions" })
).toBeInTheDocument();
// Extended mode
fireEvent.click(screen.getByRole("button", { name: /More options/i }));
fireEvent.click(screen.getByRole("button", { name: "common.moreOptions" }));
// Back button appears
expect(screen.getByLabelText("show less")).toBeInTheDocument();
// Extended labels appear
expect(screen.getAllByText("Repeat")).toHaveLength(1);
expect(screen.getAllByText("Notification")).toHaveLength(1);
expect(screen.getAllByText("Visible to")).toHaveLength(1);
expect(screen.getAllByText("Show me as")).toHaveLength(1);
expect(screen.getAllByText("event.form.repeat")).toHaveLength(1);
expect(screen.getAllByText("event.form.notification")).toHaveLength(1);
expect(screen.getAllByText("event.form.visibleTo")).toHaveLength(1);
expect(screen.getAllByText("event.form.showMeAs")).toHaveLength(1);
});
it("fills start from selectedRange", () => {
@@ -160,31 +160,35 @@ describe("EventPopover", () => {
it("updates inputs on change", () => {
renderPopover();
fireEvent.change(screen.getByLabelText("Title"), {
fireEvent.change(screen.getByLabelText("event.form.title"), {
target: { value: "My Event" },
});
expect(screen.getByLabelText("Title")).toHaveValue("My Event");
expect(screen.getByLabelText("event.form.title")).toHaveValue("My Event");
// Click "Add description" button first
fireEvent.click(screen.getByRole("button", { name: /Add description/i }));
fireEvent.click(
screen.getByRole("button", { name: "event.form.addDescription" })
);
fireEvent.change(screen.getByLabelText("Description"), {
fireEvent.change(screen.getByLabelText("event.form.description"), {
target: { value: "Event Description" },
});
expect(screen.getByLabelText("Description")).toHaveValue(
expect(screen.getByLabelText("event.form.description")).toHaveValue(
"Event Description"
);
fireEvent.change(screen.getByLabelText("Location"), {
fireEvent.change(screen.getByLabelText("event.form.location"), {
target: { value: "Conference Room" },
});
expect(screen.getByLabelText("Location")).toHaveValue("Conference Room");
expect(screen.getByLabelText("event.form.location")).toHaveValue(
"Conference Room"
);
});
it("changes selected calendar", async () => {
renderPopover();
const select = screen.getByLabelText("Calendar");
const select = screen.getByLabelText("event.form.calendar");
fireEvent.mouseDown(select); // Open menu
const option = await screen.findByText("Calendar 2");
@@ -197,10 +201,10 @@ describe("EventPopover", () => {
it("adds a attendee", async () => {
jest.useFakeTimers();
renderPopover();
fireEvent.change(screen.getByLabelText("Title"), {
fireEvent.change(screen.getByLabelText("event.form.title"), {
target: { value: "newEvent" },
});
const select = screen.getByLabelText("Start typing a name or email");
const select = screen.getByLabelText("peopleSearch.label");
act(() => {
select.focus();
@@ -225,7 +229,7 @@ describe("EventPopover", () => {
return () => Promise.resolve(payload) as any;
});
fireEvent.click(screen.getByRole("button", { name: /Save/i }));
fireEvent.click(screen.getByRole("button", { name: "actions.save" }));
await waitFor(() => {
expect(spy).toHaveBeenCalled();
@@ -262,8 +266,6 @@ describe("EventPopover", () => {
renderPopover();
const newEvent = {
title: "Meeting",
start: "2025-07-18T00:00:00.000Z",
end: "2025-07-18T00:00:00.000Z",
allday: false,
uid: "6045c603-11ab-43c5-bc30-0641420bb3a8",
description: "Discuss project",
@@ -274,17 +276,17 @@ describe("EventPopover", () => {
};
// Fill inputs
fireEvent.change(screen.getByLabelText("Title"), {
fireEvent.change(screen.getByLabelText("event.form.title"), {
target: { value: newEvent.title },
});
fireEvent.click(screen.getByLabelText("All day"));
// Click "Add description" button first
fireEvent.click(screen.getByRole("button", { name: /Add description/i }));
fireEvent.change(screen.getByLabelText("Description"), {
fireEvent.click(
screen.getByRole("button", { name: "event.form.addDescription" })
);
fireEvent.change(screen.getByLabelText("event.form.description"), {
target: { value: newEvent.description },
});
fireEvent.change(screen.getByLabelText("Location"), {
fireEvent.change(screen.getByLabelText("event.form.location"), {
target: { value: newEvent.location },
});
const spy = jest
@@ -293,7 +295,7 @@ describe("EventPopover", () => {
return () => Promise.resolve(payload) as any;
});
fireEvent.click(screen.getByRole("button", { name: /Save/i }));
fireEvent.click(screen.getByRole("button", { name: "actions.save" }));
await waitFor(() => {
expect(spy).toHaveBeenCalled();
@@ -307,20 +309,6 @@ describe("EventPopover", () => {
expect(receivedPayload.newEvent.title).toBe(newEvent.title);
expect(receivedPayload.newEvent.description).toBe(newEvent.description);
expect(
formatDateToYYYYMMDDTHHMMSS(
new Date(receivedPayload.newEvent.start)
).split("T")[0]
).toBe(formatDateToYYYYMMDDTHHMMSS(new Date(newEvent.start)).split("T")[0]);
const expectedAllDayEnd = new Date(newEvent.end);
expectedAllDayEnd.setUTCDate(expectedAllDayEnd.getUTCDate() + 1);
expect(
formatDateToYYYYMMDDTHHMMSS(
new Date(receivedPayload.newEvent.end || new Date())
).split("T")[0]
).toBe(formatDateToYYYYMMDDTHHMMSS(expectedAllDayEnd).split("T")[0]);
expect(receivedPayload.newEvent.location).toBe(newEvent.location);
expect(receivedPayload.newEvent.organizer).toEqual(newEvent.organizer);
expect(receivedPayload.newEvent.color).toEqual(
@@ -335,7 +323,7 @@ describe("EventPopover", () => {
renderPopover();
// Cancel button only appears in expanded mode
fireEvent.click(screen.getByRole("button", { name: /More options/i }));
fireEvent.click(screen.getByRole("button", { name: "common.moreOptions" }));
fireEvent.click(screen.getByRole("button", { name: /Cancel/i }));
@@ -345,7 +333,9 @@ describe("EventPopover", () => {
it("BUGFIX: Prefill Calendar field", async () => {
renderPopover();
await waitFor(() =>
expect(screen.getByLabelText("Calendar")).toHaveTextContent("Calendar 1")
expect(screen.getByLabelText("event.form.calendar")).toHaveTextContent(
"Calendar 1"
)
);
});
});
__test__/features/Events/EventRepetition.test.tsx
+985 -805
View File
File diff suppressed because it is too large Load Diff
__test__/features/Events/EventUpdateModal.test.tsx
+6 -6
View File
@@ -279,7 +279,7 @@ describe("EventUpdateModal Recurring to Non-Recurring Conversion", () => {
});
// Uncheck repeat checkbox
const repeatCheckbox = screen.getByLabelText("Repeat");
const repeatCheckbox = screen.getByLabelText("event.form.repeat");
expect(repeatCheckbox).toBeChecked();
await act(async () => {
@@ -289,7 +289,7 @@ describe("EventUpdateModal Recurring to Non-Recurring Conversion", () => {
expect(repeatCheckbox).not.toBeChecked();
// Click Save button
const saveButton = screen.getByRole("button", { name: /Save/i });
const saveButton = screen.getByRole("button", { name: "actions.save" });
await act(async () => {
fireEvent.click(saveButton);
@@ -397,13 +397,13 @@ describe("EventUpdateModal Recurring to Non-Recurring Conversion", () => {
});
// Uncheck repeat checkbox and save
const repeatCheckbox = screen.getByLabelText("Repeat");
const repeatCheckbox = screen.getByLabelText("event.form.repeat");
await act(async () => {
fireEvent.click(repeatCheckbox);
});
const saveButton = screen.getByRole("button", { name: /Save/i });
const saveButton = screen.getByRole("button", { name: "actions.save" });
await act(async () => {
fireEvent.click(saveButton);
@@ -512,13 +512,13 @@ describe("EventUpdateModal Recurring to Non-Recurring Conversion", () => {
});
// Uncheck repeat and save
const repeatCheckbox = screen.getByLabelText("Repeat");
const repeatCheckbox = screen.getByLabelText("event.form.repeat");
await act(async () => {
fireEvent.click(repeatCheckbox);
});
const saveButton = screen.getByRole("button", { name: /Save/i });
const saveButton = screen.getByRole("button", { name: "actions.save" });
await act(async () => {
fireEvent.click(saveButton);
__test__/features/Events/TempUpdate.test.tsx
+13 -15
View File
@@ -138,10 +138,10 @@ describe("Update tempcalendars called with correct params", () => {
await waitFor(() => {
fireEvent.click(screen.getByTestId("MoreVertIcon"));
expect(screen.getByText("Delete event")).toBeInTheDocument();
expect(screen.getByText("eventPreview.deleteEvent")).toBeInTheDocument();
});
const deleteMenuItem = screen.getByText("Delete event");
const deleteMenuItem = screen.getByText("eventPreview.deleteEvent");
fireEvent.click(deleteMenuItem);
await waitFor(() =>
@@ -191,10 +191,10 @@ describe("Update tempcalendars called with correct params", () => {
await waitFor(() => {
fireEvent.click(screen.getByTestId("MoreVertIcon"));
expect(screen.getByText("Delete event")).toBeInTheDocument();
expect(screen.getByText("eventPreview.deleteEvent")).toBeInTheDocument();
});
const deleteMenuItem = screen.getByText("Delete event");
const deleteMenuItem = screen.getByText("eventPreview.deleteEvent");
fireEvent.click(deleteMenuItem);
await waitFor(() => {
@@ -233,9 +233,7 @@ describe("Update tempcalendars called with correct params", () => {
const titleInput = screen.getByLabelText(/title/i);
fireEvent.change(titleInput, { target: { value: "New Event" } });
const attendeeInput = screen.getByLabelText(
/Start typing a name or email/i
);
const attendeeInput = screen.getByLabelText(/peopleSearch.label/i);
fireEvent.change(attendeeInput, { target: { value: "attendee@test.com" } });
fireEvent.keyDown(attendeeInput, { key: "Enter", code: "Enter" });
@@ -559,10 +557,10 @@ describe("Update tempcalendars called with correct params", () => {
await waitFor(() => {
fireEvent.click(screen.getByTestId("MoreVertIcon"));
expect(screen.getByText("Delete event")).toBeInTheDocument();
expect(screen.getByText("eventPreview.deleteEvent")).toBeInTheDocument();
});
const deleteMenuItem = screen.getByText("Delete event");
const deleteMenuItem = screen.getByText("eventPreview.deleteEvent");
fireEvent.click(deleteMenuItem);
await waitFor(() => {
@@ -597,10 +595,10 @@ describe("Update tempcalendars called with correct params", () => {
await waitFor(() => {
fireEvent.click(screen.getByTestId("MoreVertIcon"));
expect(screen.getByText("Delete event")).toBeInTheDocument();
expect(screen.getByText("eventPreview.deleteEvent")).toBeInTheDocument();
});
const deleteMenuItem = screen.getByText("Delete event");
const deleteMenuItem = screen.getByText("eventPreview.deleteEvent");
fireEvent.click(deleteMenuItem);
await waitFor(() => {
@@ -673,10 +671,10 @@ describe("Update tempcalendars called with correct params", () => {
await waitFor(() => {
fireEvent.click(screen.getByTestId("MoreVertIcon"));
expect(screen.getByText("Delete event")).toBeInTheDocument();
expect(screen.getByText("eventPreview.deleteEvent")).toBeInTheDocument();
});
const deleteMenuItem = screen.getByText("Delete event");
const deleteMenuItem = screen.getByText("eventPreview.deleteEvent");
fireEvent.click(deleteMenuItem);
await waitFor(() => {
@@ -767,10 +765,10 @@ describe("Update tempcalendars called with correct params", () => {
await waitFor(() => {
fireEvent.click(screen.getByTestId("MoreVertIcon"));
expect(screen.getByText("Delete event")).toBeInTheDocument();
expect(screen.getByText("eventPreview.deleteEvent")).toBeInTheDocument();
});
const deleteMenuItem = screen.getByText("Delete event");
const deleteMenuItem = screen.getByText("eventPreview.deleteEvent");
fireEvent.click(deleteMenuItem);
await waitFor(() => {
__test__/utils/Renderwithproviders.tsx
+19 -6
View File
@@ -1,13 +1,11 @@
import type { RenderOptions } from "@testing-library/react";
import { render } from "@testing-library/react";
import { I18nContext } from "cozy-ui/transpiled/react/providers/I18n";
import React, { PropsWithChildren } from "react";
import { Provider } from "react-redux";
import { MemoryRouter } from "react-router-dom";
import type { AppStore, RootState } from "../../src/app/store";
import { setupStore } from "../../src/app/store";
import { userData, userOrganiser } from "../../src/features/User/userDataTypes";
interface ExtendedRenderOptions extends Omit<RenderOptions, "queries"> {
preloadedState?: Partial<RootState>;
store?: AppStore;
@@ -23,9 +21,24 @@ export function renderWithProviders(
const Wrapper = ({ children }: PropsWithChildren) => {
return (
<MemoryRouter initialEntries={["/"]}>
<Provider store={store}>{children}</Provider>
</MemoryRouter>
<I18nContext.Provider
value={{
t: (key: string, vars?: Record<string, string>) => {
if (vars) {
const params = Object.entries(vars)
.map(([k, v]) => `${k}=${v}`)
.join(",");
return `${key}(${params})`;
}
return key;
},
f: (date: Date, formatStr: string) => date.toString(),
}}
>
<MemoryRouter initialEntries={["/"]}>
<Provider store={store}>{children}</Provider>
</MemoryRouter>
</I18nContext.Provider>
);
};