How do you do unit test for Plate?

[M162]

May I ask a question? How do you do unit test for Plate?

I am using react testing library, and there is a library called user-event in react testing library. However, the onChange function cannot be triggered when I use 'type' function in user-event. The reason seems described here: https://stackoverflow.com/questions/53598450/how-to-trigger-change-event-on-slate-js-when-testing-with-selenium-or-cypress , it is because 'type' function cannot trigger 'onBeforeInput'.

Then I report this issue in user-event's repo: testing-library/user-event#858. There is a nice person did some research and find it is an issue of React, and provide me a workaround. But this workaround only works in CodeSandbox, I cannot make it work locally. Currently, I am lost here.

So I just wonder how you do unit test for Plate?

[zbeyens]

Example: https://github.com/udecode/plate/blob/9a35d33ee1bc36fa0683a73b5af41a1e483f1324/packages/ui/nodes/table/src/TableCellElement/TableCellElement.spec.tsx

[M162]

Many thanks for your help.

I found this test file and it simulated user input. https://github.com/udecode/plate/blob/e65a37690b2efdfa39d5e16edb2f373b6c661214/packages/ui/nodes/image/src/ImageElement/ImageElement.spec.tsx. However I get this error when I try to use '@udecode/plate-test-utils' and run my own test case:

● Test suite failed to run

    No hyperscript creator found for tag: <htext>

      10 | const initialEditor = (
      11 |   <editor>
    > 12 |     <htext />
         |     ^
      13 |   </editor>
      14 | ) as unknown as PlateEditor<unknown>;
      15 |

Do we have any documents about how to use @udecode/plate-test-utils? Thank you.

[zbeyens]

There is no doc on how to set up your testing env. The best you can do is to take a look at plate jest config.