Skip to content

Commit e124de8

Browse files
Indrani sonawaneIndrani sonawane
Indrani sonawane
authored and
Indrani sonawane
committed
Merge remote-tracking branch '33265/improve-pdp-cls' into comm_247beta3
2 parents 10d15b0 + a70d967 commit e124de8

File tree

12 files changed

+72
-68
lines changed

12 files changed

+72
-68
lines changed

‎app/code/Magento/Bundle/Test/Mftf/Section/StorefrontProductInfoMainSection.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
<element name="minPrice" type="text" selector="span[data-price-type='minPrice']"/>
1515
<element name="maxPrice" type="text" selector="span[data-price-type='minPrice']"/>
1616
<element name="asLowAsFinalPrice" type="text" selector="div.price-box.price-final_price p.minimal-price > span.price-final_price span.price"/>
17-
<element name="fixedFinalPrice" type="text" selector="div.price-box.price-final_price > span.price-final_price span.price"/>
17+
<element name="fixedFinalPrice" type="text" selector="div.price-box.price-final_price p.price-from span.price-final_price span.price-wrapper span.price"/>
1818
<element name="productBundleOptionsCheckbox" type="checkbox" selector="//*[@id='product-options-wrapper']//div[@class='fieldset']//label[contains(.,'{{childName}}')]/../input" parameterized="true" timeout="30"/>
1919
<element name="productBundleOneOptionInput" type="input" selector="//*[@id='product-options-wrapper']//div[@class='fieldset']//label[contains(.,'{{childName}}')]/..//input[contains(@class, 'option')]" parameterized="true" timeout="30"/>
2020
<element name="productBundleOptionQty" type="input" selector="//*[@id='product-options-wrapper']//div[@class='fieldset']//label[contains(.,'{{childName}}')]/..//input[contains(@class, 'qty')]" parameterized="true" timeout="30"/>

‎app/code/Magento/Catalog/Test/Mftf/ActionGroup/AssertProductImageStorefrontProductPageActionGroup.xml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919

2020
<seeInCurrentUrl url="/{{product.urlKey}}.html" stepKey="checkUrl"/>
2121
<waitForPageLoad stepKey="waitForPageLoad"/>
22-
<waitForElement selector="{{StorefrontProductMediaSection.imageFile(image.filename)}}" stepKey="waitForImage"/>
23-
<seeElement selector="{{StorefrontProductMediaSection.imageFile(image.filename)}}" stepKey="seeImage"/>
22+
<waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery(image.filename)}}" stepKey="waitForImage"/>
23+
<seeElement selector="{{StorefrontProductMediaSection.imageFileInGallery(image.filename)}}" stepKey="seeImage"/>
2424
</actionGroup>
2525
</actionGroups>

‎app/code/Magento/Catalog/Test/Mftf/Section/StorefrontProductInfoMainSection.xml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,8 @@
2424
<element name="oldPriceTag" type="text" selector=".old-price .price-label"/>
2525
<element name="oldPriceAmount" type="text" selector=".old-price span.price"/>
2626
<element name="productStockStatus" type="text" selector=".stock[title=Availability]>span"/>
27-
<element name="productImage" type="text" selector="//*[@id='maincontent']//div[@class='gallery-placeholder']//img[@class='fotorama__img']"/>
28-
<element name="productImageSrc" type="text" selector="//*[@id='maincontent']//div[@class='gallery-placeholder']//img[contains(@src, '{{src}}')]" parameterized="true"/>
27+
<element name="productImage" type="text" selector="//*[@id='maincontent']//div[@class='gallery-placeholder']//img[contains(@class, 'fotorama__img')]"/>
28+
<element name="productImageSrc" type="text" selector="//*[@id='maincontent']//div[@class='gallery-placeholder']//img[contains(@class, 'fotorama__img')][contains(@src, '{{src}}')]" parameterized="true"/>
2929
<element name="productDescription" type="text" selector="#description .value"/>
3030
<element name="productOptionFieldInput" type="input" selector="//*[@id='product-options-wrapper']//div[@class='fieldset']//label[contains(.,'{{var1}}')]/../div[@class='control']//input[@type='text']" parameterized="true"/>
3131
<element name="productOptionAreaInput" type="textarea" selector="//*[@id='product-options-wrapper']//div[@class='fieldset']//label[contains(.,'{{var1}}')]/../div[@class='control']//textarea" parameterized="true"/>

