MC-3926: Slide Content Does Not Render After Page Load If Slide Is In Non-Default Tab

Fix admin preview rendering

Author: danmooney2

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/slider/preview.js

@@ -112,6 +112,11 @@ export default class Preview extends PreviewCollection {
         this.childSubscribe = this.parent.children.subscribe(this.buildSlick);
         this.parent.dataStore.subscribe(this.buildSlick);
 
+        // Redraw slide after content type gets redrawn
+        events.on("contentType:redrawAfter", function () {
+            $(this.element).slick("setPosition");
+        }.bind(this));
+
         // Set the stage to interacting when a slide is focused
         this.focusedSlide.subscribe((value: number) => {
             if (value !== null) {
@@ -398,7 +403,7 @@ export default class Preview extends PreviewCollection {
     }
 
     /**
-     * Build the slack config object
+     * Build the slick config object
      *
      * @returns {{autoplay: boolean; autoplaySpeed: (any | number);
      * fade: boolean; infinite: boolean; arrows: boolean; dots: boolean}}

app/code/Magento/PageBuilder/view/adminhtml/web/js/content-type/tabs/preview.js

@@ -60,6 +60,14 @@ export default class Preview extends PreviewCollection {
                         }
                     }
                 },
+                /**
+                 * Trigger redraw event since new content is being displayed
+                 */
+                activate: () => {
+                    events.trigger("contentType:redrawAfter", {
+                        element: this.element
+                    });
+                },
             });
         }
     }, 10);

app/code/Magento/PageBuilder/view/adminhtml/web/ts/js/content-type/slider/preview.ts

@@ -29,6 +29,7 @@ define([
             dots: $element.data('show-dots')
         });
 
+        // Redraw slide after content type gets redrawn
         events.on('contentType:redrawAfter', function () {
             $element.slick('setPosition');
         });