Remove useWysiwyg mock (#9578)

This commit is contained in:
Florian Duros 2022-11-16 16:38:00 +01:00 committed by GitHub
parent cf3c899dd1
commit 3243d215e6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 116 additions and 170 deletions

View file

@ -16,8 +16,7 @@ limitations under the License.
import "@testing-library/jest-dom";
import React from "react";
import { render, screen, waitFor } from "@testing-library/react";
import { WysiwygProps } from "@matrix-org/matrix-wysiwyg";
import { fireEvent, render, screen, waitFor } from "@testing-library/react";
import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext";
import RoomContext from "../../../../../src/contexts/RoomContext";
@ -26,31 +25,8 @@ import { Action } from "../../../../../src/dispatcher/actions";
import { IRoomState } from "../../../../../src/components/structures/RoomView";
import { createTestClient, flushPromises, getRoomContext, mkEvent, mkStubRoom } from "../../../../test-utils";
import { SendWysiwygComposer } from "../../../../../src/components/views/rooms/wysiwyg_composer";
import * as useComposerFunctions
from "../../../../../src/components/views/rooms/wysiwyg_composer/hooks/useComposerFunctions";
import { aboveLeftOf } from "../../../../../src/components/structures/ContextMenu";
const mockClear = jest.fn();
// The wysiwyg fetch wasm bytes and a specific workaround is needed to make it works in a node (jest) environnement
// See https://github.com/matrix-org/matrix-wysiwyg/blob/main/platforms/web/test.setup.ts
jest.mock("@matrix-org/matrix-wysiwyg", () => ({
useWysiwyg: (props: WysiwygProps) => {
return {
ref: { current: null },
content: '<b>html</b>',
isWysiwygReady: true,
wysiwyg: { clear: mockClear },
actionStates: {
bold: 'enabled',
italic: 'enabled',
underline: 'enabled',
strikeThrough: 'enabled',
},
};
},
}));
describe('SendWysiwygComposer', () => {
afterEach(() => {
jest.resetAllMocks();
@ -101,16 +77,20 @@ describe('SendWysiwygComposer', () => {
expect(screen.getByTestId('PlainTextComposer')).toBeTruthy();
});
describe.each([{ isRichTextEnabled: true }, { isRichTextEnabled: false }])(
describe.each([
{ isRichTextEnabled: true, emptyContent: '<br>' },
{ isRichTextEnabled: false, emptyContent: '' },
])(
'Should focus when receiving an Action.FocusSendMessageComposer action',
({ isRichTextEnabled }) => {
({ isRichTextEnabled, emptyContent }) => {
afterEach(() => {
jest.resetAllMocks();
});
it('Should focus when receiving an Action.FocusSendMessageComposer action', async () => {
// Given we don't have focus
// Given we don't have focus
customRender(jest.fn(), jest.fn(), false, isRichTextEnabled);
await waitFor(() => expect(screen.getByRole('textbox')).toHaveAttribute('contentEditable', "true"));
// When we send the right action
defaultDispatcher.dispatch({
@ -123,10 +103,15 @@ describe('SendWysiwygComposer', () => {
});
it('Should focus and clear when receiving an Action.ClearAndFocusSendMessageComposer', async () => {
// Given we don't have focus
const mock = jest.spyOn(useComposerFunctions, 'useComposerFunctions');
mock.mockReturnValue({ clear: mockClear });
customRender(jest.fn(), jest.fn(), false, isRichTextEnabled);
// Given we don't have focus
const onChange = jest.fn();
customRender(onChange, jest.fn(), false, isRichTextEnabled);
await waitFor(() => expect(screen.getByRole('textbox')).toHaveAttribute('contentEditable', "true"));
fireEvent.input(screen.getByRole('textbox'), {
data: 'foo bar',
inputType: 'insertText',
});
// When we send the right action
defaultDispatcher.dispatch({
@ -135,15 +120,16 @@ describe('SendWysiwygComposer', () => {
});
// Then the component gets the focus
await waitFor(() => expect(screen.getByRole('textbox')).toHaveFocus());
expect(mockClear).toBeCalledTimes(1);
mock.mockRestore();
await waitFor(() => {
expect(screen.getByRole('textbox')).toHaveTextContent(/^$/);
expect(screen.getByRole('textbox')).toHaveFocus();
});
});
it('Should focus when receiving a reply_to_event action', async () => {
// Given we don't have focus
// Given we don't have focus
customRender(jest.fn(), jest.fn(), false, isRichTextEnabled);
await waitFor(() => expect(screen.getByRole('textbox')).toHaveAttribute('contentEditable', "true"));
// When we send the right action
defaultDispatcher.dispatch({
@ -156,7 +142,7 @@ describe('SendWysiwygComposer', () => {
});
it('Should not focus when disabled', async () => {
// Given we don't have focus and we are disabled
// Given we don't have focus and we are disabled
customRender(jest.fn(), jest.fn(), true, isRichTextEnabled);
expect(screen.getByRole('textbox')).not.toHaveFocus();