Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 394bde7

Browse files
Oluwasetemiafontcu
authored andcommitted
feat(cleanup): automatically cleanup if afterEach is detected (testing-library#80)
You can disable this with the VTL_SKIP_CLEANUP environment variable, but it's recommended to have cleanup work this way. Closes testing-library#77 BREAKING CHANGE: If your tests were not isolated before (and you referenced the same component between tests) then this change will break your tests. You should keep your tests isolated, but if you're unable/unwilling to do that right away, then you can run your tests with the environment variable VTL_SKIP_AUTO_CLEANUP set to true.
1 parent 297c1c1 commit 394bde7

File tree

13 files changed

+81
-32
lines changed

13 files changed

+81
-32
lines changed

‎cleanup-after-each.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,3 @@
1-
afterEach(require('./dist/vue-testing-library').cleanup)
1+
console.warn(
2+
'The module `@testing-library/vue/cleanup-after-each` has been deprecated and no longer does anything (it is not needed). You no longer need to import this module and can safely remove any import or configuration which imports this module',
3+
)

‎src/__tests__/auto-cleanup-skip.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
let render
2+
beforeAll(async () => {
3+
process.env.VTL_SKIP_AUTO_CLEANUP = 'true'
4+
const vtl = await require('@testing-library/vue')
5+
render = vtl.render
6+
})
7+
8+
// This one verifies that if VTL_SKIP_AUTO_CLEANUP is set
9+
// then we DON'T auto-wire up the afterEach for folks
10+
test('first test render a vue component', () => {
11+
render({
12+
template: `<h1>Hello World</h1>`,
13+
})
14+
15+
expect(document.body.innerHTML).toMatchInlineSnapshot(`
16+
<div>
17+
<h1>Hello World</h1>
18+
</div>
19+
`)
20+
})
21+
22+
test('no cleanup should have happened, renders the first component still', () => {
23+
expect(document.body.innerHTML).toMatchInlineSnapshot(`
24+
<div>
25+
<h1>Hello World</h1>
26+
</div>
27+
`)
28+
})

‎src/__tests__/auto-cleanup.js‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import {render} from '@testing-library/vue'
2+
import '@testing-library/jest-dom/extend-expect'
3+
4+
// This just verifies that by importing VTL in an
5+
// environment which supports afterEach (like jest)
6+
// we'll get automatic cleanup between tests.
7+
test('render the first component', () => {
8+
render({
9+
template: `<h1>Hello World</h1>`,
10+
})
11+
expect(document.body.innerHTML).toMatchInlineSnapshot(`
12+
<div>
13+
<h1>Hello World</h1>
14+
</div>
15+
`)
16+
})
17+
18+
test('cleans up after each test by default', () => {
19+
expect(document.body.innerHTML).toMatchInlineSnapshot(`""`)
20+
})

‎src/__tests__/debug.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
1-
import {cleanup,render} from '@testing-library/vue'
1+
import {render} from '@testing-library/vue'
22
import HelloWorld from './components/HelloWorld'
33

44
beforeEach(() => {
55
jest.spyOn(console, 'log').mockImplementation(() => {})
66
})
77

88
afterEach(() => {
9-
cleanup()
109
console.log.mockRestore()
1110
})
1211

‎src/__tests__/functional.js‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {cleanup,render} from '@testing-library/vue'
1+
import {render} from '@testing-library/vue'
22
import FunctionalSFC from './components/FunctionalSFC'
33

44
const Functional = {
@@ -8,15 +8,13 @@ const Functional = {
88
},
99
}
1010

11-
afterEach(cleanup)
12-
13-
it('renders functional comp', () => {
11+
test('renders functional comp', () => {
1412
const {getByText} = render(Functional)
1513

1614
getByText('Hi!')
1715
})
1816

19-
it('renders functional SFC comp', () => {
17+
test('renders functional SFC comp', () => {
2018
const {getByText} = render(FunctionalSFC)
2119

2220
getByText('Hi!')

‎src/__tests__/simple-button.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
1-
import {render, cleanup,fireEvent} from '@testing-library/vue'
1+
import {render, fireEvent} from '@testing-library/vue'
22
import Button from './components/Button'
33
import '@testing-library/jest-dom/extend-expect'
44

5-
afterEach(cleanup)
6-
75
test('renders button with text', () => {
86
const text = "Click me; I'm sick"
97

‎src/__tests__/stopwatch.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
1-
import {cleanup,render, wait, fireEvent} from '@testing-library/vue'
1+
import {render, wait, fireEvent} from '@testing-library/vue'
22
import StopWatch from './components/StopWatch.vue'
33
import '@testing-library/jest-dom/extend-expect'
44

5-
afterEach(cleanup)
6-
75
test('unmounts a component', async () => {
86
jest.spyOn(console, 'error').mockImplementation(() => {})
97

‎src/__tests__/stubs.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
1-
import {render,cleanup} from '@testing-library/vue'
1+
import {render} from '@testing-library/vue'
22
import Stubs from './components/Stubs'
33

4-
afterEach(cleanup)
5-
64
test('Form contains search button', () => {
75
const {getByText} = render(Stubs, {
86
stubs: ['FontAwesomeIcon'],

‎src/__tests__/vue-router.js‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import '@testing-library/jest-dom/extend-expect'
2+
import {render, fireEvent} from '@testing-library/vue'
23

3-
import {cleanup, render, fireEvent} from '@testing-library/vue'
44
import App from './components/Router/App.vue'
55
import Home from './components/Router/Home.vue'
66
import About from './components/Router/About.vue'
@@ -11,8 +11,6 @@ const routes = [
1111
{path: '*', redirect: '/about'},
1212
]
1313

14-
afterEach(cleanup)
15-
1614
test('full app rendering/navigating', async () => {
1715
// Notice how we pass a `routes` object to our render function.
1816
const {queryByTestId} = render(App, {routes})

‎src/__tests__/vueI18n.js‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,8 @@
11
import '@testing-library/jest-dom/extend-expect'
2-
import {cleanup,render, fireEvent} from '@testing-library/vue'
2+
import {render, fireEvent} from '@testing-library/vue'
33
import Vuei18n from 'vue-i18n'
44
import VueI18n from './components/VueI18n'
55

6-
afterEach(cleanup)
7-
86
const messages = {
97
en: {
108
Hello: 'Hello',
@@ -14,15 +12,19 @@ const messages = {
1412
},
1513
}
1614

17-
test('can render en and ja text in header', async () => {
15+
test('renders translations', async () => {
1816
const {queryByText, getByText} = render(VueI18n, {}, vue => {
17+
// Let's register Vuei18n normally
1918
vue.use(Vuei18n)
19+
2020
const i18n = new Vuei18n({
2121
locale: 'en',
2222
fallbackLocale: 'en',
2323
messages,
2424
})
25-
//return i18n object so that it will be available as an additional option on the created vue instance
25+
26+
// Notice how we return an object from the callback function. It will be
27+
// available as an additional option on the created Vue instance.
2628
return {i18n}
2729
})
2830

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /