Closed KonnorRogers closed 2 months ago
@testing-library/dom
https://github.com/testing-library/dom-testing-library/blob/edffb7c5ec2e4afd7f6bedf842c669ddbfb73297/src/DOMElementFilter.ts#L178
calling screen.debug()
Tried to make a sandbox, but the sandbox is outdated and doesnt work with custom elements.
Small snippet:
class MyElement extends HTMLElement {} window.customElements.define("my-element", class extends MyElement {}) window.customElements.get("my-element").name // => "" export default () => <my-element></my-element> test("Render app", () => { render(<App />) screen.debug() })
Current behavior is a massive string is printed out because it fails serialization
Don't check for "constructor.name" since you can have anonymous custom element class definitions.
@testing-library/dom
version: 8.16Relevant code or config:
https://github.com/testing-library/dom-testing-library/blob/edffb7c5ec2e4afd7f6bedf842c669ddbfb73297/src/DOMElementFilter.ts#L178
What you did:
calling screen.debug()
What happened:
Large console.log
``` Object { "__reactFiber$q3h0d1euq2": FiberNode { "_debugHookTypes": null, "_debugNeedsRemount": false, "_debugOwner": FiberNode { "_debugHookTypes": Array [ "useState", ], "_debugNeedsRemount": false, "_debugOwner": null, "_debugSource": Object { "columnNumber": 10, "fileName": "/Users/konnorrogers/projects/oss/shadow-dom-testing-library/__tests__/pretty-shadow-dom.test.tsx", "lineNumber": 28, }, "actualDuration": 0, "actualStartTime": -1, "alternate": null, "child": [Circular], "childLanes": 0, "deletions": null, "dependencies": null, "elementType": [Function], "flags": 1, "index": 0, "key": null, "lanes": 0, "memoizedProps": Object {}, "memoizedState": Object { "baseQueue": null, "baseState": 0, "memoizedState": 0, "next": null, "queue": Object { "dispatch": [Function], "interleaved": null, "lanes": 0, "lastRenderedReducer": [Function], "lastRenderedState": 0, "pending": null, }, }, "mode": 1, "pendingProps": Object {}, "ref": null, "return": FiberNode { "_debugHookTypes": null, "_debugNeedsRemount": false, "_debugOwner": null, "_debugSource": null, "actualDuration": 0, "actualStartTime": -1, "alternate": FiberNode { "_debugHookTypes": null, "_debugNeedsRemount": false, "_debugOwner": null, "_debugSource": null, "actualDuration": 0, "actualStartTime": -1, "alternate": [Circular], "child": null, "childLanes": 0, "deletions": null, "dependencies": null, "elementType": null, "flags": 0, "index": 0, "key": null, "lanes": 16, "memoizedProps": null, "memoizedState": Object { "cache": null, "element": null, "isDehydrated": false, "pendingSuspenseBoundaries": null, "transitions": null, }, "mode": 1, "pendingProps": null, "ref": null, "return": null, "selfBaseDuration": 0, "sibling": null, "stateNode": FiberRootNode { "_debugRootType": "createRoot()", "callbackNode": null, "callbackPriority": 0, "containerInfo":Reproduction:
Tried to make a sandbox, but the sandbox is outdated and doesnt work with custom elements.
Small snippet:
Problem description:
Current behavior is a massive string is printed out because it fails serialization
Suggested solution:
Don't check for "constructor.name" since you can have anonymous custom element class definitions.