‎app/code/Magento/Catalog/Test/Mftf/Section/StorefrontProductMediaSection.xml

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@
1515
<element name="productImage" type="text" selector="//*[@data-gallery-role='gallery' and not(contains(@class, 'fullscreen'))]//img[contains(@src, '{{filename}}') and not(contains(@class, 'full'))]" parameterized="true" />
1616
<element name="productImageFullscreen" type="text" selector="//*[@data-gallery-role='gallery' and contains(@class, 'fullscreen')]//img[contains(@src, '{{filename}}') and contains(@class, 'full')]" parameterized="true" />
1717
<element name="closeFullscreenImage" type="button" selector="//*[@data-gallery-role='gallery' and contains(@class, 'fullscreen')]//*[@data-gallery-role='fotorama__fullscreen-icon']" />
18-
<element name="imageFile" type="text" selector="//*[@class='product media']//img[contains(@src, '{{filename}}')]" parameterized="true"/>
18+
<element name="imageFile" type="text" selector="//div[contains(@class, 'fotorama__active')]//img[contains(@src, '{{filename}}')]" parameterized="true"/>
19+
<element name="imageFileInGallery" type="text" selector="//div[contains(@class, 'fotorama__loaded--img')]//img[contains(@src, '{{filename}}')]" parameterized="true"/>
1920
<element name="productImageActive" type="text" selector=".product.media div[data-active=true] > img[src*='{{filename}}']" parameterized="true"/>
2021
<element name="productImageInFotorama" type="file" selector=".fotorama__nav__shaft img[src*='{{imageName}}']" parameterized="true" timeout="30"/>
2122
<element name="fotoramaPrevButton" type="button" selector="//*[@data-gallery-role='gallery']//*[@data-gallery-role='nav-wrap']//*[@data-gallery-role='arrow' and contains(@class, 'fotorama__thumb__arr--left')]" timeout="30"/>

‎app/code/Magento/Catalog/Test/Mftf/Test/AdminSimpleProductImagesTest/AdminSimpleProductImagesTest.xml

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -110,12 +110,12 @@
110110
<waitForPageLoad stepKey="waitForStorefront"/>
111111

112112
<!-- See all of the images that we uploaded -->
113-
<waitForElement selector="{{StorefrontProductMediaSection.imageFile('small')}}" stepKey="seeSmall"/>
114-
<waitForElement selector="{{StorefrontProductMediaSection.imageFile('medium')}}" stepKey="seeMedium"/>
115-
<waitForElement selector="{{StorefrontProductMediaSection.imageFile('large')}}" stepKey="seeLarge"/>
116-
<waitForElement selector="{{StorefrontProductMediaSection.imageFile('gif')}}" stepKey="seeGif"/>
117-
<waitForElement selector="{{StorefrontProductMediaSection.imageFile('jpg')}}" stepKey="seeJpg"/>
118-
<waitForElement selector="{{StorefrontProductMediaSection.imageFile('png')}}" stepKey="seePng"/>
113+
<waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery('small')}}" stepKey="seeSmall"/>
114+
<waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery('medium')}}" stepKey="seeMedium"/>
115+
<waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery('large')}}" stepKey="seeLarge"/>
116+
<waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery('gif')}}" stepKey="seeGif"/>
117+
<waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery('jpg')}}" stepKey="seeJpg"/>
118+
<waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery('png')}}" stepKey="seePng"/>
119119

120120
<!-- Go to the category page and see a placeholder image for the second product -->
121121
<amOnPage url="$$category.custom_attributes[url_key]$$.html" stepKey="goToCategoryPage"/>

‎app/code/Magento/Catalog/view/frontend/layout/catalog_product_view.xml

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
</referenceBlock>
3737

