Any guides for testing with this thing?

[dwjohnston]

I'm wanting to write some tests against our our customised version of this tool. I'm having trouble with both Testing Library and Cypress.

With testing library - I can do this:

    userEvent.type(screen.getByRole("textbox"), "some plain text");

But I can't test keyboard short cuts like:

    userEvent.type(screen.getByRole("textbox"), "hello{meta}b{meta/}world")

With cypress I'm finding that I can enter text like:

 cy.get('.CodeMirror').type(
      "aaa"
    );

Also:

    cy.get('.CodeMirror').type(
      "hello{meta+b}world"
    );

Any other guides/best practises for testing?

[Ionaru]

The tests in this repo may be a good example: https://github.com/Ionaru/easy-markdown-editor/tree/master/cypress/e2e

As far as testing keyboard shortcuts I have not tried that.

[dwjohnston]

@Ionaru

I've written a guide for testing here: https://blacksheepcode.com/posts/testing_easy_mde

The main take away is:

• There's all sorts of difficulties testing when it's in inputStyle: "textarea" mode. It comes down to that there are two textareas - and the textarea that you can interact with won't always contain the full value of the text editor (eg. initial values), which can make for trouble when making assertions on content or form submissions.
• Contenteditable is much more reliable - but this wont' work in JSDOM based testing solutions like React Testing Library.