Fix areYouSure confirm (#32941)

See the comment

Author: wxiaoguang

web_src/js/features/common-fetch-action.ts

@@ -3,6 +3,7 @@ import {showErrorToast} from '../modules/toast.ts';
 import {addDelegatedEventListener, submitEventSubmitter} from '../utils/dom.ts';
 import {confirmModal} from './comp/ConfirmModal.ts';
 import type {RequestOpts} from '../types.ts';
+import {ignoreAreYouSure} from '../vendor/jquery.are-you-sure.ts';
 
 const {appSubUrl, i18n} = window.config;
 
@@ -27,7 +28,7 @@ async function fetchActionDoRequest(actionElem: HTMLElement, url: string, opt: R
     if (resp.status === 200) {
       let {redirect} = await resp.json();
       redirect = redirect || actionElem.getAttribute('data-redirect');
-      actionElem.classList.remove('dirty'); // remove the areYouSure check before reloading
+      ignoreAreYouSure(actionElem); // ignore the areYouSure check before reloading
       if (redirect) {
         fetchActionDoRedirect(redirect);
       } else {

web_src/js/features/repo-editor.ts

@@ -6,7 +6,7 @@ import {attachRefIssueContextPopup} from './contextpopup.ts';
 import {POST} from '../modules/fetch.ts';
 import {initDropzone} from './dropzone.ts';
 import {confirmModal} from './comp/ConfirmModal.ts';
-import {applyAreYouSure} from '../vendor/jquery.are-you-sure.ts';
+import {applyAreYouSure, ignoreAreYouSure} from '../vendor/jquery.are-you-sure.ts';
 import {fomanticQuery} from '../modules/fomantic/base.ts';
 
 function initEditPreviewTab(elForm: HTMLFormElement) {
@@ -188,7 +188,7 @@ export function initRepoEditor() {
           header: elForm.getAttribute('data-text-empty-confirm-header'),
           content: elForm.getAttribute('data-text-empty-confirm-content'),
         })) {
-          elForm.classList.remove('dirty');
+          ignoreAreYouSure(elForm);
           elForm.submit();
         }
       }

web_src/js/features/repo-issue.ts

@@ -16,6 +16,7 @@ import {GET, POST} from '../modules/fetch.ts';
 import {showErrorToast} from '../modules/toast.ts';
 import {initRepoIssueSidebar} from './repo-issue-sidebar.ts';
 import {fomanticQuery} from '../modules/fomantic/base.ts';
+import {ignoreAreYouSure} from '../vendor/jquery.are-you-sure.ts';
 
 const {appSubUrl} = window.config;
 
@@ -578,7 +579,7 @@ export function initRepoIssueTitleEdit() {
           }
         }
       }
-      issueTitleEditor.classList.remove('dirty');
+      ignoreAreYouSure(issueTitleEditor);
       window.location.reload();
     } catch (error) {
       console.error(error);

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

@@ -204,3 +204,9 @@ export function applyAreYouSure(selectorOrEl: string|Element|$, opts = {}) {
 export function reinitializeAreYouSure(selectorOrEl: string|Element|$) {
   $(selectorOrEl).trigger('reinitialize.areYouSure');
 }
+
+export function ignoreAreYouSure(selectorOrEl: string|Element|$) {
+  // here we should only add "ignore-dirty" but not remove "dirty".
+  // because when using "enter" to submit a form, the "dirty" class will appear again before reloading.
+  $(selectorOrEl).addClass('ignore-dirty');
+}