From 6dde0855d769a03a91ecd57fe34d5d9189fb0dc8 Mon Sep 17 00:00:00 2001 From: Yurii Zusik Date: Wed, 21 Oct 2020 11:28:00 +0300 Subject: [PATCH] fix(storefront): BCTHEME-297 Cornerstone 4.11.0 - Product Image Carousel Becomes Unresponsive on Product Page --- CHANGELOG.md | 1 + assets/js/theme/common/carousel.js | 11 ++++++++--- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 8f1f0a514f..1374299d88 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ # Changelog ## Draft +- Cornerstone 4.11.0 - Product Image Carousel Becomes Unresponsive on Product Page. [#1879](https://github.com/bigcommerce/cornerstone/pull/1879) - Unified browsers list that we support. [#1836](https://github.com/bigcommerce/cornerstone/pull/1836) - Bump stencil utils and update hooks to account for refactor to drop Jquery in stencil utils [#1821](https://github.com/bigcommerce/cornerstone/pull/1821) diff --git a/assets/js/theme/common/carousel.js b/assets/js/theme/common/carousel.js index e5d33bdd4b..a0e1bd0afb 100644 --- a/assets/js/theme/common/carousel.js +++ b/assets/js/theme/common/carousel.js @@ -51,13 +51,18 @@ export default function () { if ($carouselCollection.length === 0) return; - $carouselCollection.on('init', onCarouselChange); - $carouselCollection.on('afterChange', onCarouselChange); - $carouselCollection.each((index, carousel) => { // getting element using find to pass jest test const $carousel = $(document).find(carousel); + if ($carousel.hasClass('productView-thumbnails')) { + $carousel.slick(); + return; + } + + $carousel.on('init', onCarouselChange); + $carousel.on('afterChange', onCarouselChange); + const isMultipleSlides = $carousel.children().length > 1; const customPaging = isMultipleSlides ? () => (