Display composer only after isEncrypted is computed

This commit is contained in:
Florian Duros 2024-11-19 15:02:03 +01:00
parent 90cd420f4a
commit 4d4e037391
No known key found for this signature in database
GPG key ID: A5BBB4041B493F15
3 changed files with 73 additions and 52 deletions

View file

@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
*/
import React from "react";
import { fireEvent, render, waitFor } from "jest-matrix-react";
import { fireEvent, render, waitFor, screen } from "jest-matrix-react";
import { IContent, MatrixClient, MsgType } from "matrix-js-sdk/src/matrix";
import { mocked } from "jest-mock";
import userEvent from "@testing-library/user-event";
@ -369,12 +369,15 @@ describe("<SendMessageComposer/>", () => {
</RoomContext.Provider>
</MatrixClientContext.Provider>
);
const getComponent = (props = {}, roomContext = defaultRoomContext, client = mockClient) => {
return render(getRawComponent(props, roomContext, client));
const getComponent = async (props = {}, roomContext = defaultRoomContext, client = mockClient) => {
const renderResult = render(getRawComponent(props, roomContext, client));
// Wait for the composer to be rendered
await waitFor(() => expect(screen.getByRole("textbox")).toBeInTheDocument());
return renderResult;
};
it("renders text and placeholder correctly", () => {
const { container } = getComponent({ placeholder: "placeholder string" });
it("renders text and placeholder correctly", async () => {
const { container } = await getComponent({ placeholder: "placeholder string" });
expect(container.querySelectorAll('[aria-label="placeholder string"]')).toHaveLength(1);
@ -383,9 +386,9 @@ describe("<SendMessageComposer/>", () => {
expect(container.textContent).toBe("Test Text");
});
it("correctly persists state to and from localStorage", () => {
it("correctly persists state to and from localStorage", async () => {
const props = { replyToEvent: mockEvent };
const { container, unmount, rerender } = getComponent(props);
const { container, unmount, rerender } = await getComponent(props);
addTextToComposer(container, "Test Text");
@ -403,7 +406,7 @@ describe("<SendMessageComposer/>", () => {
// ensure the correct model is re-loaded
rerender(getRawComponent(props));
expect(container.textContent).toBe("Test Text");
await waitFor(() => expect(screen.getByRole("textbox")).toHaveTextContent("Test Text"));
expect(spyDispatcher).toHaveBeenCalledWith({
action: "reply_to_event",
event: mockEvent,
@ -417,8 +420,8 @@ describe("<SendMessageComposer/>", () => {
expect(container.textContent).toBe("");
});
it("persists state correctly without replyToEvent onbeforeunload", () => {
const { container } = getComponent();
it("persists state correctly without replyToEvent onbeforeunload", async () => {
const { container } = await getComponent();
addTextToComposer(container, "Hello World");
@ -437,7 +440,7 @@ describe("<SendMessageComposer/>", () => {
it("persists to session history upon sending", async () => {
mockPlatformPeg({ overrideBrowserShortcuts: jest.fn().mockReturnValue(false) });
const { container } = getComponent({ replyToEvent: mockEvent });
const { container } = await getComponent({ replyToEvent: mockEvent });
addTextToComposer(container, "This is a message");
fireEvent.keyDown(container.querySelector(".mx_SendMessageComposer")!, { key: "Enter" });
@ -458,7 +461,7 @@ describe("<SendMessageComposer/>", () => {
});
});
it("correctly sends a message", () => {
it("correctly sends a message", async () => {
mocked(doMaybeLocalRoomAction).mockImplementation(
<T,>(roomId: string, fn: (actualRoomId: string) => Promise<T>, _client?: MatrixClient) => {
return fn(roomId);
@ -466,7 +469,7 @@ describe("<SendMessageComposer/>", () => {
);
mockPlatformPeg({ overrideBrowserShortcuts: jest.fn().mockReturnValue(false) });
const { container } = getComponent();
const { container } = await getComponent();
addTextToComposer(container, "test message");
fireEvent.keyDown(container.querySelector(".mx_SendMessageComposer")!, { key: "Enter" });
@ -495,7 +498,7 @@ describe("<SendMessageComposer/>", () => {
});
mockPlatformPeg({ overrideBrowserShortcuts: jest.fn().mockReturnValue(false) });
const { container } = getComponent({ replyToEvent });
const { container } = await getComponent({ replyToEvent });
addTextToComposer(container, "/tableflip");
fireEvent.keyDown(container.querySelector(".mx_SendMessageComposer")!, { key: "Enter" });
@ -516,7 +519,7 @@ describe("<SendMessageComposer/>", () => {
);
});
it("shows chat effects on message sending", () => {
it("shows chat effects on message sending", async () => {
mocked(doMaybeLocalRoomAction).mockImplementation(
<T,>(roomId: string, fn: (actualRoomId: string) => Promise<T>, _client?: MatrixClient) => {
return fn(roomId);
@ -524,7 +527,7 @@ describe("<SendMessageComposer/>", () => {
);
mockPlatformPeg({ overrideBrowserShortcuts: jest.fn().mockReturnValue(false) });
const { container } = getComponent();
const { container } = await getComponent();
addTextToComposer(container, "🎉");
fireEvent.keyDown(container.querySelector(".mx_SendMessageComposer")!, { key: "Enter" });
@ -538,7 +541,7 @@ describe("<SendMessageComposer/>", () => {
expect(defaultDispatcher.dispatch).toHaveBeenCalledWith({ action: `effects.confetti` });
});
it("not to send chat effects on message sending for threads", () => {
it("not to send chat effects on message sending for threads", async () => {
mocked(doMaybeLocalRoomAction).mockImplementation(
<T,>(roomId: string, fn: (actualRoomId: string) => Promise<T>, _client?: MatrixClient) => {
return fn(roomId);
@ -546,7 +549,7 @@ describe("<SendMessageComposer/>", () => {
);
mockPlatformPeg({ overrideBrowserShortcuts: jest.fn().mockReturnValue(false) });
const { container } = getComponent({
const { container } = await getComponent({
relation: {
rel_type: "m.thread",
event_id: "$yolo",
@ -615,7 +618,8 @@ describe("<SendMessageComposer/>", () => {
<SendMessageComposer room={room} toggleStickerPickerOpen={jest.fn()} />
</MatrixClientContext.Provider>,
);
// Wait for the composer to be rendered
await waitFor(() => expect(screen.getByRole("textbox")).toBeInTheDocument());
const composer = container.querySelector<HTMLDivElement>(".mx_BasicMessageComposer_input")!;
// Does not trigger on keydown as that'll cause false negatives for global shortcuts