]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
Added unit tests for Tooltip. 9218/head
authorMarius Olbertz <marius.olbertz@gmail.com>
Fri, 30 Sep 2016 15:12:45 +0000 (17:12 +0200)
committerMarius Olbertz <marius.olbertz@gmail.com>
Fri, 30 Sep 2016 15:12:45 +0000 (17:12 +0200)
test/javascript/components/tooltip.js

index d680367a8ee09ec72cd6696231c010b1df27d588..b755ad75891d39768bdcb26d822ad2cfd7e27dde 100644 (file)
 describe('Tooltip', function() {
-       var plugin;
-       var $html;
-
-       // afterEach(function() {
-       //      plugin.destroy();
-       //      $html.remove();
-       // });
-
-       describe('constructor()', function() {
-               // it('', function() {
-               //      $html = $('').appendTo('body');
-               //      plugin = new Foundation.Tooltip($html, {});
-
-               //      plugin.$element.should.be.an('object');
-               //      plugin.options.should.be.an('object');
-               // });
-       });
+  var plugin;
+  var $html;
+  var template = `
+    <span data-tooltip aria-haspopup="true" class="has-tip" tabindex="1" title="TOOLTIP_CONTENT">
+      TEXT
+    </span>`;
+  Foundation.Tooltip.defaults.showOn = 'all';
+  Foundation.Tooltip.defaults.fadeOutDuration = 0;
+  Foundation.Tooltip.defaults.fadeInDuration = 0;
+
+  afterEach(function() {
+    plugin.destroy();
+    $html.remove();
+  });
+
+  describe('constructor()', function() {
+    it('stores the element and plugin options', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      plugin.$element.should.be.an('object');
+      plugin.options.should.be.an('object');
+    });
+  });
+
+  describe('init()', function() {
+
+    it('has value of title attribute as content', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      plugin.template.text().should.equal('TOOLTIP_CONTENT');
+    });
+
+    it('has value of tipText option as content', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {tipText: 'TOOLTIP_CONTENT_OPTION'});
+
+      plugin.template.text().should.equal('TOOLTIP_CONTENT_OPTION');
+    });
+
+    it('uses value of template option as template', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {template: '<div class="TEMPLATE_OPTION"></div>'});
+
+      plugin.template.should.have.class('TEMPLATE_OPTION');
+    });
+
+    it('uses value of triggerClass option as trigger class', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {triggerClass: 'TRIGGER_CLASS_OPTION'});
+
+      plugin.$element.should.have.class('TRIGGER_CLASS_OPTION');
+    });
+
+    it('sets ARIA attributes', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      plugin.$element.should.have.attr('aria-describedby', plugin.template.attr('id'));
+      plugin.template.should.have.attr('role', 'tooltip');
+    });
+
+  });
+
+  describe('buildTemplate()', function() {
+    it('uses value of templateClasses option as template class', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {templateClasses: 'TOOLTIP_CLASS_OPTION'});
+
+      plugin.template.should.have.class('TOOLTIP_CLASS_OPTION');
+    });
+  });
+
+  describe('show()', function() {
+    it('shows the tooltip', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      plugin.show();
+
+      plugin.template.should.be.visible;
+    });
+
+    it('fires show.zf.tooltip event', function(done) {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      $html.on('show.zf.tooltip', function() {
+        plugin.template.should.be.visible;
+        done();
+      });
+
+      plugin.show();
+    });
+  });
+
+  describe('hide()', function() {
+    it('hides the tooltip', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      // Show first
+      plugin.show();
+
+      plugin.hide();
+
+      plugin.template.should.be.hidden;
+    });
+
+    it('fires hide.zf.tooltip event', function(done) {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      // Open it first
+      plugin.show();
+
+      $html.on('hide.zf.tooltip', function() {
+        plugin.template.should.be.hidden;
+        done();
+      });
+
+      plugin.hide();
+    });
+  });
+
+  describe('toggle()', function() {
+    it('shows a hidden tooltip', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      plugin.toggle();
+      plugin.template.should.be.visible;
+    });
+    it('hides a visible tooltip', function() {
+      $html = $(template).appendTo('body');
+      plugin = new Foundation.Tooltip($html, {});
+
+      // Show first
+      plugin.show();
+
+      plugin.toggle();
+      plugin.template.should.be.hidden;
+    });
+  });
 
 });
\ No newline at end of file