From f4eed79845b78d5930da9aa0668a189fb7c0a9d7 Mon Sep 17 00:00:00 2001
From: Chloe Herd <chloe.herd@safelite.com>
Date: Wed, 8 Mar 2023 13:25:50 -0500
Subject: [PATCH] Cherry-pick: Tie changes to validation flow

---
 .../textbox-question/textbox-question.vue             | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/common-components/textbox-question/textbox-question.vue b/src/common-components/textbox-question/textbox-question.vue
index 5db64002e..84c936e24 100644
--- a/src/common-components/textbox-question/textbox-question.vue
+++ b/src/common-components/textbox-question/textbox-question.vue
@@ -123,8 +123,15 @@ export default {
     methods: {
         async submitImage(e) {
             await this.dispatchStoreAction(storeActions.LOOKUP_VIN_BY_IMAGE, e.target.files[0])
-                .then((response) => {
-                    document.getElementById(this.inputId).value = response.data;
+                .then(async (response) => {
+                    this.value = response.data.length > 0 ? response.data[0] : "";
+
+                    // Wait for DOM to update before firing change event to handle validation.
+                    await this.$nextTick();
+
+                    document.getElementById(this.inputId).dispatchEvent(
+                        new Event('change')
+                    );
                 })
                 .catch((error) => {
                     console.log(error);