NEXT-37512 - Fix cms product slider offsetWidth error

fixes shopware#3823
pweyck · Aug 2, 2024 · 56829b4 · 56829b4
1 parent 13be071
commit 56829b4
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/changelog/_unreleased/2024-07-30-fix-cms-product-slider-offset-width-error.md b/changelog/_unreleased/2024-07-30-fix-cms-product-slider-offset-width-error.md
@@ -0,0 +1,9 @@
+---
+title: Fix cms product slider offsetWidth error
+issue: NEXT-00000
+author: Elias Lackner
+author_email: [email protected]
+author_github: @lacknere
+---
+# Administration
+* Changed method `setSliderRowLimit` in `sw-cms-el-product-slider` component to check undefined `productHolder` ref when reading `offsetWidth`.
diff --git a/...Resources/app/administration/src/module/sw-cms/elements/product-slider/component/index.js b/...Resources/app/administration/src/module/sw-cms/elements/product-slider/component/index.js
@@ -104,7 +104,13 @@ export default {
         },
 
         setSliderRowLimit() {
-            if (this.currentDeviceView === 'mobile' || this.$refs.productHolder.offsetWidth < 500) {
+            const boxWidth = this.$refs.productHolder?.offsetWidth;
+
+            if (boxWidth === undefined) {
+                return;
+            }
+
+            if (this.currentDeviceView === 'mobile' || boxWidth < 500) {
                 this.sliderBoxLimit = 1;
                 return;
             }
@@ -122,7 +128,6 @@ export default {
 
             // Subtract to fake look in storefront which has more width
             const fakeLookWidth = 100;
-            const boxWidth = this.$refs.productHolder.offsetWidth;
             const elGap = 32;
             let elWidth = parseInt(this.element.config.elMinWidth.value.replace('px', ''), 10);