3838
<referenceContainer name="content">
39-
<container name="product.info.main" htmlTag="div" htmlClass="product-info-main" before="-">
39+
<container name="product.info.main" htmlTag="div" htmlClass="product-info-main" before="product.info.details">
4040
<container name="product.info.price" label="Product info auxiliary container" htmlTag="div" htmlClass="product-info-price">
4141
<container name="product.info.stock.sku" label="Product auxiliary info" htmlTag="div" htmlClass="product-info-stock-sku">
4242
<container name="product.info.type" before="-"/>
@@ -111,14 +111,14 @@
111111
</arguments>
112112
</block>
113113
</container>
114-
<container name="product.info.media" htmlTag="div" htmlClass="product media" after="product.info.main">
114+
<container name="product.info.media" htmlTag="div" htmlClass="product media" before="product.info.main">
115115
<block class="Magento\Framework\View\Element\Template" name="skip_gallery_after.target" before="skip_gallery_before.wrapper" template="Magento_Theme::html/skiptarget.phtml">
116116
<arguments>
117117
<argument name="target_id" xsi:type="string">gallery-prev-area</argument>
118118
</arguments>
119119
</block>
120120
<container name="skip_gallery_before.wrapper" htmlTag="div" htmlClass="action-skip-wrapper">
121-
<block class="Magento\Framework\View\Element\Template" before="product.info.media.image" name="skip_gallery_before" template="Magento_Theme::html/skip.phtml">
121+
<block class="Magento\Framework\View\Element\Template" name="skip_gallery_before" template="Magento_Theme::html/skip.phtml">
122122
<arguments>
123123
<argument name="target" xsi:type="string">gallery-next-area</argument>
124124
<argument name="label" translate="true" xsi:type="string">Skip to the end of the images gallery</argument>
@@ -132,7 +132,7 @@
132132
</arguments>
133133
</block>
134134
<container name="skip_gallery_after.wrapper" htmlTag="div" htmlClass="action-skip-wrapper">
135-
<block class="Magento\Framework\View\Element\Template" after="product.info.media.image" name="skip_gallery_after" template="Magento_Theme::html/skip.phtml">
135+
<block class="Magento\Framework\View\Element\Template" name="skip_gallery_after" template="Magento_Theme::html/skip.phtml">
136136
<arguments>
137137
<argument name="target" xsi:type="string">gallery-prev-area</argument>
138138
<argument name="label" translate="true" xsi:type="string">Skip to the beginning of the images gallery</argument>

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

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
* Product media data template
99
*
1010
* @var $block \Magento\Catalog\Block\Product\View\Gallery
11+
* @var $escaper \Magento\Framework\Escaper
1112
*/
1213
?>
1314

@@ -25,6 +26,8 @@ $helper = $block->getData('imageHelper');
2526
$mainImageData = $mainImage ?
2627
$mainImage->getData('medium_image_url') :
2728
$helper->getDefaultPlaceholderUrl('image');
29+
$imageWidth = $block->getImageAttribute('product_page_image_medium', 'width');
30+
$imageHeight = $block->getImageAttribute('product_page_image_medium', 'height');
2831

2932
?>
3033

@@ -33,9 +36,11 @@ $mainImageData = $mainImage ?
3336
alt="main product photo"
3437
class="gallery-placeholder__image"
3538
src="<?= /* @noEscape */ $mainImageData ?>"
39+
<?= $imageWidth ? 'width="'. $escaper->escapeHtmlAttr($imageWidth) .'"' : '' ?>
40+
<?= $imageHeight ? 'height="'. $escaper->escapeHtmlAttr($imageHeight) .'"' : '' ?>
3641
/>
3742
</div>
38-
43+
<?php // phpcs:ignore Magento2.Legacy.PhtmlTemplate ?>
3944
<script type="text/x-magento-init">
4045
{
4146
"[data-gallery-role=gallery-placeholder]": {

‎app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/_module.less

Lines changed: 18 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -152,15 +152,8 @@
152152

153153
.additional-attributes {
154154
width: auto;
155-
.lib-table-bordered(
156-
@_table_type: clear
157-
);
158-
.lib-table-resize(
159-
@_th-padding-left: 0,
160-
@_th-padding-right: @indent__l,
161-
@_th-padding-bottom: @indent__s,
162-
@_td-padding-bottom: @indent__s
163-
);
155+
.lib-table-bordered(@_table_type: clear);
156+
.lib-table-resize(@_th-padding-left: 0, @_th-padding-right: @indent__l, @_th-padding-bottom: @indent__s, @_td-padding-bottom: @indent__s);
164157
}
165158
}
166159

@@ -323,14 +316,7 @@
323316
.legend {
324317
&:after {
325318
content: '*';
326-
.lib-typography(
327-
@_font-size: @form-field-label-asterisk__font-size,
328-
@_color: @form-field-label-asterisk__color,
329-
@_font-family: @form-field-label-asterisk__font-family,
330-
@_font-weight: @form-field-label-asterisk__font-weight,
331-
@_line-height: @form-field-label-asterisk__line-height,
332-
@_font-style: @form-field-label-asterisk__font-style
333-
);
319+
.lib-typography(@_font-size: @form-field-label-asterisk__font-size, @_color: @form-field-label-asterisk__color, @_font-family: @form-field-label-asterisk__font-family, @_font-weight: @form-field-label-asterisk__font-weight, @_line-height: @form-field-label-asterisk__line-height, @_font-style: @form-field-label-asterisk__font-style);
334320
}
335321
}
336322
}
@@ -434,10 +420,7 @@
434420

