Skip to content

Commit 0255ce3

Browse files
iivashchenkoiivashchenko
committed
MAGETWO-93198: Extra title is displayed under a product image on product pages on Storefront
1 parent 21f33bc commit 0255ce3

File tree

2 files changed

+114
-54
lines changed
  • app/code/Magento/Catalog/view/frontend/templates/product/view
  • dev/tests/integration/testsuite/Magento/Catalog/Block/Product/View

2 files changed

+114
-54
lines changed

‎app/code/Magento/Catalog/view/frontend/templates/product/view/gallery.phtml

Lines changed: 64 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,6 @@
44
* See COPYING.txt for license details.
55
*/
66

7-
// @codingStandardsIgnoreFile
8-
97
/**
108
* Product media data template
119
*
@@ -15,19 +13,19 @@
1513
<div class="gallery-placeholder _block-content-loading" data-gallery-role="gallery-placeholder">
1614
<div data-role="loader" class="loading-mask">
1715
<div class="loader">
18-
<img src="<?= /* @escapeNotVerified */ $block->getViewFileUrl('images/loader-1.gif') ?>"
19-
alt="<?= /* @escapeNotVerified */ __('Loading...') ?>">
16+
<img src="<?= $block->escapeUrl($block->getViewFileUrl('images/loader-1.gif')) ?>"
17+
alt="<?= $block->escapeHtml(__('Loading...')) ?>">
2018
</div>
2119
</div>
2220
</div>
2321
<!--Fix for jumping content. Loader must be the same size as gallery.-->
2422
<script>
2523
var config = {
26-
"width": <?= /* @escapeNotVerified */ $block->getImageAttribute('product_page_image_medium', 'width') ?>,
27-
"thumbheight": <?php /* @escapeNotVerified */ echo $block->getImageAttribute('product_page_image_small', 'height')
28-
?: $block->getImageAttribute('product_page_image_small', 'width'); ?>,
29-
"navtype": "<?= /* @escapeNotVerified */ $block->getVar("gallery/navtype") ?>",
30-
"height": <?= /* @escapeNotVerified */ $block->getImageAttribute('product_page_image_medium', 'height') ?>
24+
"width": <?= $block->escapeHtml($block->getImageAttribute('product_page_image_medium', 'width')) ?>,
25+
"thumbheight": <?= $block->escapeHtml($block->getImageAttribute('product_page_image_small', 'height')
26+
?: $block->getImageAttribute('product_page_image_small', 'width')); ?>,
27+
"navtype": "<?= $block->escapeHtml($block->getVar("gallery/navtype")) ?>",
28+
"height": <?= $block->escapeHtml($block->getImageAttribute('product_page_image_medium', 'height')) ?>
3129
},
3230
thumbBarHeight = 0,
3331
loader = document.querySelectorAll('[data-gallery-role="gallery-placeholder"] [data-role="loader"]')[0];
@@ -43,70 +41,82 @@
4341
"[data-gallery-role=gallery-placeholder]": {
4442
"mage/gallery/gallery": {
4543
"mixins":["magnifier/magnify"],
46-
"magnifierOpts": <?= /* @escapeNotVerified */ $block->getMagnifier() ?>,
47-
"data": <?= /* @escapeNotVerified */ $block->getGalleryImagesJson() ?>,
44+
"magnifierOpts": <?= /* @noEscape */ $block->getMagnifier() ?>,
45+
"data": <?= /* @noEscape */ $block->getGalleryImagesJson() ?>,
4846
"options": {
49-
"nav": "<?= /* @escapeNotVerified */ $block->getVar("gallery/nav") ?>",
50-
<?php if (($block->getVar("gallery/loop"))): ?>
51-
"loop": <?= /* @escapeNotVerified */ $block->getVar("gallery/loop") ?>,
47+
"nav": "<?= $block->escapeHtml($block->getVar("gallery/nav")) ?>",
48+
<?php if (($block->getVar("gallery/loop"))) : ?>
49+
"loop": <?= $block->escapeHtml($block->getVar("gallery/loop")) ?>,
5250
<?php endif; ?>
53-
<?php if (($block->getVar("gallery/keyboard"))): ?>
54-
"keyboard": <?= /* @escapeNotVerified */ $block->getVar("gallery/keyboard") ?>,
51+
<?php if (($block->getVar("gallery/keyboard"))) : ?>
52+
"keyboard": <?= $block->escapeHtml($block->getVar("gallery/keyboard")) ?>,
5553
<?php endif; ?>
56-
<?php if (($block->getVar("gallery/arrows"))): ?>
57-
"arrows": <?= /* @escapeNotVerified */ $block->getVar("gallery/arrows") ?>,
54+
<?php if (($block->getVar("gallery/arrows"))) : ?>
55+
"arrows": <?= $block->escapeHtml($block->getVar("gallery/arrows")) ?>,
5856
<?php endif; ?>
59-
<?php if (($block->getVar("gallery/allowfullscreen"))): ?>
60-
"allowfullscreen": <?= /* @escapeNotVerified */ $block->getVar("gallery/allowfullscreen") ?>,
57+
<?php if (($block->getVar("gallery/allowfullscreen"))) : ?>
58+
"allowfullscreen": <?= $block->escapeHtml($block->getVar("gallery/allowfullscreen")) ?>,
6159
<?php endif; ?>
62-
<?php if (($block->getVar("gallery/caption"))): ?>
63-
"showCaption": <?= /* @escapeNotVerified */ $block->getVar("gallery/caption") ?>,
60+
<?php if (is_bool($block->getVar("gallery/caption"))) : ?>
61+
"showCaption": <?= /* @noEscape */ $block->getVar("gallery/caption") ? 'true' : 'false'; ?>,
6462
<?php endif; ?>
65-
"width": "<?= /* @escapeNotVerified */ $block->getImageAttribute('product_page_image_medium', 'width') ?>",
66-
"thumbwidth": "<?= /* @escapeNotVerified */ $block->getImageAttribute('product_page_image_small', 'width') ?>",
67-
<?php if ($block->getImageAttribute('product_page_image_small', 'height') || $block->getImageAttribute('product_page_image_small', 'width')): ?>
68-
"thumbheight": <?php /* @escapeNotVerified */ echo $block->getImageAttribute('product_page_image_small', 'height')
69-
?: $block->getImageAttribute('product_page_image_small', 'width'); ?>,
63+
<?php
64+
$imgWidth = $block->getImageAttribute('product_page_image_medium', 'width');
65+
$thumbWidth = $block->getImageAttribute('product_page_image_small', 'width');
66+
?>
67+
"width": "<?= $block->escapeHtml($imgWidth) ?>",
68+
"thumbwidth": "<?= $block->escapeHtml($thumbWidth) ?>",
69+
<?php
70+
$thumbHeight = $block->getImageAttribute('product_page_image_small', 'height')
71+
?: $block->getImageAttribute('product_page_image_small', 'width');
72+
?>
73+
<?php if ($thumbHeight) : ?>
74+
"thumbheight": <?= $block->escapeHtml($thumbHeight); ?>,
7075
<?php endif; ?>
71-
<?php if (($block->getVar("gallery/thumbmargin"))): ?>
72-
"thumbmargin": <?= /* @noEscape */ (int)$block->getVar("gallery/thumbmargin"); ?>,
76+
<?php if (($block->getVar("gallery/thumbmargin"))) : ?>
77+
"thumbmargin": <?= (int)$block->getVar("gallery/thumbmargin"); ?>,
7378
<?php endif; ?>
74-
<?php if ($block->getImageAttribute('product_page_image_medium', 'height') || $block->getImageAttribute('product_page_image_medium', 'width')): ?>
75-
"height": <?php /* @escapeNotVerified */ echo $block->getImageAttribute('product_page_image_medium', 'height')
76-
?: $block->getImageAttribute('product_page_image_medium', 'width'); ?>,
79+
<?php
80+
$imgHeight = $block->getImageAttribute('product_page_image_medium', 'height')
81+
?: $block->getImageAttribute('product_page_image_medium', 'width')
82+
?>
83+
<?php if ($imgHeight) : ?>
84+
"height": <?= $block->escapeHtml($imgHeight); ?>,
7785
<?php endif; ?>
78-
<?php if ($block->getVar("gallery/transition/duration")): ?>
79-
"transitionduration": <?= /* @escapeNotVerified */ $block->getVar("gallery/transition/duration") ?>,
86+
<?php if ($block->getVar("gallery/transition/duration")) : ?>
87+
"transitionduration": <?= $block->escapeHtml($block->getVar("gallery/transition/duration")) ?>,
8088
<?php endif; ?>
81-
"transition": "<?= /* @escapeNotVerified */ $block->getVar("gallery/transition/effect") ?>",
82-
<?php if (($block->getVar("gallery/navarrows"))): ?>
83-
"navarrows": <?= /* @escapeNotVerified */ $block->getVar("gallery/navarrows") ?>,
89+
"transition": "<?= $block->escapeHtml($block->getVar("gallery/transition/effect")) ?>",
90+
<?php if (($block->getVar("gallery/navarrows"))) : ?>
91+
"navarrows": <?= $block->escapeHtml($block->getVar("gallery/navarrows")) ?>,
8492
<?php endif; ?>
85-
"navtype": "<?= /* @escapeNotVerified */ $block->getVar("gallery/navtype") ?>",
86-
"navdir": "<?= /* @escapeNotVerified */ $block->getVar("gallery/navdir") ?>"
93+
"navtype": "<?= $block->escapeHtml($block->getVar("gallery/navtype")) ?>",
94+
"navdir": "<?= $block->escapeHtml($block->getVar("gallery/navdir")) ?>"
8795
},
8896
"fullscreen": {
89-
"nav": "<?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/nav") ?>",
90-
<?php if ($block->getVar("gallery/fullscreen/loop")): ?>
91-
"loop": <?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/loop") ?>,
97+
"nav": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/nav")) ?>",
98+
<?php if ($block->getVar("gallery/fullscreen/loop")) : ?>
99+
"loop": <?= $block->escapeHtml($block->getVar("gallery/fullscreen/loop")) ?>,
92100
<?php endif; ?>
93-
"navdir": "<?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/navdir") ?>",
94-
<?php if ($block->getVar("gallery/transition/navarrows")): ?>
95-
"navarrows": <?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/navarrows") ?>,
101+
"navdir": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/navdir")) ?>",
102+
<?php if ($block->getVar("gallery/transition/navarrows")) : ?>
103+
"navarrows": <?= $block->escapeHtml($block->getVar("gallery/fullscreen/navarrows")) ?>,
96104
<?php endif; ?>
97-
"navtype": "<?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/navtype") ?>",
98-
<?php if ($block->getVar("gallery/fullscreen/arrows")): ?>
99-
"arrows": <?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/arrows") ?>,
105+
"navtype": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/navtype")) ?>",
106+
<?php if ($block->getVar("gallery/fullscreen/arrows")) : ?>
107+
"arrows": <?= $block->escapeHtml($block->getVar("gallery/fullscreen/arrows")) ?>,
100108
<?php endif; ?>
101-
<?php if ($block->getVar("gallery/fullscreen/caption")): ?>
102-
"showCaption": <?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/caption") ?>,
109+
<?php if (is_bool($block->getVar("gallery/fullscreen/caption"))) : ?>
110+
<?php $showCaption = $block->getVar("gallery/fullscreen/caption") ? 'true' : 'false'; ?>
111+
"showCaption": <?= /* @noEscape */ $showCaption ?>,
103112
<?php endif; ?>
104-
<?php if ($block->getVar("gallery/fullscreen/transition/duration")): ?>
105-
"transitionduration": <?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/transition/duration") ?>,
113+
<?php if ($block->getVar("gallery/fullscreen/transition/duration")) : ?>
114+
"transitionduration": <?=
115+
$block->escapeHtml($block->getVar("gallery/fullscreen/transition/duration")) ?>,
106116
<?php endif; ?>
107-
"transition": "<?= /* @escapeNotVerified */ $block->getVar("gallery/fullscreen/transition/effect") ?>"
117+
"transition": "<?= $block->escapeHtml($block->getVar("gallery/fullscreen/transition/effect")) ?>"
108118
},
109-
"breakpoints": <?= /* @escapeNotVerified */ $block->getBreakpoints() ?>
119+
"breakpoints": <?= /* @noEscape */ $block->getBreakpoints() ?>
110120
}
111121
}
112122
}

