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 c79a388

Browse files
authored
feat: update @testing-library/dom (testing-library#125)
BREAKING CHANGE: The latest version of DOM Testing Library has several breaking changes, so you will want to review its changelog to ensure you are unaffected. Also, this release drops support for Node 8. Upgrade to Node 10 or greater.
1 parent 69261e2 commit c79a388

File tree

8 files changed

+555
-791
lines changed

8 files changed

+555
-791
lines changed

‎.prettierrc.js‎

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1 @@
1-
module.exports = {
2-
printWidth: 80,
3-
tabWidth: 2,
4-
useTabs: false,
5-
semi: false,
6-
singleQuote: true,
7-
trailingComma: 'all',
8-
bracketSpacing: false,
9-
jsxBracketSameLine: false,
10-
proseWrap: 'always',
11-
}
1+
module.exports = require('kcd-scripts/prettier')

‎.travis.yml‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ cache:
66
notifications:
77
email: false
88
node_js:
9-
- '8'
10-
- '10'
11-
- '12'
9+
- 10.18
10+
- 12
11+
- node
1212
install: npm install
1313
script: npm run validate
1414
after_success: kcd-scripts travis-after-success

‎package-lock.json‎

Lines changed: 479 additions & 715 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,9 @@
1212
"validate": "kcd-scripts validate",
1313
"setup": "npm install && npm run validate -s"
1414
},
15+
"engines": {
16+
"node": ">10.18"
17+
},
1518
"files": [
1619
"dist",
1720
"cleanup-after-each.js"
@@ -37,27 +40,27 @@
3740
"author": "Daniel Cook",
3841
"license": "MIT",
3942
"dependencies": {
40-
"@babel/runtime": "^7.8.4",
41-
"@testing-library/dom": "^6.13.0",
43+
"@babel/runtime": "^7.8.7",
44+
"@testing-library/dom": "^7.0.2",
4245
"@types/testing-library__vue": "*",
43-
"@vue/test-utils": "^1.0.0-beta.31"
46+
"@vue/test-utils": "^1.0.0-beta.32"
4447
},
4548
"devDependencies": {
4649
"@babel/plugin-transform-runtime": "^7.8.3",
4750
"@testing-library/jest-dom": "^5.1.1",
4851
"axios": "^0.19.2",
49-
"eslint-plugin-vue": "^6.2.1",
52+
"eslint-plugin-vue": "^6.2.2",
5053
"jest-serializer-vue": "^2.0.2",
51-
"kcd-scripts": "^5.3.0",
54+
"kcd-scripts": "^5.4.0",
5255
"lodash.merge": "^4.6.2",
5356
"vee-validate": "^2.2.15",
5457
"vue": "^2.6.11",
55-
"vue-i18n": "^8.15.4",
58+
"vue-i18n": "^8.15.5",
5659
"vue-jest": "^4.0.0-beta.2",
5760
"vue-router": "^3.1.6",
5861
"vue-template-compiler": "^2.6.11",
59-
"vuetify": "^2.2.15",
60-
"vuex": "^3.1.2"
62+
"vuetify": "^2.2.17",
63+
"vuex": "^3.1.3"
6164
},
6265
"peerDependencies": {
6366
"vue": "^2.6.10",

‎src/__tests__/disappearance.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,12 @@ test('waits for the data to be loaded', async () => {
1111

1212
// Following line reads as follows:
1313
// "Wait until element with text 'Loading...' is gone."
14-
await waitForElementToBeRemoved(()=>queryByText('Loading...'))
14+
await waitForElementToBeRemoved(getByText('Loading...'))
1515
// It is equivalent to:
1616
//
17-
// await wait(() => {
17+
// await waitFor(() => {
1818
// expect(queryByText('Loading...')).not.toBeInTheDocument()
1919
// })
20-
//
21-
// because `wait()` waits until the callback function passes or times out.
2220

2321
// After 'Loading...' is gone, we can assert that fetched data is rendered.
2422
expect(queryByTestId('message')).toHaveTextContent(/HelloWorld/)

‎src/__tests__/fire-event.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -159,13 +159,13 @@ test('triggers dblclick on doubleClick', async () => {
159159

160160
const {getByRole} = render({
161161
render(h) {
162-
return h('input', {
162+
return h('button', {
163163
on: {dblclick: spy},
164164
})
165165
},
166166
})
167167

168-
const elem = getByRole('textbox')
168+
const elem = getByRole('button')
169169

170170
await fireEvent.doubleClick(elem)
171171
expect(spy).toHaveBeenCalledTimes(1)

‎src/__tests__/stopwatch.js‎

Lines changed: 53 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,53 @@
1-
import '@testing-library/jest-dom'
2-
import {render, wait, fireEvent} from '@testing-library/vue'
3-
import StopWatch from './components/StopWatch.vue'
4-
5-
test('updates component state', async () => {
6-
const {getByTestId, getByText} = render(StopWatch)
7-
8-
const startButton = getByText('Start')
9-
const elapsedTime = getByTestId('elapsed')
10-
11-
// Assert initial state.
12-
expect(elapsedTime).toHaveTextContent('0ms')
13-
getByText('Start')
14-
15-
await fireEvent.click(startButton)
16-
17-
getByText('Stop')
18-
19-
// Wait for one tick of the event loop.
20-
await wait()
21-
22-
// Stop the timer.
23-
await fireEvent.click(startButton)
24-
25-
// We can't assert a specific amount of time. Instead, we assert that the
26-
// content has changed.
27-
expect(elapsedTime).not.toHaveTextContent('0ms')
28-
})
29-
30-
test('unmounts a component', async () => {
31-
jest.spyOn(console, 'error').mockImplementation(() => {})
32-
33-
const {unmount, isUnmounted, getByText} = render(StopWatch)
34-
await fireEvent.click(getByText('Start'))
35-
36-
// Destroys a Vue component instance.
37-
unmount()
38-
39-
expect(isUnmounted()).toBe(true)
40-
41-
await wait()
42-
43-
expect(console.error).not.toHaveBeenCalled()
44-
})
1+
import '@testing-library/jest-dom'
2+
import {render, waitFor, fireEvent} from '@testing-library/vue'
3+
import StopWatch from './components/StopWatch.vue'
4+
5+
const sleep = ms => new Promise(resolve => setTimeout(resolve, ms))
6+
7+
test('updates component state', async () => {
8+
const {getByTestId, getByText} = render(StopWatch)
9+
10+
const startButton = getByText('Start')
11+
const elapsedTime = getByTestId('elapsed')
12+
13+
// Assert initial state.
14+
expect(elapsedTime).toHaveTextContent('0ms')
15+
getByText('Start')
16+
17+
await fireEvent.click(startButton)
18+
19+
getByText('Stop')
20+
21+
// Wait for one tick of the event loop.
22+
await waitFor(() => {
23+
expect(elapsedTime).not.toHaveTextContent('0ms')
24+
})
25+
const timeBeforeStop = elapsedTime.textContent
26+
27+
// Stop the timer.
28+
await fireEvent.click(startButton)
29+
30+
// Wait for a few milliseconds
31+
await sleep(5)
32+
33+
// We can't assert a specific amount of time. Instead, we assert that the
34+
// content has changed.
35+
expect(elapsedTime).toHaveTextContent(timeBeforeStop)
36+
})
37+
38+
test('unmounts a component', async () => {
39+
jest.spyOn(console, 'error').mockImplementation(() => {})
40+
41+
const {unmount, isUnmounted, getByText} = render(StopWatch)
42+
await fireEvent.click(getByText('Start'))
43+
44+
// Destroys a Vue component instance.
45+
unmount()
46+
47+
expect(isUnmounted()).toBe(true)
48+
49+
// Wait for a few milliseconds
50+
await sleep(5)
51+
52+
expect(console.error).not.toHaveBeenCalled()
53+
})

‎src/vue-testing-library.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import {createLocalVue, mount} from '@vue/test-utils'
33
import {
44
getQueriesForElement,
55
logDOM,
6-
wait,
6+
waitFor,
77
fireEvent as dtlFireEvent,
88
} from '@testing-library/dom'
99

@@ -76,7 +76,7 @@ function render(
7676
emitted: () => wrapper.emitted(),
7777
updateProps: _ => {
7878
wrapper.setProps(_)
79-
return wait()
79+
return waitFor(()=>{})
8080
},
8181
...getQueriesForElement(baseElement),
8282
}
@@ -107,13 +107,13 @@ function cleanupAtWrapper(wrapper) {
107107
// More info: https://vuejs.org/v2/guide/reactivity.html#Async-Update-Queue
108108
async function fireEvent(...args) {
109109
dtlFireEvent(...args)
110-
await wait()
110+
await waitFor(()=>{})
111111
}
112112

113113
Object.keys(dtlFireEvent).forEach(key => {
114114
fireEvent[key] = async (...args) => {
115115
dtlFireEvent[key](...args)
116-
await wait()
116+
await waitFor(()=>{})
117117
}
118118
})
119119

0 commit comments

Comments
(0)

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