435421
.action.tocompare {
436422
&:extend(.abs-actions-addto all);
437-
.lib-icon-font-symbol(
438-
@_icon-font-content: @icon-compare-full,
439-
@_icon-font-position: before
440-
);
423+
.lib-icon-font-symbol(@_icon-font-content: @icon-compare-full, @_icon-font-position: before);
441424
}
442425
}
443426

@@ -617,12 +600,14 @@
617600
}
618601
}
619602

603+
/**
604+
* @codingStandardsIgnoreStart
605+
*/
620606
//
621607
// Mobile @screen__s
622608
// _____________________________________________
623609

624610
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
625-
626611
.product-info-price {
627612
margin: 0 -@indent__s 0;
628613
width: ~'calc(100% + 2*@{indent__s})' !important;
@@ -642,7 +627,7 @@
642627
}
643628
}
644629
}
645-
630+
//@codingStandardsIgnoreEnd
646631
//
647632
// Desktop
648633
// _____________________________________________
@@ -1014,6 +999,10 @@
1014999
display: none;
10151000
}
10161001

1002+
1003+
/**
1004+
* @codingStandardsIgnoreStart
1005+
*/
10171006
.catalog-product_compare-index {
10181007
.columns {
10191008
.column {
@@ -1023,6 +1012,7 @@
10231012
}
10241013
}
10251014
}
1015+
//@codingStandardsIgnoreEnd
10261016
}
10271017

10281018
//
@@ -1036,16 +1026,7 @@
10361026

10371027
.action.compare {
10381028
line-height: @form-element-input__height;
1039-
.lib-link(
1040-
@_link-color: @primary__color,
1041-
@_link-text-decoration: none,
1042-
@_link-color-visited: @primary__color,
1043-
@_link-text-decoration-visited: none,
1044-
@_link-color-hover: @primary__color,
1045-
@_link-text-decoration-hover: underline,
1046-
@_link-color-active: @primary__color,
1047-
@_link-text-decoration-active: underline
1048-
);
1029+
.lib-link(@_link-color: @primary__color, @_link-text-decoration: none, @_link-color-visited: @primary__color, @_link-text-decoration-visited: none, @_link-color-hover: @primary__color, @_link-text-decoration-hover: underline, @_link-color-active: @primary__color, @_link-text-decoration-active: underline);
10491030
}
10501031

10511032
.counter.qty {
@@ -1095,6 +1076,9 @@
10951076
}
10961077
}
10971078

1079+
/**
1080+
* @codingStandardsIgnoreStart
1081+
*/
10981082
//
10991083
// Desktop large
11001084
// _____________________________________________
@@ -1106,3 +1090,4 @@
11061090
}
11071091
}
11081092
}
1093+
//@codingStandardsIgnoreEnd

‎lib/web/css/source/lib/_breadcrumbs.less

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
@_breadcrumbs-display: @breadcrumbs__display,
1313
@_breadcrumbs-container-margin: @breadcrumbs__container-margin,
1414
@_breadcrumbs-padding: @breadcrumbs__padding,
15+
@_breadcrumbs-min-height: @breadcrumbs__min-height,
1516

1617
// Breadcrumbs separating symbol
1718
@_breadcrumbs-separator-symbol: @breadcrumbs-separator__symbol,
@@ -74,6 +75,7 @@
7475
@_breadcrumbs-link-gradient-color-end-active: @breadcrumbs-link__active__gradient-color-end
7576
) {
7677
.lib-css(margin, @_breadcrumbs-container-margin);
78+
.lib-css(min-height, @_breadcrumbs-min-height);
7779
.items {
7880
.lib-font-size(@_breadcrumbs-font-size);
7981
.lib-css(color, @_breadcrumbs-current-color);

‎lib/web/css/source/lib/variables/_breadcrumbs.less

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
@breadcrumbs__display: false;
1212
@breadcrumbs__container-margin: 0 0 @indent__base;
1313
@breadcrumbs__padding: false;
14+
@breadcrumbs__min-height: 24px;
1415

1516
@breadcrumbs-separator__symbol: false;
1617
@breadcrumbs-separator__color: @breadcrumbs-current__color;

0 commit comments

Comments
 (0)