[CI 3890] switch beforeunload with visibilitychange (#346)

* change to pagehide

* change to visibilitychange

* update comment

* Address comments

* Add check when changed to visible

* lint

* Add visibilityState to tests

* lint

* combine if statements

Author: crgee1

spec/mocha.helpers.js

@@ -1,5 +1,6 @@
 /* eslint-disable import/no-unresolved, import/extensions */
 const qs = require('qs');
+const sinon = require('sinon');
 const store = require('../test/utils/store');
 
 // Trigger browser resize event
@@ -21,7 +22,8 @@ const triggerResize = () => {
 const triggerUnload = () => {
   const unloadEvent = document.createEvent('Event');
 
-  unloadEvent.initEvent('beforeunload', true, true);
+  unloadEvent.initEvent('visibilitychange', true, true);
+  sinon.stub(document, 'visibilityState').value('hidden');
 
   global.window.unload = () => {
     global.window.dispatchEvent(unloadEvent);

src/utils/request-queue.js

@@ -19,9 +19,18 @@ class RequestQueue {
       ? true
       : false; // Defaults to 'false'
 
-    // Mark if page environment is unloading
-    helpers.addEventListener('beforeunload', () => {
-      this.pageUnloading = true;
+    helpers.addEventListener('visibilitychange', () => {
+      // Mark if page environment is unloading
+      if (document.visibilityState === 'hidden') {
+        this.pageUnloading = true;
+      } else if (document.visibilityState === 'visible' && this.pageUnloading === true) {
+        // Send events once page is visible again
+        this.pageUnloading = false;
+
+        if (this.sendTrackingEvents) {
+          this.send();
+        }
+      }
     });
 
     if (this.sendTrackingEvents) {
@@ -183,7 +192,7 @@ class RequestQueue {
       if (this.options && this.options.trackingSendDelay === 0) {
         this.sendEvents();
       } else {
-        // Defer sending of events to give beforeunload time to register (avoids race condition)
+        // Defer sending of events to give visibilitychange time to register (avoids race condition)
         setTimeout(this.sendEvents.bind(this), (this.options && this.options.trackingSendDelay) || 250);
       }
     }