Merge pull request #4310 from IgorA100/patch-833920

Fix: Firefox return to previous page (skin.js)

Author: connortechnology

web/skins/classic/js/skin.js

@@ -41,6 +41,7 @@ var icons = {
 var panZoomEnabled = true; //Add it to settings in the future
 var expiredTap; //Time between touch screen clicks. Used to analyze double clicks
 var shifted = ctrled = alted = false;
+var mainContent = document.getElementById('content');
 
 function checkSize() {
   if ( 0 ) {
@@ -1527,6 +1528,13 @@ function initPageGeneral() {
     alted = e.altKey;
   });
 
+  if (['montage', 'watch', 'devices', 'reports', 'monitorpreset', 'monitorprobe', 'onvifprobe', 'timeline'].includes(currentView)) {
+    mainContent = document.getElementById('page');
+  } else if (currentView == 'options') {
+    mainContent = document.getElementById('optionsContainer');
+  }
+  var mainContentJ = $j(mainContent);
+
   /* Assigning global handlers!
   ** IMPORTANT! It will not be possible to remove assigned handlers using the removeEventListener method, since the functions are anonymous
   */
@@ -1556,30 +1564,35 @@ function initPageGeneral() {
     });
   }, 200);
 
-  window.addEventListener('beforeunload', function(event) {
+  // https://web.dev/articles/bfcache Firefox has a peculiar behavior of caching the previous page.
+  window.addEventListener('pageshow', (event) => {
+    if (event.persisted) {
+      // Do any checks and updates to the page
+      if (mainContentJ[0].clientHeight < 1) {
+        window.location.reload( true );
+      }
+    }
+  });
+
+  window.addEventListener('beforeunload', function addListenerGlobalBeforeunload(event) {
     //event.preventDefault();
-    let target;
     /*
     if (!useOldMenuView) {
       closeMbExtruder(updateCookie = true);
     }
     */
-    if (['montage', 'watch', 'devices', 'reports', 'monitorpreset', 'monitorprobe', 'onvifprobe'].includes(currentView)) {
-      target = $j('#page');
-    } else if (currentView == 'options') {
-      target = $j('#optionsContainer');
-    } else {
-      target = $j('#content');
-    }
-    if (target.css('display') == 'flex') {
-      // If flex-grow is set to a value > 0 then "height" will be ignored!
-      target.css({flex: "0 1 auto"});
-    }
+    if (mainContentJ) {
+      if (mainContentJ.css('display') == 'flex') {
+        // If flex-grow is set to a value > 0 then "height" will be ignored!
+        mainContentJ.css({flex: "0 1 auto"});
+      }
 
-    target.animate({height: 0}, 300, function() {
-      $j('body').find('#btn-collapse').css({display: "none"});
-      target.css({display: "none"});
-    });
+      mainContentJ.animate({height: 0}, 300, function rollupBeforeunloadPage() {
+        const btnCollapse = $j('body').find('#btn-collapse');
+        if (btnCollapse) btnCollapse.css({display: "none"});
+        mainContentJ.css({display: "none"});
+      });
+    }
     //event.returnValue = '';
   });
 }