expect().toContainHTML() doesn't work

[VSlobolinskyi]

• @testing-library/jest-dom version: 5.14.1
• node version: 14.15.4
• npm version: 6.14.13
• react-testing-library version: 11.2.7

Relevant code or config:

You could find everything in the repository in the todo.test.js file.

What you did:

Run npm run test.

What happened:

Reproduction:

Use the project from this repo, and change @testing-library/jest-dom to version: 5.14.1
https://github.com/VSlobolinskyi/react_testing

Problem description:

One of the core functionalities of jest is unavailable

Suggested solution:

Reference @testing-library/jest-dom: 5.11.8, this version doesn't have this bug. I use it in the repository(5.11.9 already has this bug)

[DevHusariaSolutions]

expect(element).not.toContainHTML()
    Expected:

    Received:
      <div data-testid=" (...)

Same for me. I just wanted to check is div not empty...

[vincent-thomas]

Vs code doesn't register any of the extra methods, but vitest registeres them?

[vincent-thomas]

Vs code doesn't register any of the extra methods, but vitest registeres them?

Whops fixed it, had to install the jest-dom types

[AndersonSMed]

Hello @VSlobolinskyi, I've seen that you are doing an assert using only the opening tag <strike> as the input to the toContainHTML matcher. What happens is that, from version 5.11.10 on, this matcher was updated so it could normalize any given html string (as you can see on this issue) and now when you do something like toContainHTML('<strike>'), the normalization makes the matcher looks for the existence of a <strike></strike> HTML in your rendered component. IMHO the normalization behavior looks more correctly then the previous one, as you were passing a invalid HTML string to the toContainHTML in first place.

Also, I would recommend you to replace the usage of this matcher by another one that mimics the way the user perceives the app, as it would fit more in the philosophy behind jest-dom (this is also an advice the maintainers give in the README).