Use pull request #11259 from ncoden/test/minimize-interchange-debouce-test-race-condi...

4419192c2 fix: prevent to initialize Triggers twice before window is loaded
0e72c1e1f test: improve Interchange debounce test precision

Signed-off-by: Nicolas Coden <nicolas@ncoden.fr>

diff --git a/test/javascript/components/interchange.js b/test/javascript/components/interchange.js
index 6734b35762bfa18a4d3733a0efaaf088e288985b..5ef9fd9a357a954cc9a6fa2b42245d43f45423e3 100755 (executable)
--- a/test/javascript/components/interchange.js
+++ b/test/javascript/components/interchange.js
@@ -166,33 +166,41 @@ describe('Interchange', function() {
     });
   });
 
- describe('events()', function() {
-    it('calls reflow on viewport size change once', function(done) {
+  describe('events()', function () {
+    it('calls reflow on viewport size change once', function (done) {
       $html = $(generateTemplate('image')).appendTo('body');
       plugin = new Foundation.Interchange($html, {});
-      setTimeout(function() {
-        Foundation.IHearYou();
-      }, 1);
-      let spy = sinon.spy(plugin, '_reflow');
 
-      setTimeout(function() {
+      // Debounce: time Triggers is waiting for an other event without firing anything (10 by default)
+      const debounce = 10;
+      // Initialize Triggers manually to control and test the debounce time
+      Foundation.Triggers.Initializers.addMutationEventsListener($(document));
+      Foundation.Triggers.Initializers.addResizeListener(debounce);
+      $.triggersInitialized = true;
+
+      // Trigger several window resize synchrnously and asynchronously.
+      // ---
+      // Functions are nested to control when the check is made after the last resize
+      // more precisely (after 10ms). Timeout delays are most often not respected
+      // and the differences between several timeouts running in parrallel can be huge.
+      setTimeout(function () {
+        let spy = sinon.spy(plugin, '_reflow');
         $(window).trigger('resize');
-      }, 5);
-
-      setTimeout(function() {
         $(window).trigger('resize');
-      }, 10);
 
-      setTimeout(function() {
-        $(window).trigger('resize');
-      }, 20);
+        setTimeout(function () {
+          $(window).trigger('resize');
+          $(window).trigger('resize');
 
-      setTimeout(function() { // Wait for third trigger...
-        sinon.assert.calledOnce(spy);
-        done();
-      }, 50);
+          setTimeout(function () {
+            sinon.assert.calledOnce(spy);
+
+            $.triggersInitialized = false;
+            done();
+          }, debounce + 1);
+        });
+      });
     });
   });
 
-
 });