[UXE-6389] Fix: disable browser back in the edge app config page

src/helpers/browser-back-button.js

@@ -0,0 +1,9 @@
+export const disabledBackButton = () => {
+  window.location.hash = 'no-back-button'
+
+  window.location.hash = 'Again-No-back-button'
+
+  window.onhashchange = function () {
+    window.location.hash = 'no-back-button'
+  }
+}

src/helpers/index.js

@@ -37,6 +37,7 @@ import FILTERS_RULES from './real-time-filters-rules'
 import { openGraphQlPlayground } from './open-graphql-playground.js'
 import { eventsPlaygroundOpener } from './events-playground-opener'
 import { setRedirectRoute, getRedirectRoute } from './login-redirect-manager'
+import { disabledBackButton } from './browser-back-button'
 
 export {
   InviteSession,
@@ -81,5 +82,6 @@ export {
   openGraphQlPlayground,
   eventsPlaygroundOpener,
   setRedirectRoute,
-  getRedirectRoute
+  getRedirectRoute,
+  disabledBackButton
 }

src/templates/dialog-unsaved-block/index.vue

@@ -1,8 +1,9 @@
 <script setup>
-  import { computed, ref, watch, inject } from 'vue'
+  import { computed, ref, watch, inject, onMounted } from 'vue'
   import PrimeDialog from 'primevue/dialog'
   import PrimeButton from 'primevue/button'
   import { onBeforeRouteLeave, useRouter } from 'vue-router'
+  import { disabledBackButton } from '@/helpers'
 
   defineOptions({ name: 'dialog-unsaved-block' })
   const emit = defineEmits(['update:visible'])
@@ -114,6 +115,10 @@
   watch(formDrawerHasUpdated, () => {
     openDialogUnsaved(true)
   })
+
+  onMounted(() => {
+    disabledBackButton()
+  })
 </script>
 
 <template>

src/tests/helpers/browser-back-button.test.js

@@ -0,0 +1,28 @@
+import { afterAll, describe, expect, it, vi } from 'vitest'
+import { disabledBackButton } from '@/helpers/browser-back-button'
+
+vi.stubGlobal('window', {
+  location: {
+    hash: ''
+  },
+  onhashchange: null
+})
+
+describe('disabledBackButton', () => {
+  afterAll(() => {
+    vi.unstubAllGlobals()
+  })
+  it('should update window.location.hash to "Again-No-back-button"', () => {
+    disabledBackButton()
+    expect(window.location.hash).toBe('Again-No-back-button')
+  })
+
+  it('should reset window.location.hash to "no-back-button" on hash change', () => {
+    disabledBackButton()
+
+    window.location.hash = 'some-other-hash'
+    window.onhashchange()
+
+    expect(window.location.hash).toBe('no-back-button')
+  })
+})