Commit 853d998

kinoliJesse Knowles

and

Jesse Knowles

authored

fix: Make fireEvent.update work with lazy modifier (#183)

- switched to use change event if lazy modifier is found on element - updated form unit test to test lazy input and textarea Co-authored-by: Jesse Knowles <jknowles@westjet.com>

1 parent 4376e64 commit 853d998Copy full SHA for 853d998

File tree

3 files changed

+29

-0

lines changed

src
- __tests__
  - components
    - Form.vue
  - form.js
- vue-testing-library.js

3 files changed

+29

-0

lines changed

`‎src/tests/components/Form.vue`

Lines changed: 15 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -5,6 +5,9 @@`
`5`	`5`	`<label for="movie-input">Title of the movie</label>`
`6`	`6`	`<input id="movie-input" v-model="title" name="title" />`
`7`	`7`
	`8`	`+ <label for="director-input">Director of the movie</label>`
	`9`	`+ <input id="director-input" v-model.lazy="director" name="director" />`
	`10`	`+`
`8`	`11`	`<label id="review-textarea">Your review</label>`
`9`	`12`	`<textarea`
`10`	`13`	`v-model="review"`
`@@ -13,6 +16,14 @@`
`13`	`16`	`aria-labelledby="review-textarea"`
`14`	`17`	`/>`
`15`	`18`
	`19`	`+ <label id="notes-textarea">Add some notes</label>`
	`20`	`+ <textarea`
	`21`	`+ v-model.lazy="notes"`
	`22`	`+ name="notes-textarea"`
	`23`	`+ placeholder="Add some notes"`
	`24`	`+ aria-labelledby="notes-textarea"`
	`25`	`+ />`
	`26`	`+`
`16`	`27`	`<label>`
`17`	`28`	`<input v-model="rating" type="radio" value="3" />`
`18`	`29`	`Wonderful`
`@@ -46,7 +57,9 @@ export default {`
`46`	`57`	`data() {`
`47`	`58`	`return {`
`48`	`59`	`title: '',`
	`60`	`+ director: '',`
`49`	`61`	`review: '',`
	`62`	`+ notes: '',`
`50`	`63`	`rating: '1',`
`51`	`64`	`recommend: false,`
`52`	`65`	`}`
`@@ -63,7 +76,9 @@ export default {`
`63`	`76`
`64`	`77`	`this.$emit('submit', {`
`65`	`78`	`title: this.title,`
	`79`	`+ director: this.director,`
`66`	`80`	`review: this.review,`
	`81`	`+ notes: this.notes,`
`67`	`82`	`rating: this.rating,`
`68`	`83`	`recommend: this.recommend,`
`69`	`84`	`})`

`‎src/tests/form.js`

Lines changed: 8 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -11,7 +11,9 @@ test('Review form submits', async () => {`
`11`	`11`	`jest.spyOn(console, 'warn').mockImplementation(() => {})`
`12`	`12`	`const fakeReview = {`
`13`	`13`	`title: 'An Awesome Movie',`
	`14`	`+ director: 'Stephen Spielberg',`
`14`	`15`	`review: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',`
	`16`	`+ notes: 'Add something',`
`15`	`17`	`rating: '3',`
`16`	`18`	`}`
`17`	`19`
`@@ -31,9 +33,15 @@ test('Review form submits', async () => {`
`31`	`33`	`const titleInput = getByLabelText(/titleofthemovie/i)`
`32`	`34`	`await fireEvent.update(titleInput, fakeReview.title)`
`33`	`35`
	`36`	`+ const directorInput = getByLabelText(/directorofthemovie/i)`
	`37`	`+ await fireEvent.update(directorInput, fakeReview.director)`
	`38`	`+`
`34`	`39`	`const reviewTextarea = getByPlaceholderText('Write an awesome review')`
`35`	`40`	`await fireEvent.update(reviewTextarea, fakeReview.review)`
`36`	`41`
	`42`	`+ const notesTextarea = getByPlaceholderText('Add some notes')`
	`43`	`+ await fireEvent.update(notesTextarea, fakeReview.notes)`
	`44`	`+`
`37`	`45`	`// Rating Radio buttons.`
`38`	`46`	`const initiallySelectedInput = getByLabelText('Awful')`
`39`	`47`	`const ratingSelect = getByLabelText('Wonderful')`

`‎src/vue-testing-library.js`

Lines changed: 6 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -160,12 +160,18 @@ fireEvent.update = (elem, value) => {`
`160`	`160`	`return fireEvent.change(elem)`
`161`	`161`	`} else {`
`162`	`162`	`elem.value = value`
	`163`	`+ if (elem._vModifiers && elem._vModifiers.lazy) {`
	`164`	`+ return fireEvent.change(elem)`
	`165`	`+ }`
`163`	`166`	`return fireEvent.input(elem)`
`164`	`167`	`}`
`165`	`168`	`}`
`166`	`169`
`167`	`170`	`case 'TEXTAREA': {`
`168`	`171`	`elem.value = value`
	`172`	`+ if (elem._vModifiers && elem._vModifiers.lazy) {`
	`173`	`+ return fireEvent.change(elem)`
	`174`	`+ }`
`169`	`175`	`return fireEvent.input(elem)`
`170`	`176`	`}`
`171`	`177`

0 commit comments

Comments

(0)

Navigation Menu

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

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Commit 853d998

File tree

3 files changed

3 files changed

`‎src/tests/components/Form.vue`

`‎src/tests/form.js`

`‎src/vue-testing-library.js`

0 commit comments

File tree

3 files changed

3 files changed

‎src/__tests__/components/Form.vue

‎src/__tests__/form.js

‎src/vue-testing-library.js

0 commit comments

`‎src/tests/components/Form.vue`

`‎src/tests/form.js`

`‎src/vue-testing-library.js`