From b6eae4f732191c533664deb552c69aa387cbc067 Mon Sep 17 00:00:00 2001
From: Jesse Knowles <jknowles@westjet.com>
Date: Mon, 23 Nov 2020 16:53:35 -0700
Subject: [PATCH] Make fireEvent.update work with lazy modifier

- switched to use change event if lazy modifier is found on element
- updated form unit test to test lazy input and textarea
---
 src/__tests__/components/Form.vue | 15 +++++++++++++++
 src/__tests__/form.js             |  8 ++++++++
 src/vue-testing-library.js        |  6 ++++++
 3 files changed, 29 insertions(+)

diff --git a/src/__tests__/components/Form.vue b/src/__tests__/components/Form.vue
index 09f0c5e5..db3593ff 100644
--- a/src/__tests__/components/Form.vue
+++ b/src/__tests__/components/Form.vue
@@ -5,6 +5,9 @@
       <label for="movie-input">Title of the movie</label>
       <input id="movie-input" v-model="title" name="title" />
 
+      <label for="director-input">Director of the movie</label>
+      <input id="director-input" v-model.lazy="director" name="director" />
+
       <label id="review-textarea">Your review</label>
       <textarea
         v-model="review"
@@ -13,6 +16,14 @@
         aria-labelledby="review-textarea"
       />
 
+      <label id="notes-textarea">Add some notes</label>
+      <textarea
+        v-model.lazy="notes"
+        name="notes-textarea"
+        placeholder="Add some notes"
+        aria-labelledby="notes-textarea"
+      />
+
       <label>
         <input v-model="rating" type="radio" value="3" />
         Wonderful
@@ -46,7 +57,9 @@ export default {
   data() {
     return {
       title: '',
+      director: '',
       review: '',
+      notes: '',
       rating: '1',
       recommend: false,
     }
@@ -63,7 +76,9 @@ export default {
 
       this.$emit('submit', {
         title: this.title,
+        director: this.director,
         review: this.review,
+        notes: this.notes,
         rating: this.rating,
         recommend: this.recommend,
       })
diff --git a/src/__tests__/form.js b/src/__tests__/form.js
index 8b48ec01..bea24490 100644
--- a/src/__tests__/form.js
+++ b/src/__tests__/form.js
@@ -11,7 +11,9 @@ test('Review form submits', async () => {
   jest.spyOn(console, 'warn').mockImplementation(() => {})
   const fakeReview = {
     title: 'An Awesome Movie',
+    director: 'Stephen Spielberg',
     review: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
+    notes: 'Add something',
     rating: '3',
   }
 
@@ -31,9 +33,15 @@ test('Review form submits', async () => {
   const titleInput = getByLabelText(/title of the movie/i)
   await fireEvent.update(titleInput, fakeReview.title)
 
+  const directorInput = getByLabelText(/director of the movie/i)
+  await fireEvent.update(directorInput, fakeReview.director)
+
   const reviewTextarea = getByPlaceholderText('Write an awesome review')
   await fireEvent.update(reviewTextarea, fakeReview.review)
 
+  const notesTextarea = getByPlaceholderText('Add some notes')
+  await fireEvent.update(notesTextarea, fakeReview.notes)
+
   // Rating Radio buttons.
   const initiallySelectedInput = getByLabelText('Awful')
   const ratingSelect = getByLabelText('Wonderful')
diff --git a/src/vue-testing-library.js b/src/vue-testing-library.js
index 89dcdc04..185ff418 100644
--- a/src/vue-testing-library.js
+++ b/src/vue-testing-library.js
@@ -160,12 +160,18 @@ fireEvent.update = (elem, value) => {
         return fireEvent.change(elem)
       } else {
         elem.value = value
+        if (elem._vModifiers && elem._vModifiers.lazy) {
+          return fireEvent.change(elem)
+        }
         return fireEvent.input(elem)
       }
     }
 
     case 'TEXTAREA': {
       elem.value = value
+      if (elem._vModifiers && elem._vModifiers.lazy) {
+        return fireEvent.change(elem)
+      }
       return fireEvent.input(elem)
     }