aboutsummaryrefslogtreecommitdiff
path: root/js/tests
diff options
context:
space:
mode:
Diffstat (limited to 'js/tests')
-rw-r--r--js/tests/unit/carousel.js79
1 files changed, 79 insertions, 0 deletions
diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js
index 64d214462..6f0b9642f 100644
--- a/js/tests/unit/carousel.js
+++ b/js/tests/unit/carousel.js
@@ -399,6 +399,85 @@ $(function () {
strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
})
+ test('should go to previous item if left arrow key is pressed', function () {
+ var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
+ + '<div class="carousel-inner">'
+ + '<div id="first" class="item">'
+ + '<img alt="">'
+ + '</div>'
+ + '<div id="second" class="item active">'
+ + '<img alt="">'
+ + '</div>'
+ + '<div id="third" class="item">'
+ + '<img alt="">'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ var $template = $(templateHTML)
+
+ $template.bootstrapCarousel()
+
+ strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
+
+ $template.trigger($.Event('keydown', { which: 37 }))
+
+ strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+ })
+
+ test('should go to next item if right arrow key is pressed', function () {
+ var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false">'
+ + '<div class="carousel-inner">'
+ + '<div id="first" class="item active">'
+ + '<img alt="">'
+ + '</div>'
+ + '<div id="second" class="item">'
+ + '<img alt="">'
+ + '</div>'
+ + '<div id="third" class="item">'
+ + '<img alt="">'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ var $template = $(templateHTML)
+
+ $template.bootstrapCarousel()
+
+ strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+
+ $template.trigger($.Event('keydown', { which: 39 }))
+
+ strictEqual($template.find('.item')[1], $template.find('.active')[0], 'second item active')
+ })
+
+ test('should support disabling the keyboard navigation', function () {
+ var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-keyboard="false">'
+ + '<div class="carousel-inner">'
+ + '<div id="first" class="item active">'
+ + '<img alt="">'
+ + '</div>'
+ + '<div id="second" class="item">'
+ + '<img alt="">'
+ + '</div>'
+ + '<div id="third" class="item">'
+ + '<img alt="">'
+ + '</div>'
+ + '</div>'
+ + '</div>'
+ var $template = $(templateHTML)
+
+ $template.bootstrapCarousel()
+
+ strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item active')
+
+ $template.trigger($.Event('keydown', { which: 39 }))
+
+ strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after right arrow press')
+
+ $template.trigger($.Event('keydown', { which: 37 }))
+
+ strictEqual($template.find('.item')[0], $template.find('.active')[0], 'first item still active after left arrow press')
+ })
+
test('should only add mouseenter and mouseleave listeners when not on mobile', function () {
var isMobile = 'ontouchstart' in document.documentElement
var templateHTML = '<div id="myCarousel" class="carousel" data-interval="false" data-pause="hover">'