Automatically cleanup if afterEach is detected

[afontcu]

Right now, users need to call afterEach(cleanup) or configure Jest to do so. This makes sure test run in isolation, but requires manual action.

---

As React Testing Library just did, we should probably automatically call cleanup if afterEach method exists.

RTL ended up offering two opt-out mechanisms (via custom import or using an env variable), but I'm not sure this is totally needed. I would keep the env variable (VTL_SKIP_AUTO_CLEANUP), but still have a single import point (instead of creating that "pure" version on VTL). Not a big deal, though.

So a PR (or several PRs) should:

• Automatically call afterEach(cleanup) if afterEach exists.
• Add an opt-out mechanism by using VTL_SKIP_AUTO_CLEANUP.
• Add tests asserting the behavior outlined above.
• Remove cleanup references from tests and docs.
• Replace cleanup-after-each with a warning (reference).
• State that the change is a breaking change (so that we take it into account when merging!).

After that, we'd need to update the official docs.

I'm marking this as a good first issue since details are outlined and the referenced PR from RTL makes a great starting point :)

[Oluwasetemi]

Can I jump on this

[afontcu]

Sure, go for it! 😊

[Oluwasetemi]

@afontcu can you please help me clarify some things.

1. I will call afterEach(cleanup) in the main vue-testing-library.js?
2. I don't know how to check if afterEach is called in a test?

[afontcu]

Hi! Sure!

The idea is to follow React Testing Library steps, so their Pull Request is gonna be really helpful.

1. Exactly, that's the main goal.
2. It's not about afterEach being called in a test, it's about checking if "afterEach" exists at all. Some test runners, such as Ava, do not have this function. Check the index file for React Testing Library.

I'd suggest going over that merged PR and trying to understand how are they handling the auto-cleanup.

[Oluwasetemi]

Currently going through the merged PR. I hope to send a PR when I get it all figure.

[afontcu]

great :) feel free to create a draft PR so we can discuss things over code.

[Oluwasetemi]

#80 have solved the first two concerns I think?

[afontcu]

@Oluwasetemi yes, looks great! :)

Next step is testing it out, and also I would add some comments explaining the feature. Something like the following:

"if the test runner supports afterEach, then we'll automatically run cleanup after each test. This ensures that tests run in isolation from each other. You can opt out of that behavior by setting VTL_SKIP_AUTO_CLEANUP env varible to 'true'."

[Oluwasetemi]

I just created 2 test files to check the auto-cleanup and the auto-cleanup-skip.

cc @dfcook @afontcu

[afontcu]

@Oluwasetemi perfect! I've added a few comments.

Next steps:

1. "Remove cleanup references from tests". It means that all tests provided in Vue Testing Library should not use cleanup() themselves.
2. "Replace cleanup-after-each with a warning". If someone is still importing cleanup-after-each.js after updating VTL, we should warn them that the file is deprecated and we might be removing it in future major releases. Similar to this.

Thank you! 🤗 It's looking really good.

[Oluwasetemi]

I have updated the PR