Magento 2.4.2 to 2.4.5 – Custom Page Builder Element Not Working After Upgrade

magento2page-builderPHPuicomponent

We have a custom page-builder component for adding slides. The component has stopped functioning after upgrade to 2.4.5.

The admin panel page builder editor loads fine, we can add our component, it shows and can be dragged into a row / column with out issue. I can also delete the component as well as edit the settings for it, but the "+" / add slide does not respond no matter what.

I have reviewed console out put when it is clicked with no errors, I have reviewed error logs under var/log and we have no errors present when attempting to add custom slides.

I am not sure what may have changed for page builder between 2.4.2 and 2.4.5 but it has stopped our component from functioning. Please see image below:

Any suggestions on what may have changed between the M2 versions that may have broken this would be of great help.

Many thanks in advance.

Best Answer

Try checking your template files for these components - if you have self closing tags that aren't typically self closing (render, div etc) then this will break it in php 8.

Related Solutions

Magento2.4.2-p1 Page Builder – Fix Custom Content Type Preview.js Error

I was able to modify my preview.js file and resolve this issue. I looked at the Magento Page Builder examples to modify it.

https://github.com/magento-devdocs/pagebuilder-examples/blob/master/Quote/Custom/view/adminhtml/web/js/content-type/custom-quote/preview.js

Here is what my preview.js file looks like now:

define([
  'Magento_PageBuilder/js/content-type/preview',
  'Magento_PageBuilder/js/uploader'
], function (
  PreviewBase, 
  Uploader
) {
    'use strict';

    function Preview(parent, config, stageId) {
      PreviewBase.call(this, parent, config, stageId);
    }

  var $super = PreviewBase.prototype;

  Preview.prototype = Object.create(PreviewBase.prototype);

  Preview.prototype.getUploader = function() {
    var initialImageValue = this.contentType.dataStore.get(
      this.config.additional_data.uploaderConfig.dataScope,
      ""
    );

    return new Uploader(
      "imageuploader_" + this.contentType.id,
      this.config.additional_data.uploaderConfig,
      this.contentType.id,
      this.contentType.dataStore,
      initialImageValue
    );
  };   

  Preview.prototype.getViewportImageData = function getViewportImageData() {
    var desktopImageData = this.data.right_desktop_image;
    var mobileImageData = this.data.right_mobile_image;
    return this.viewport() === "mobile" && typeof mobileImageData !== "undefined" ? mobileImageData : desktopImageData;
  }
  
  return Preview;
 });

Best Answer

Related Solutions

Magento2.4.2-p1 Page Builder – Fix Custom Content Type Preview.js Error

Related Topic