Fix Carousel's touch option to not add touch listeners when set to false (#28046)

2 files changed, 18 insertions, 3 deletions

diff --git a/js/src/carousel.js b/js/src/carousel.js
index a43d86b18..06c20b509 100644
--- a/js/src/carousel.js
+++ b/js/src/carousel.js
@@ -268,7 +268,9 @@ class Carousel {
         .on(Event.MOUSELEAVE, (event) => this.cycle(event))
     }
 
-    this._addTouchEventListeners()
+    if (this._config.touch) {
+      this._addTouchEventListeners()
+    }
   }
 
   _addTouchEventListeners() {
diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js
index 6c28b6721..0d2a0f327 100644
--- a/js/tests/unit/carousel.js
+++ b/js/tests/unit/carousel.js
@@ -948,7 +948,7 @@ $(function () {
     $textArea.trigger(eventKeyDown)
   })
 
-  QUnit.test('Should not go to the next item when the carousel is not visible', function (assert) {
+  QUnit.test('should not go to the next item when the carousel is not visible', function (assert) {
     assert.expect(2)
     var done = assert.async()
     var html = '<div id="myCarousel" class="carousel slide" data-interval="50" style="display: none;">' +
@@ -985,7 +985,7 @@ $(function () {
     }, 80)
   })
 
-  QUnit.test('Should not go to the next item when the parent of the carousel is not visible', function (assert) {
+  QUnit.test('should not go to the next item when the parent of the carousel is not visible', function (assert) {
     assert.expect(2)
     var done = assert.async()
     var html = '<div id="parent" style="display: none;">' +
@@ -1317,4 +1317,17 @@ $(function () {
       done()
     }, 5)
   })
+
+  QUnit.test('should not add touch event listeners when touch option set to false', function (assert) {
+    assert.expect(1)
+
+    var spy = sinon.spy(Carousel.prototype, '_addTouchEventListeners')
+    var $carousel = $('<div class="carousel" data-ride="carousel" data-touch="false"></div>')
+
+    $carousel.appendTo('#qunit-fixture')
+    $carousel.bootstrapCarousel()
+
+    assert.strictEqual(spy.called, false)
+    spy.restore()
+  })
 })