do not check hidden form's dirty state

Author: wxiaoguang

web_src/js/features/repo-issue-edit.ts

@@ -20,11 +20,9 @@ async function tryOnEditContent(e) {
   const rawContent = segment.querySelector('.raw-content');
 
   let comboMarkdownEditor : ComboMarkdownEditor;
-  let form: HTMLFormElement;
 
   const cancelAndReset = (e) => {
     e.preventDefault();
-    form.classList.add('ignore-dirty');
     showElem(renderContent);
     hideElem(editContentZone);
     comboMarkdownEditor.dropzoneReloadFiles();
@@ -51,8 +49,7 @@ async function tryOnEditContent(e) {
         showErrorToast(data.errorMessage);
         return;
       }
-      form.classList.remove('ignore-dirty'); // the form is no longer dirty
-      reinitializeAreYouSure(form);
+      reinitializeAreYouSure(editContentZone.querySelector('form')); // the form is no longer dirty
       editContentZone.setAttribute('data-content-version', data.contentVersion);
       if (!data.content) {
         renderContent.innerHTML = document.querySelector('#no-content').innerHTML;
@@ -91,7 +88,7 @@ async function tryOnEditContent(e) {
   comboMarkdownEditor = getComboMarkdownEditor(editContentZone.querySelector('.combo-markdown-editor'));
   if (!comboMarkdownEditor) {
     editContentZone.innerHTML = document.querySelector('#issue-comment-editor-template').innerHTML;
-    form = editContentZone.querySelector('form');
+    const form = editContentZone.querySelector('form');
     applyAreYouSure(form);
     const saveButton = querySingleVisibleElem<HTMLButtonElement>(editContentZone, '.ui.primary.button');
     const cancelButton = querySingleVisibleElem<HTMLButtonElement>(editContentZone, '.ui.cancel.button');
@@ -100,9 +97,6 @@ async function tryOnEditContent(e) {
     comboMarkdownEditor.container.addEventListener(ComboMarkdownEditor.EventUploadStateChanged, syncUiState);
     cancelButton.addEventListener('click', cancelAndReset);
     form.addEventListener('submit', saveAndRefresh);
-  } else {
-    form = editContentZone.querySelector('form');
-    form.classList.remove('ignore-dirty'); // the form is shown again, respect the "dirty" state
   }
 
   // FIXME: ideally here should reload content and attachment list from backend for existing editor, to avoid losing data

web_src/js/features/repo-issue.ts

@@ -538,7 +538,6 @@ export function initRepoIssueTitleEdit() {
   const issueTitleInput = issueTitleEditor.querySelector('input');
   const oldTitle = issueTitleInput.getAttribute('data-old-title');
   issueTitleDisplay.querySelector('#issue-title-edit-show').addEventListener('click', () => {
-    issueTitleEditor.classList.remove('ignore-dirty');
     hideElem(issueTitleDisplay);
     hideElem('#pull-desc-display');
     showElem(issueTitleEditor);
@@ -549,7 +548,6 @@ export function initRepoIssueTitleEdit() {
     issueTitleInput.focus();
   });
   issueTitleEditor.querySelector('.ui.cancel.button').addEventListener('click', () => {
-    issueTitleEditor.classList.add('ignore-dirty');
     hideElem(issueTitleEditor);
     hideElem('#pull-desc-editor');
     showElem(issueTitleDisplay);

web_src/js/vendor/jquery.are-you-sure.ts

@@ -162,10 +162,10 @@ export function initAreYouSure($) {
     if (!settings.silent && !window.aysUnloadSet) {
       window.aysUnloadSet = true;
       $(window).bind('beforeunload', function() {
-        const $dirtyForms = $("form:not(.ignore-dirty)").filter('.' + settings.dirtyClass);
-        if ($dirtyForms.length == 0) {
-          return;
-        }
+        const $forms = $("form:not(.ignore-dirty)").filter('.' + settings.dirtyClass);
+        const dirtyFormCount = Array.from($forms).reduce((res, form) => form.closest('.tw-hidden') ? res : res + 1, 0);
+        if (dirtyFormCount === 0) return;
+
         // Prevent multiple prompts - seen on Chrome and IE
         if (navigator.userAgent.toLowerCase().match(/msie|chrome/)) {
           if (window.aysHasPrompted) {