testing-library-react prints incorrect html for form when using screen.debug()

[gkiely]

Describe the bug When using screen.debug with the following code

import { render, screen } from '@testing-library/react';
import { test } from 'vitest';
test('render', () => {
  render(<form>
    <div>test</div>
    <input type="text" />
    <button>submit</button>
  </form>);
  screen.debug();
})

happy-dom

bound HTMLFormElement {
  "0": <input
    type="text"
  />,
  "1": <button>
    submit
  </button>,
}

jsdom

<form>
  <div>
    test
  </div>
  <input
    type="text"
  />
  <button>
    submit
  </button>
</form>

To Reproduce

1. git clone https://github.com/gkiely/vite-project
3. npm i
4. npm test # output for jsdom
5. Update package.json: "test": "vitest --environment happy-dom"
6. npm test # output for happy-dom

Expected behavior Should output all html in form

[gkiely]

happy to open an issue with react-testing-library, just wanted to check here first 😄

[gkiely]

Relevant code: https://github.com/testing-library/react-testing-library/blob/3dcd8a9649e25054c0e650d95fca2317b7008576/src/pure.js#L162

https://github.com/testing-library/dom-testing-library/blob/a86c54ccda5242ad8dfc1c70d31980bdbf96af7f/src/pretty-dom.js#L48