Product gallery caption issue

[Karlasa]

Preconditions

Magento 2.2.5

Steps to reproduce

1. Add product images.
2. change gallery caption to false under theme/etc/view.xml (Blank Theme is false by default)
3. Go to product page

Expected result

1. Gallery is not showing product name as caption

Actual result

1. Gallery is showing product name as caption

[magento-engcom-team]

Hi @Karlasa. Thank you for your report.
To help us process this issue please make sure that you provided the following information:

• Summary of the issue
• Information on your environment
• Steps to reproduce
• Expected and actual results

Please make sure that the issue is reproducible on the vanilla Magento instance following Steps to reproduce. To deploy vanilla Magento instance on our environment, please, add a comment to the issue:

@magento-engcom-team give me {$VERSION} instance

where {$VERSION} is version tags (starting from 2.2.0+) or develop branches (2.2-develop +).
For more details, please, review the Magento Contributor Assistant documentation.

@Karlasa do you confirm that you was able to reproduce the issue on vanilla Magento instance following steps to reproduce?

• yes
• no

[Karlasa]

@magento-engcom-team give me 2.2.5 instance

[magento-engcom-team]

Hi @Karlasa. Thank you for your request. I'm working on Magento 2.2.5 instance for you

[magento-engcom-team]

Hi @Karlasa, here is your Magento instance.
Admin access: https://i-16580-2-2-5.engcom.dev.magento.com/admin
Login: admin Password: 123123q
Instance will be terminated in up to 3 hours.

[itsmeit268]

.
It has an error with the product name has the same name as the caption ("36" x 26 "). I'm facing it

[ghost]

Hello @dv-denda ,
Its because of breadcrumb. to solve this issue please replace your breadcrumb.phtml file located at catalog/view/frontend/template/product/breadcrumbs.phtml
Replace below code.

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
/** @var \Magento\Theme\Block\Html\Breadcrumbs $block */
/** @var \Magento\Catalog\ViewModel\Product\Breadcrumbs $viewModel */
$viewModel = $block->getData('viewModel');
?>
<div class="breadcrumbs" data-mage-init='{
    "breadcrumbs": {
        "categoryUrlSuffix": "<?= $block->escapeHtml($viewModel->getCategoryUrlSuffix()); ?>",
        "useCategoryPathInUrl": <?= (int)$viewModel->isCategoryUsedInProductUrl(); ?>,
        "product": "<?= $block->escapeHtml($block->escapeJsQuote($viewModel->getProductName(), '"')); ?>"
    }
}'>
</div>

it will work for you.

[engcom-backlog-nickolas]

Hello @Karlasa, thank you for your report.
We've acknowledged the issue and added to our backlog.

[Karlasa]

Seems like #15040 messed it up.
@VladimirZaets Could you comment why that PR has gallery template changes?

[gwharton]

Ouch, thats one of my PR's. I have indeed messed that up. I have no idea how that change has gotten into that PR.

[gwharton]

PR #16594 created to fix my error.

[itsmeit268]

Thank @emiprotech , it works fine.

[Karlasa]

#15546 is fixing the same issue

[sidolov]

Hi @Karlasa. Thank you for your report.
The issue has been fixed in #16594 by @gwharton in 2.2-develop branch
Related commit(s):

• a012c45166619554619691b996d4474ed6278bfb

The fix will be available with the upcoming 2.2.7 release.

[chakravarthykalyan90]

We upgraded from 2.2.4 to 2.2.7 this change is not there. Still same old issue we are facing. Here is the complete Gallery.phtml code

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

/**
 * Product media data template
 *
 * @var $block \Magento\Catalog\Block\Product\View\Gallery
 */
?>
<div class="gallery-placeholder _block-content-loading" data-gallery-role="gallery-placeholder">
    <div data-role="loader" class="loading-mask">
        <div class="loader">
            <img src="<?= $block->escapeUrl($block->getViewFileUrl('images/loader-1.gif')) ?>"
                 alt="<?= $block->escapeHtml(__('Loading...')) ?>">
        </div>
    </div>
