diff options
| author | fat <[email protected]> | 2015-05-07 22:26:40 -0700 |
|---|---|---|
| committer | fat <[email protected]> | 2015-05-07 22:26:40 -0700 |
| commit | 1b183e2ff796fc22aba8a8cac074a306c083d018 (patch) | |
| tree | ecc5298aab8d67841e0a765e44feb0b70c872050 /js/tests/unit | |
| parent | 660505188241418ffda53b5eb848defecd5f57e1 (diff) | |
| download | bootstrap-1b183e2ff796fc22aba8a8cac074a306c083d018.tar.xz bootstrap-1b183e2ff796fc22aba8a8cac074a306c083d018.zip | |
carousel -> es6
Diffstat (limited to 'js/tests/unit')
| -rw-r--r-- | js/tests/unit/carousel.js | 160 |
1 files changed, 80 insertions, 80 deletions
diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js index 39d250598..a8a36ad32 100644 --- a/js/tests/unit/carousel.js +++ b/js/tests/unit/carousel.js @@ -56,13 +56,13 @@ $(function () { + '<li data-target="#carousel-example-generic" data-slide-to="2"/>' + '</ol>' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<div class="carousel-caption"/>' + '</div>' + '</div>' @@ -76,16 +76,16 @@ $(function () { .one('slide.bs.carousel', function (e) { e.preventDefault() setTimeout(function () { - assert.ok($carousel.find('.item:eq(0)').is('.active'), 'first item still active') + assert.ok($carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active') assert.ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active') $carousel.bootstrapCarousel('next') }, 0) }) .one('slid.bs.carousel', function () { setTimeout(function () { - assert.ok(!$carousel.find('.item:eq(0)').is('.active'), 'first item still active') + assert.ok(!$carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active') assert.ok(!$carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active') - assert.ok($carousel.find('.item:eq(1)').is('.active'), 'second item active') + assert.ok($carousel.find('.carousel-item:eq(1)').is('.active'), 'second item active') assert.ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'), 'second indicator active') done() }, 0) @@ -97,7 +97,7 @@ $(function () { assert.expect(4) var carouselHTML = '<div id="myCarousel" class="carousel slide">' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>First Thumbnail label</h4>' @@ -106,7 +106,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Second Thumbnail label</h4>' @@ -115,7 +115,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Third Thumbnail label</h4>' @@ -152,7 +152,7 @@ $(function () { assert.expect(4) var carouselHTML = '<div id="myCarousel" class="carousel slide">' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>First Thumbnail label</h4>' @@ -161,7 +161,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Second Thumbnail label</h4>' @@ -170,7 +170,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Third Thumbnail label</h4>' @@ -207,7 +207,7 @@ $(function () { assert.expect(2) var template = '<div id="myCarousel" class="carousel slide">' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>First Thumbnail label</h4>' @@ -216,7 +216,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Second Thumbnail label</h4>' @@ -225,7 +225,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Third Thumbnail label</h4>' @@ -244,7 +244,7 @@ $(function () { $(template) .on('slide.bs.carousel', function (e) { assert.ok(e.relatedTarget, 'relatedTarget present') - assert.ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"') + assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"') done() }) .bootstrapCarousel('next') @@ -254,7 +254,7 @@ $(function () { assert.expect(2) var template = '<div id="myCarousel" class="carousel slide">' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>First Thumbnail label</h4>' @@ -263,7 +263,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Second Thumbnail label</h4>' @@ -272,7 +272,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Third Thumbnail label</h4>' @@ -291,7 +291,7 @@ $(function () { $(template) .on('slid.bs.carousel', function (e) { assert.ok(e.relatedTarget, 'relatedTarget present') - assert.ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"') + assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"') done() }) .bootstrapCarousel('next') @@ -301,7 +301,7 @@ $(function () { assert.expect(4) var templateHTML = '<div id="myCarousel" class="carousel slide">' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>First Thumbnail label</h4>' @@ -310,7 +310,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Second Thumbnail label</h4>' @@ -319,7 +319,7 @@ $(function () { + 'ultricies vehicula ut id elit.</p>' + '</div>' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '<div class="carousel-caption">' + '<h4>Third Thumbnail label</h4>' @@ -337,25 +337,25 @@ $(function () { $carousel.appendTo('body') $('[data-slide]').first().trigger('click') - assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814) + assert.strictEqual($carousel.data('bs.carousel')._config.interval, 1814) $carousel.remove() $carousel.appendTo('body').attr('data-modal', 'foobar') $('[data-slide]').first().trigger('click') - assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814, 'even if there is an data-modal attribute set') + assert.strictEqual($carousel.data('bs.carousel')._config.interval, 1814, 'even if there is an data-modal attribute set') $carousel.remove() $carousel.appendTo('body') $('[data-slide]').first().trigger('click') $carousel.attr('data-interval', 1860) $('[data-slide]').first().trigger('click') - assert.strictEqual($carousel.data('bs.carousel').options.interval, 1814, 'attributes should be read only on initialization') + assert.strictEqual($carousel.data('bs.carousel')._config.interval, 1814, 'attributes should be read only on initialization') $carousel.remove() $carousel.attr('data-interval', false) $carousel.appendTo('body') $carousel.bootstrapCarousel(1) - assert.strictEqual($carousel.data('bs.carousel').options.interval, false, 'data attribute has higher priority than default options') + assert.strictEqual($carousel.data('bs.carousel')._config.interval, false, 'data attribute has higher priority than default options') $carousel.remove() }) @@ -363,14 +363,14 @@ $(function () { assert.expect(2) var templateHTML = '<div id="myCarousel" class="carousel" data-interval="1814">' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<img alt="">' + '</div>' + '<script type="text/x-metamorph" id="thingy"/>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '</div>' + '</div>' + '</div>' @@ -378,25 +378,25 @@ $(function () { $template.bootstrapCarousel() - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') $template.bootstrapCarousel(1) - assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active') + assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active') }) QUnit.test('should skip over non-items when using next/prev methods', function (assert) { assert.expect(2) var templateHTML = '<div id="myCarousel" class="carousel" data-interval="1814">' + '<div class="carousel-inner">' - + '<div class="item active">' + + '<div class="carousel-item active">' + '<img alt="">' + '</div>' + '<script type="text/x-metamorph" id="thingy"/>' - + '<div class="item">' + + '<div class="carousel-item">' + '<img alt="">' + '</div>' - + '<div class="item">' + + '<div class="carousel-item">' + '</div>' + '</div>' + '</div>' @@ -404,24 +404,24 @@ $(function () { $template.bootstrapCarousel() - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') $template.bootstrapCarousel('next') - assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active') + assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active') }) QUnit.test('should go to previous item if left arrow key is pressed', function (assert) { assert.expect(2) var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">' + '<div class="carousel-inner">' - + '<div id="first" class="item">' + + '<div id="first" class="carousel-item">' + '<img alt="">' + '</div>' - + '<div id="second" class="item active">' + + '<div id="second" class="carousel-item active">' + '<img alt="">' + '</div>' - + '<div id="third" class="item">' + + '<div id="third" class="carousel-item">' + '<img alt="">' + '</div>' + '</div>' @@ -430,24 +430,24 @@ $(function () { $template.bootstrapCarousel() - assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active') + assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active') $template.trigger($.Event('keydown', { which: 37 })) - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') }) QUnit.test('should go to next item if right arrow key is pressed', function (assert) { assert.expect(2) var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">' + '<div class="carousel-inner">' - + '<div id="first" class="item active">' + + '<div id="first" class="carousel-item active">' + '<img alt="">' + '</div>' - + '<div id="second" class="item">' + + '<div id="second" class="carousel-item">' + '<img alt="">' + '</div>' - + '<div id="third" class="item">' + + '<div id="third" class="carousel-item">' + '<img alt="">' + '</div>' + '</div>' @@ -456,24 +456,24 @@ $(function () { $template.bootstrapCarousel() - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') $template.trigger($.Event('keydown', { which: 39 })) - assert.strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active') + assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active') }) QUnit.test('should support disabling the keyboard navigation', function (assert) { assert.expect(3) var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-keyboard="false">' + '<div class="carousel-inner">' - + '<div id="first" class="item active">' + + '<div id="first" class="carousel-item active">' + '<img alt="">' + '</div>' - + '<div id="second" class="item">' + + '<div id="second" class="carousel-item">' + '<img alt="">' + '</div>' - + '<div id="third" class="item">' + + '<div id="third" class="carousel-item">' + '<img alt="">' + '</div>' + '</div>' @@ -482,30 +482,30 @@ $(function () { $template.bootstrapCarousel() - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') $template.trigger($.Event('keydown', { which: 39 })) - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press') $template.trigger($.Event('keydown', { which: 37 })) - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press') }) QUnit.test('should ignore keyboard events within <input>s and <textarea>s', function (assert) { assert.expect(7) var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">' + '<div class="carousel-inner">' - + '<div id="first" class="item active">' + + '<div id="first" class="carousel-item active">' + '<img alt="">' + '<input type="text" id="in-put">' + '<textarea id="text-area"></textarea>' + '</div>' - + '<div id="second" class="item">' + + '<div id="second" class="carousel-item">' + '<img alt="">' + '</div>' - + '<div id="third" class="item">' + + '<div id="third" class="carousel-item">' + '<img alt="">' + '</div>' + '</div>' @@ -519,21 +519,21 @@ $(function () { $template.bootstrapCarousel() - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active') $input.trigger($.Event('keydown', { which: 39 })) - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <input>') $input.trigger($.Event('keydown', { which: 37 })) - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <input>') $textarea.trigger($.Event('keydown', { which: 39 })) - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after right arrow press in <textarea>') $textarea.trigger($.Event('keydown', { which: 37 })) - assert.strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>') + assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item still active after left arrow press in <textarea>') }) QUnit.test('should only add mouseenter and mouseleave listeners when not on mobile', function (assert) { @@ -541,13 +541,13 @@ $(function () { var isMobile = 'ontouchstart' in document.documentElement var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-pause="hover">' + '<div class="carousel-inner">' - + '<div id="first" class="item active">' + + '<div id="first" class="carousel-item active">' + '<img alt="">' + '</div>' - + '<div id="second" class="item">' + + '<div id="second" class="carousel-item">' + '<img alt="">' + '</div>' - + '<div id="third" class="item">' + + '<div id="third" class="carousel-item">' + '<img alt="">' + '</div>' + '</div>' @@ -568,13 +568,13 @@ $(function () { + '<li data-target="#carousel-example-generic" data-slide-to="2"/>' + '</ol>' + '<div class="carousel-inner">' - + '<div class="item active" id="one">' + + '<div class="carousel-item active" id="one">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="two">' + + '<div class="carousel-item" id="two">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="three">' + + '<div class="carousel-item" id="three">' + '<div class="carousel-caption"/>' + '</div>' + '</div>' @@ -582,7 +582,7 @@ $(function () { + '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>' + '</div>' var $carousel = $(carouselHTML) - var getActiveId = function () { return $carousel.find('.item.active').attr('id') } + var getActiveId = function () { return $carousel.find('.carousel-item.active').attr('id') } var done = assert.async() @@ -613,13 +613,13 @@ $(function () { + '<li data-target="#carousel-example-generic" data-slide-to="2"/>' + '</ol>' + '<div class="carousel-inner">' - + '<div class="item active" id="one">' + + '<div class="carousel-item active" id="one">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="two">' + + '<div class="carousel-item" id="two">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="three">' + + '<div class="carousel-item" id="three">' + '<div class="carousel-caption"/>' + '</div>' + '</div>' @@ -632,7 +632,7 @@ $(function () { $carousel .on('slid.bs.carousel', function () { - assert.strictEqual($carousel.find('.item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide') + assert.strictEqual($carousel.find('.carousel-item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide') done() }) .bootstrapCarousel('prev') @@ -647,13 +647,13 @@ $(function () { + '<li data-target="#carousel-example-generic" data-slide-to="2"/>' + '</ol>' + '<div class="carousel-inner">' - + '<div class="item active" id="one">' + + '<div class="carousel-item active" id="one">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="two">' + + '<div class="carousel-item" id="two">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="three">' + + '<div class="carousel-item" id="three">' + '<div class="carousel-caption"/>' + '</div>' + '</div>' @@ -661,7 +661,7 @@ $(function () { + '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>' + '</div>' var $carousel = $(carouselHTML) - var getActiveId = function () { return $carousel.find('.item.active').attr('id') } + var getActiveId = function () { return $carousel.find('.carousel-item.active').attr('id') } var done = assert.async() @@ -693,13 +693,13 @@ $(function () { + '<li data-target="#carousel-example-generic" data-slide-to="2"/>' + '</ol>' + '<div class="carousel-inner">' - + '<div class="item active" id="one">' + + '<div class="carousel-item active" id="one">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="two">' + + '<div class="carousel-item" id="two">' + '<div class="carousel-caption"/>' + '</div>' - + '<div class="item" id="three">' + + '<div class="carousel-item" id="three">' + '<div class="carousel-caption"/>' + '</div>' + '</div>' @@ -713,6 +713,6 @@ $(function () { assert.ok(false, 'carousel slid when it should not have slid') }) .bootstrapCarousel('prev') - assert.strictEqual($carousel.find('.item.active').attr('id'), 'one', 'carousel did not wrap around and stayed on 1st slide') + assert.strictEqual($carousel.find('.carousel-item.active').attr('id'), 'one', 'carousel did not wrap around and stayed on 1st slide') }) }) |
