0

I have a form with React Quill Text Editor. On submit I read the values from it. I wrote a unit test, to write something and check if the correct values are being sent. It goes like this.

const updatedText = "New updated text(November)";
    fireEvent.change(document.querySelector('quill-editor'), {
      target: { textContent: updatedText }
    });
    fireEvent.click(screen.getByRole("button", { name: "update-post" }));
    await waitFor(() => {
      expect(mockSocialPostUpdate).toHaveBeenCalledWith(
        expect.objectContaining({ path: "/api/v1/social-posts/" }),
        { id: feeds[0]["profile"]["id"] },
        {
          id: 1,
          text: expect.objectContaining({
            insert: updatedText
          }),
          profileId: 1,
          channelId: 1
        }
      );
    });

I am spying the put method and using fireEvent.change. When I see what has been posted, it is still the old value. Is there any correct way to change it?

Missak Boyajian
  • 1,965
  • 7
  • 32
  • 59
  • First of all, is there really `document.querySelector('quill-editor')`? And regardless, Jest JSDOM isn't supposed to work like a real browser and can fail the expectations any time. Third-party libs that use DOM should generally be mocked. – Estus Flask Sep 22 '20 at 15:31
  • Any idea how can I mock this? – Missak Boyajian Sep 22 '20 at 15:50

1 Answers1

0
const onChange = jest.fn()

jest.mock("react-quill", () => {
  return {
    ...jest.requireActual("react-quill"),
    onChange: (): NavigateFunction => onChange,
    value: 'testing text',
  }
})
  • This then throws, `Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object.` – gdibble Aug 04 '23 at 02:53
  • 2
    Please [edit] your answer to provide more information as to how the code you've provided works, what you have changed, etc. Code-only answers might solve the problem of the original asker but they don't help future readers understand the solution. – LW001 Aug 04 '23 at 19:06