Magento 2.3.5 - add image to product compare

Question

I want to load a product image in the product compare sidebar. Therefore I used the following code (https://gist.github.com/rubenRP/002d06c7b8d6c6eb44d43e102f86ec38)

But that does not seem to work on Magento 2.3.5 I get a frontend console error:

ReferenceError: Unable to process binding "foreach: function (){return compareProducts().items }"
Message: Unable to process binding "attr: function (){return {'src':image_src} }"
Message: Can't find variable: image_src

How can I load a product image inside the compare bar?

Answer 1

I have found a solution that consists in mimicking the category product listing. Using the below would resolve your issue.

/**
     * @var \Magento\Catalog\Block\Product\ImageBuilder
     */
    private $imageBuilder;

    $item['image'] = $this->imageBuilder->create($item, 'category_page_grid')->toHtml();

and in the template

<div data-bind="html: image"></div>

Of course 'category_page_grid' can be replace by your setup for compare product.