</div>
<!--Fix for jumping content. Loader must be the same size as gallery.-->
<script>
    var config = {
            "width": <?= $block->escapeHtml($block->getImageAttribute('product_page_image_medium', 'width')) ?>,
            "thumbheight": <?= $block->escapeHtml($block->getImageAttribute('product_page_image_small', 'height')
                        ?: $block->getImageAttribute('product_page_image_small', 'width')); ?>,
            "navtype": "<?= $block->escapeHtml($block->getVar("gallery/navtype")) ?>",
            "height": <?= $block->escapeHtml($block->getImageAttribute('product_page_image_medium', 'height')) ?>
        },
        thumbBarHeight = 0,
        loader = document.querySelectorAll('[data-gallery-role="gallery-placeholder"] [data-role="loader"]')[0];

    if (config.navtype === 'horizontal') {
        thumbBarHeight = config.thumbheight;
    }

    loader.style.paddingBottom = ( config.height / config.width * 100) + "%";
</script>
<script type="text/x-magento-init">
    {
        "[data-gallery-role=gallery-placeholder]": {
            "mage/gallery/gallery": {
                "mixins":["magnifier/magnify"],
                "magnifierOpts": <?= /* @noEscape */ $block->getMagnifier() ?>,
                "data": <?= /* @noEscape */ $block->getGalleryImagesJson() ?>,
                "options": {
                    "nav": "<?= $block->escapeHtml($block->getVar("gallery/nav")) ?>",
                    <?php if (($block->getVar("gallery/loop"))) : ?>
                        "loop": <?= $block->escapeHtml($block->getVar("gallery/loop")) ?>,
                    <?php endif; ?>
                    <?php if (($block->getVar("gallery/keyboard"))) : ?>
                        "keyboard": <?= $block->escapeHtml($block->getVar("gallery/keyboard")) ?>,
                    <?php endif; ?>
                    <?php if (($block->getVar("gallery/arrows"))) : ?>
                        "arrows": <?= $block->escapeHtml($block->getVar("gallery/arrows")) ?>,
                    <?php endif; ?>
                    <?php if (($block->getVar("gallery/allowfullscreen"))) : ?>
                        "allowfullscreen": <?= $block->escapeHtml($block->getVar("gallery/allowfullscreen")) ?>,
                    <?php endif; ?>
                    <?php if (is_bool($block->getVar("gallery/caption"))) : ?>
                        "showCaption": <?= /* @noEscape */ $block->getVar("gallery/caption") ? 'true' : 'false'; ?>,
                    <?php endif; ?>
                    <?php
                        $imgWidth = $block->getImageAttribute('product_page_image_medium', 'width');
                        $thumbWidth = $block->getImageAttribute('product_page_image_small', 'width');
                    ?>
                        "width": "<?= $block->escapeHtml($imgWidth) ?>",
                        "thumbwidth": "<?= $block->escapeHtml($thumbWidth) ?>",
                    <?php
                        $thumbHeight = $block->getImageAttribute('product_page_image_small', 'height')
                            ?: $block->getImageAttribute('product_page_image_small', 'width');
                    ?>
                    <?php if ($thumbHeight) : ?>
                        "thumbheight": <?= $block->escapeHtml($thumbHeight); ?>,
                    <?php endif; ?>
                    <?php if (($block->getVar("gallery/thumbmargin"))) : ?>
                        "thumbmargin": <?= (int)$block->getVar("gallery/thumbmargin"); ?>,
                    <?php endif; ?>
                    <?php
                        $imgHeight = $block->getImageAttribute('product_page_image_medium', 'height')
                            ?: $block->getImageAttribute('product_page_image_medium', 'width')
                    ?>
                    <?php if ($imgHeight) : ?>
                        "height": <?= $block->escapeHtml($imgHeight); ?>,
                    <?php endif; ?>
                    <?php if ($block->getVar("gallery/transition/duration")) : ?>
                        "transitionduration": <?= $block->escapeHtml($block->getVar("gallery/transition/duration")) ?>,
                    <?php endif; ?>
                    "transition": "<?= $block->escapeHtml($block->getVar("gallery/transition/effect")) ?>",
                    <?php if (($block->getVar("gallery/navarrows"))) : ?>
                        "navarrows": <?= $block->escapeHtml($block->getVar("gallery/navarrows")) ?>,
                    <?php endif; ?>
                    "navtype": "<?= $block->escapeHtml($block->getVar("gallery/navtype")) ?>",
                    "navdir": "<?= $block->escapeHtml($block->getVar("gallery/navdir")) ?>"
                },
                "fullscreen": {
                    "nav": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/nav")) ?>",
                    <?php if ($block->getVar("gallery/fullscreen/loop")) : ?>
                        "loop": <?= $block->escapeHtml($block->getVar("gallery/fullscreen/loop")) ?>,
                    <?php endif; ?>
                    "navdir": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/navdir")) ?>",
                    <?php if ($block->getVar("gallery/transition/navarrows")) : ?>
                        "navarrows": <?= $block->escapeHtml($block->getVar("gallery/fullscreen/navarrows")) ?>,
                    <?php endif; ?>
                    "navtype": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/navtype")) ?>",
                    <?php if ($block->getVar("gallery/fullscreen/arrows")) : ?>
                        "arrows": <?= $block->escapeHtml($block->getVar("gallery/fullscreen/arrows")) ?>,
                    <?php endif; ?>
                    <?php if (is_bool($block->getVar("gallery/fullscreen/caption"))) : ?>
                        <?php $showCaption = $block->getVar("gallery/fullscreen/caption") ? 'true' : 'false'; ?>
                        "showCaption": <?= /* @noEscape */ $showCaption ?>,
                    <?php endif; ?>
                    <?php if ($block->getVar("gallery/fullscreen/transition/duration")) : ?>
                        "transitionduration": <?=
                        $block->escapeHtml($block->getVar("gallery/fullscreen/transition/duration")) ?>,
                    <?php endif; ?>
                    "transition": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/transition/effect")) ?>"
                },
                "breakpoints": <?= /* @noEscape */ $block->getBreakpoints() ?>
            }
        }
    }