‎dev/tests/integration/testsuite/Magento/Catalog/Block/Product/View/GalleryTest.php

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<?php
2+
/**
3+
* Copyright © Magento, Inc. All rights reserved.
4+
* See COPYING.txt for license details.
5+
*/
6+
declare(strict_types=1);
7+
8+
namespace Magento\Catalog\Block\Product\View;
9+
10+
use Magento\Catalog\Api\Data\ProductInterface;
11+
use Magento\Catalog\Api\ProductRepositoryInterface;
12+
use Magento\Framework\ObjectManagerInterface;
13+
use Magento\Framework\View\LayoutInterface;
14+
use Magento\TestFramework\Helper\Bootstrap;
15+
16+
class GalleryTest extends \PHPUnit\Framework\TestCase
17+
{
18+
/**
19+
* @var ObjectManagerInterface
20+
*/
21+
private $objectManager;
22+
23+
protected function setUp()
24+
{
25+
$this->objectManager = Bootstrap::getObjectManager();
26+
}
27+
/**
28+
* Tests rendered gallery block.
29+
*
30+
* @magentoDataFixture Magento/Catalog/_files/product_with_image.php
31+
* @magentoAppArea frontend
32+
*/
33+
public function testHtml()
34+
{
35+
/** @var ProductRepositoryInterface $productRepository */
36+
$productRepository = $this->objectManager->create(ProductRepositoryInterface::class);
37+
/** @var ProductInterface $product */
38+
$product = $productRepository->get('simple');
39+
/** @var LayoutInterface $layout */
40+
$layout = $this->objectManager->get(LayoutInterface::class);
41+
/** @var Gallery $block */
42+
$block = $layout->createBlock(Gallery::class);
43+
$block->setData('product', $product);
44+
$block->setTemplate("Magento_Catalog::product/view/gallery.phtml");
45+
46+
$showCaption = $block->getVar('gallery/caption');
47+
48+
self::assertContains('"showCaption": ' . $showCaption, $block->toHtml());
49+
}
50+
}

0 commit comments

Comments
 (0)