You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Debug should be able to watch for dom changes, so that we can put debug at the beginning of the test, and then have the latest dom represented at time of failure.
What and why you want to improve that feature
This is useful so that we don't need to move the debug statement around as the test fails.
Additionally, this is useful when using things like the find* operators with testing library when it is polling for changes.
Or when debugging tests.
Potential bugs/ unexpected behaviors
Possible unexpected behavior if the two modes are mixed.
I.e. having this "watch debug" in one place, and then have a non-watch debug statement later on.
How to implement the changes
We could use a MutationObserver on the document element to watch for changes.
Something like this
Others
@nvh95 is this project still active? I'd love to open a PR for this feature, but it seems like there are a few PRs that have been open for a long time.
The text was updated successfully, but these errors were encountered:
Debug should be able to watch for dom changes, so that we can put debug at the beginning of the test, and then have the latest dom represented at time of failure.
But in the meantime, you can use this setup to watch the dom changes whenever a test fails, thanks to @BrandonGoren #21 (comment)
import{debug}from'vitest-preview';import{cleanup}from'@testing-library/react';afterEach(context=>{// Run vitest-preview's debug if the test failsif(context?.meta?.result?.state==='fail'){debug();}// Clean up react-testing-library. We need to manually do this because we// turn off the automatic teardown in the vite.config.// This needs to happen after vitest-preview.cleanup();});
Another way is to call debug from the getElementError hook in the testing-library.
But if you want, you can open a PR at https://dom-preview.knappi.org/ which I developed as an alternative to vitest-preview. The setup is a little more complex though.
Which feature do you want to improve?
Debug should be able to watch for dom changes, so that we can put debug at the beginning of the test, and then have the latest dom represented at time of failure.
What and why you want to improve that feature
This is useful so that we don't need to move the debug statement around as the test fails.
Additionally, this is useful when using things like the
find*
operators with testing library when it is polling for changes.Or when debugging tests.
Potential bugs/ unexpected behaviors
Possible unexpected behavior if the two modes are mixed.
I.e. having this "watch debug" in one place, and then have a non-watch debug statement later on.
How to implement the changes
We could use a
MutationObserver
on the document element to watch for changes.Something like this
![image](https://private-user-images.githubusercontent.com/1237582/330522772-cc6be522-214b-406b-b809-e55cd3a34ab1.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjYwMjQ4MDAsIm5iZiI6MTcyNjAyNDUwMCwicGF0aCI6Ii8xMjM3NTgyLzMzMDUyMjc3Mi1jYzZiZTUyMi0yMTRiLTQwNmItYjgwOS1lNTVjZDNhMzRhYjEucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDkxMSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA5MTFUMDMxNTAwWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9M2VhMjY2ZWRmMDJjNDZiMDgwMzRlNjM0ZTNhZjQyN2Y3M2E0OWNhOTdkOTRlMGQ5MmUyNWE1NDUxNmE3OTNlNSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.KRmscDhRfVaUO4pEUNlsNbHyrtU13vclWq4_LSLkKe8)
Others
@nvh95 is this project still active? I'd love to open a PR for this feature, but it seems like there are a few PRs that have been open for a long time.
The text was updated successfully, but these errors were encountered: