draft-data-save-fix (#1795)

* search for the correct id when sending autosave events w/ burnettk

* added cypress test for draft data autosave w/ burnettk

* added comment w/ burnettk

---------

Co-authored-by: jasquat <jasquat@users.noreply.github.com>

spiffworkflow-frontend/cypress/e2e/tasks.cy.js

@@ -1,9 +1,24 @@
-const submitInputIntoFormField = (taskName, fieldKey, fieldValue) => {
+const submitInputIntoFormField = (
+  taskName,
+  fieldKey,
+  fieldValue,
+  checkDraftData,
+) => {
   cy.contains(`Task: ${taskName}`, { timeout: 10000 });
   cy.get(fieldKey).clear();
   cy.get(fieldKey).type(fieldValue);
   // wait a little bit after typing for the debounce to take effect
   cy.wait(100);
+
+  // after a bit of a debounce period, the site automatically saves the data the user has been entering in user task forms.
+  // if that doesn't work, it's not great.
+  // so to test that, we reload the page and make sure the data they entered is not lost.
+  if (checkDraftData) {
+    cy.wait(1000);
+    cy.reload();
+    cy.get(fieldKey).should('have.value', fieldValue);
+  }
+
   cy.contains('Submit').click();
 };
 
@@ -19,7 +34,7 @@ const checkTaskHasClass = (taskName, className) => {
 const kickOffModelWithForm = () => {
   cy.navigateToProcessModel(
     'Acceptance Tests Group One',
-    'Acceptance Tests Model 2'
+    'Acceptance Tests Model 2',
   );
   cy.runPrimaryBpmnFile(true);
 };
@@ -41,7 +56,7 @@ describe('tasks', () => {
     cy.navigateToProcessModel(groupDisplayName, modelDisplayName);
     cy.runPrimaryBpmnFile(true);
 
-    submitInputIntoFormField('get_form_num_one', '#root_form_num_1', 2);
+    submitInputIntoFormField('get_form_num_one', '#root_form_num_1', 2, true);
     submitInputIntoFormField('get_form_num_two', '#root_form_num_2', 3);
 
     cy.contains('Task: get_form_num_three');

spiffworkflow-frontend/src/routes/TaskShow.tsx

@@ -161,8 +161,11 @@ export default function TaskShow() {
   };
 
   const sendAutosaveEvent = (eventDetails?: any) => {
+    if (!taskWithTaskData) {
+      return;
+    }
     const elementToDispath: any = document.getElementById(
-      'hidden-form-for-autosave',
+      `hidden-form-for-autosave-${taskWithTaskData.guid}`,
     );
     if (elementToDispath) {
       elementToDispath.dispatchEvent(