tooltip.js 41.38 KiB
$(function () {
  'use strict';
  QUnit.module('tooltip plugin')
  QUnit.test('should be defined on jquery object', function (assert) {
    assert.expect(1)
    assert.ok($(document.body).tooltip, 'tooltip method is defined')
  })
  QUnit.module('tooltip', {
    beforeEach: function () {
      // Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
      $.fn.bootstrapTooltip = $.fn.tooltip.noConflict()
    afterEach: function () {
      $.fn.tooltip = $.fn.bootstrapTooltip
      delete $.fn.bootstrapTooltip
  QUnit.test('should provide no conflict', function (assert) {
    assert.expect(1)
    assert.strictEqual($.fn.tooltip, undefined, 'tooltip was set back to undefined (org value)')
  QUnit.test('should return jquery collection containing the element', function (assert) {
    assert.expect(2)
    var $el = $('<div/>')
    var $tooltip = $el.bootstrapTooltip()
    assert.ok($tooltip instanceof $, 'returns jquery collection')
    assert.strictEqual($tooltip[0], $el[0], 'collection contains element')
  QUnit.test('should expose default settings', function (assert) {
    assert.expect(1)
    assert.ok($.fn.bootstrapTooltip.Constructor.DEFAULTS, 'defaults is defined')
  QUnit.test('should empty title attribute', function (assert) {
    assert.expect(1)
    var $trigger = $('<a href="#" rel="tooltip" title="Another tooltip"/>').bootstrapTooltip()
    assert.strictEqual($trigger.attr('title'), '', 'title attribute was emptied')
  QUnit.test('should add data attribute for referencing original title', function (assert) {
    assert.expect(1)
    var $trigger = $('<a href="#" rel="tooltip" title="Another tooltip"/>').bootstrapTooltip()
    assert.strictEqual($trigger.attr('data-original-title'), 'Another tooltip', 'original title preserved in data attribute')
  QUnit.test('should add aria-describedby to the trigger on show', function (assert) {
    assert.expect(3)
    var $trigger = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
      .bootstrapTooltip()
      .appendTo('#qunit-fixture')
      .bootstrapTooltip('show')
    var id = $('.tooltip').attr('id')
    assert.strictEqual($('#' + id).length, 1, 'has a unique id')
    assert.strictEqual($('.tooltip').attr('aria-describedby'), $trigger.attr('id'), 'tooltip id and aria-describedby on trigger match')
    assert.ok($trigger[0].hasAttribute('aria-describedby'), 'trigger has aria-describedby')
  QUnit.test('should remove aria-describedby from trigger on hide', function (assert) {
    assert.expect(2)
    var $trigger = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
      .bootstrapTooltip()
      .appendTo('#qunit-fixture')
7172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
$trigger.bootstrapTooltip('show') assert.ok($trigger[0].hasAttribute('aria-describedby'), 'trigger has aria-describedby') $trigger.bootstrapTooltip('hide') assert.ok(!$trigger[0].hasAttribute('aria-describedby'), 'trigger does not have aria-describedby') }) QUnit.test('should assign a unique id tooltip element', function (assert) { assert.expect(2) $('<a href="#" rel="tooltip" title="Another tooltip"/>') .appendTo('#qunit-fixture') .bootstrapTooltip('show') var id = $('.tooltip').attr('id') assert.strictEqual($('#' + id).length, 1, 'tooltip has unique id') assert.strictEqual(id.indexOf('tooltip'), 0, 'tooltip id has prefix') }) QUnit.test('should place tooltips relative to placement option', function (assert) { assert.expect(2) var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') .appendTo('#qunit-fixture') .bootstrapTooltip({ placement: 'bottom' }) $tooltip.bootstrapTooltip('show') assert.ok($('.tooltip').is('.fade.bottom.in'), 'has correct classes applied') $tooltip.bootstrapTooltip('hide') assert.strictEqual($('.tooltip').length, 0, 'tooltip removed') }) QUnit.test('should allow html entities', function (assert) { assert.expect(2) var $tooltip = $('<a href="#" rel="tooltip" title="&lt;b&gt;@fat&lt;/b&gt;"/>') .appendTo('#qunit-fixture') .bootstrapTooltip({ html: true }) $tooltip.bootstrapTooltip('show') assert.notEqual($('.tooltip b').length, 0, 'b tag was inserted') $tooltip.bootstrapTooltip('hide') assert.strictEqual($('.tooltip').length, 0, 'tooltip removed') }) QUnit.test('should respect custom classes', function (assert) { assert.expect(2) var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') .appendTo('#qunit-fixture') .bootstrapTooltip({ template: '<div class="tooltip some-class"><div class="tooltip-arrow"/><div class="tooltip-inner"/></div>' }) $tooltip.bootstrapTooltip('show') assert.ok($('.tooltip').hasClass('some-class'), 'custom class is present') $tooltip.bootstrapTooltip('hide') assert.strictEqual($('.tooltip').length, 0, 'tooltip removed') }) QUnit.test('should fire show event', function (assert) { assert.expect(1) var done = assert.async() $('<div title="tooltip title"/>') .on('show.bs.tooltip', function () { assert.ok(true, 'show event fired') done() }) .bootstrapTooltip('show') })
141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
QUnit.test('should fire inserted event', function (assert) { assert.expect(2) var done = assert.async() $('<div title="tooltip title"/>') .appendTo('#qunit-fixture') .on('inserted.bs.tooltip', function () { assert.notEqual($('.tooltip').length, 0, 'tooltip was inserted') assert.ok(true, 'inserted event fired') done() }) .bootstrapTooltip('show') }) QUnit.test('should fire shown event', function (assert) { assert.expect(1) var done = assert.async() $('<div title="tooltip title"></div>') .appendTo('#qunit-fixture') .on('shown.bs.tooltip', function () { assert.ok(true, 'shown was called') done() }) .bootstrapTooltip('show') }) QUnit.test('should not fire shown event when show was prevented', function (assert) { assert.expect(1) var done = assert.async() $('<div title="tooltip title"/>') .on('show.bs.tooltip', function (e) { e.preventDefault() assert.ok(true, 'show event fired') done() }) .on('shown.bs.tooltip', function () { assert.ok(false, 'shown event fired') }) .bootstrapTooltip('show') }) QUnit.test('should fire hide event', function (assert) { assert.expect(1) var done = assert.async() $('<div title="tooltip title"/>') .appendTo('#qunit-fixture') .on('shown.bs.tooltip', function () { $(this).bootstrapTooltip('hide') }) .on('hide.bs.tooltip', function () { assert.ok(true, 'hide event fired') done() }) .bootstrapTooltip('show') }) QUnit.test('should fire hidden event', function (assert) { assert.expect(1) var done = assert.async() $('<div title="tooltip title"/>') .appendTo('#qunit-fixture') .on('shown.bs.tooltip', function () { $(this).bootstrapTooltip('hide') }) .on('hidden.bs.tooltip', function () {