</script>

[Ctucker9233]

I confirm what @chakravarthykalyan90 said. The fix was not included in 2.2.7 or 2.2.8

[gwharton]

Yes, I see. Its been like this for ages. I have no idea, and my only suggestion is that github has messed up in some way and has allowed multiple commits on the same code to override each other without resolving conflicts.

Look at the history for this file in 2.2-develop. This fix is not there. There was however an alternative fix on 19th July 2018 by the looks of it.

I can find all sorts of commits making these changes, but no idea how to work out what relation they are to each other
12554bb
f92de64
a012c45

but it doesn't appear in the file history. It just vanished.

@sidolov it is something that you committed to 2.3-develop on the 31st July 2018/1st August 2018. Any clues? How is it, that two people were working on the same problem at the same time, both committing solutions to 2.2-develop with no notification of conflicts. With one set of merged code changes (shown as merged on 31st July) being overwritten by another set of code changes made on the 19th July. I just dont understand it.

By the way #18443 is a full rework of the gallery template code waiting to be merged in 2.2 (#18440 for 2.3)

So to summarise, Yes the above fix is not present. However another fix seems to be in place that works. Ive just tried 2.2.8 and I don't get extra captions? When #18440 eventually gets merged into 2.2 it will be a lot cleaner.

@Ctucker9233 have you reopened this issue because you are seeing captions in gallery when you shouldn't (if so, please provide more details as I can't reproduce in 2.2.8) or because the original fix went missing (see above comments regarding other fix, and rework of gallery code on its way)

[m2-assistant]

Hi @engcom-backlog-nazar. Thank you for working on this issue.
In order to make sure that issue has enough information and ready for development, please read and check the following instruction: 👇

• 1. Verify that issue has all the required information. (Preconditions, Steps to reproduce, Expected result, Actual result).

  Details

  If the issue has a valid description, the label Issue: Format is valid will be added to the issue automatically. Please, edit issue description if needed, until label Issue: Format is valid appears.

• 2. Verify that issue has a meaningful description and provides enough information to reproduce the issue. If the report is valid, add Issue: Clear Description label to the issue by yourself.

• 3. Add Component: XXXXX label(s) to the ticket, indicating the components it may be related to.

• 4. Verify that the issue is reproducible on 2.3-develop branch

  Details

  - Add the comment @magento-engcom-team give me 2.3-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.3-develop branch, please, add the label Reproduced on 2.3.x.
  - If the issue is not reproducible, add your comment that issue is not reproducible and close the issue and stop verification process here!

• 5. Verify that the issue is reproducible on 2.2-develop branch.

  Details

  - Add the comment @magento-engcom-team give me 2.2-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.2-develop branch, please add the label Reproduced on 2.2.x

• 6. Add label Issue: Confirmed once verification is complete.

• 7. Make sure that automatic system confirms that report has been added to the backlog.

[ghost]

HI @Karlasa thank you for you report, but i'm not able to reproduce this on clean 2.2-develop or 2.3-develop, seems like this is not reproducible anymore.