Get offcanvas tests workign with new offcanvas implementation

diff --git a/test/javascript/components/offcanvas.js b/test/javascript/components/offcanvas.js
index 6df80d2ef353af6fc50fbe3e6cefd08ca521c7bd..4dcce0e903360115da9f47e38b87e0096cfc3b05 100644 (file)
--- a/test/javascript/components/offcanvas.js
+++ b/test/javascript/components/offcanvas.js
@@ -3,7 +3,7 @@ describe('Off Canvas', function() {
   var $html;
   var template = `<div class="off-canvas-wrapper">
       <div class="off-canvas-wrapper-inner" data-off-canvas-wrapper>
-        <div class="off-canvas position-left" id="offCanvas" data-off-canvas>
+        <div class="off-canvas position-left" id="offCanvas" data-off-canvas data-content-scroll="false">
 
           <!-- Close button -->
           <button class="close-button" aria-label="Close menu" type="button" data-close>
@@ -68,12 +68,12 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {closeOnClick: true});
 
-      plugin.$exiter.should.be.an('object');
+      plugin.$overlay.should.be.an('object');
 
-      $html.one(Foundation.transitionend($html), function() {
-        plugin.$exiter.trigger('click');
+      $html.one('opened.zf.offcanvas', function() {
+        plugin.$overlay.trigger('click');
         plugin.$element.should.not.have.class('is-open');
-        done();      
+        done();
       });
 
       plugin.open();
@@ -85,7 +85,8 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      $html.one(Foundation.transitionend($html), function() {
+      //$html.one(Foundation.transitionend($html), function() {
+      $html.one('opened.zf.offcanvas', function() {
         plugin.$triggers.should.have.attr('aria-expanded', 'true');
         plugin.$element.should.have.attr('aria-hidden', 'false');
         done();
@@ -98,10 +99,12 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      $html.one(Foundation.transitionend($html), function() {
-        plugin.$element.should.have.class('is-open');
-        $html.find('[data-off-canvas-wrapper]').should.have.class('is-off-canvas-open');
-        done();
+      $html.one('opened.zf.offcanvas', function() {
+        setTimeout(function() { 
+          plugin.$element.should.have.class('is-open');
+          $('body').should.have.class('is-off-canvas-open');
+          done();
+        }, 1);
       });
 
       plugin.open();
@@ -112,25 +115,16 @@ describe('Off Canvas', function() {
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {autoFocus: true});
 
 
-      $html.one(Foundation.transitionend($html), function() {
-        plugin.$element.should.have.attr('tabindex', '-1');
-        plugin.$element[0].should.be.equal(document.activeElement);
-        done();
-      });
-
-      plugin.open();      
-    });
-
-    it('sets tabindex attribute to -1 if trapFocus option is true', function(done) {
-      $html = $(template).appendTo('body');
-      plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {trapFocus: true});
-
-      $html.one(Foundation.transitionend($html), function() {
-        plugin.$element.should.have.attr('tabindex', '-1');
-        done();
+      plugin.$element.one(Foundation.transitionend(plugin.$element),function() {
+        setTimeout(function() {
+          plugin.$element.find('a, button')[0].should.be.equal(document.activeElement);
+          done();
+        }, 1);
       });
 
       plugin.open();
+      // fake transitionend for console tests
+      plugin.$element.triggerHandler(Foundation.transitionend(plugin.$element));
     });
 
 
@@ -138,10 +132,8 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      $html.on('opened.zf.offcanvas', function() {
-        $html.one(Foundation.transitionend($html), function() {
-          done();
-        });
+      $html.one('opened.zf.offcanvas', function() {
+        done();
       });
 
       plugin.open();
@@ -153,7 +145,7 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      $html.one(Foundation.transitionend($html), function() {
+      $html.one('opened.zf.offcanvas', function() {
         plugin.close();
 
         plugin.$triggers.should.have.attr('aria-expanded', 'false');
@@ -169,12 +161,14 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      $html.one(Foundation.transitionend($html), function() {
-        plugin.close();
+      $html.one('opened.zf.offcanvas', function() {
+        setTimeout(function() { 
+          plugin.close();
 
-        plugin.$element.should.not.have.class('is-open');
-        $html.find('[data-off-canvas-wrapper]').should.not.have.class('is-off-canvas-open');
-        done();
+          plugin.$element.should.not.have.class('is-open');
+          $('body').should.not.have.class('is-off-canvas-open');
+          done();
+        }, 1);
       });
 
       // Open it first
@@ -185,9 +179,9 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      
 
-      $html.one(Foundation.transitionend($html), function() {
+
+      $html.one('opened.zf.offcanvas', function() {
         $html.one('closed.zf.offcanvas', function() {
           done();
         });
@@ -205,7 +199,7 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      $html.one(Foundation.transitionend($html), function() {
+      $html.one('opened.zf.offcanvas', function() {
         plugin.$element.should.have.class('is-open');
         done();
       });
@@ -217,7 +211,7 @@ describe('Off Canvas', function() {
       $html = $(template).appendTo('body');
       plugin = new Foundation.OffCanvas($html.find('[data-off-canvas]'), {});
 
-      $html.one(Foundation.transitionend($html), function() {
+      $html.one('opened.zf.offcanvas', function() {
         plugin.toggle();
 
         plugin.$element.should.not.have.class('is-open');
@@ -229,4 +223,4 @@ describe('Off Canvas', function() {
     });
   });
 
-});
\ No newline at end of file
+});