fix(catalog): STRF-4701 - Found some tests breaking due to some missi…

…ng class names. Updated class names in the pricing to make sure they are consistent among the various code paths. Added some comments.
bigcommerce · Jun 19, 2018 · 5d4b318 · 5d4b318
1 parent 0e3cbf7
commit 5d4b318
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 6 deletions.
diff --git a/templates/components/products/price-range.html b/templates/components/products/price-range.html
@@ -1,5 +1,5 @@
 {{#and price.retail_price_range.min.with_tax price.retail_price_range.max.with_tax}}
-    <div class="price-section price-section--withTax rrp-price--withTax" {{#if schema_org}}itemprop="offers" itemscope itemtype="http://schema.org/Offer"{{/if}}>
+    <div class="price-section price-section--withTax rrp-price--withTax">
         {{theme_settings.pdp-retail-price-label}}
         <span data-product-rrp-price-with-tax class="price price--rrp">{{price.retail_price_range.min.with_tax.formatted}} - {{price.retail_price_range.max.with_tax.formatted}}</span>
     </div>
@@ -23,7 +23,7 @@
     <div class="price-section price-section--withTax" {{#if schema_org}}itemprop="offers" itemscope itemtype="http://schema.org/Offer"{{/if}}>
         <span class="price-label">{{theme_settings.pdp-price-label}}</span>
         <span class="price-now-label" style="display: none;">{{theme_settings.pdp-sale-price-label}}</span>
-        <span data-product-price-with-tax class="price">{{price.price_range.min.with_tax.formatted}} - {{price.price_range.max.with_tax.formatted}}</span>
+        <span data-product-price-with-tax class="price price--withTax">{{price.price_range.min.with_tax.formatted}} - {{price.price_range.max.with_tax.formatted}}</span>
         {{#and price.price_range.min.without_tax price.price_range.max.without_tax}}
             <abbr title="{{lang 'products.including_tax'}}">{{lang 'products.price_with_tax' tax_label=price.price_range.min.tax_label}}</abbr>
         {{/and}}
@@ -41,7 +41,7 @@
     </div>
 {{/and}}
 {{#and price.retail_price_range.min.without_tax price.retail_price_range.max.without_tax}}
-    <div class="price-section price-section--withoutTax rrp-price--withoutTax" {{#if schema_org}}itemprop="offers" itemscope itemtype="http://schema.org/Offer"{{/if}}>
+    <div class="price-section price-section--withoutTax rrp-price--withoutTax">
         {{theme_settings.pdp-retail-price-label}}
         <span data-product-rrp-price-without-tax class="price price--rrp">{{price.retail_price_range.min.without_tax.formatted}} - {{price.retail_price_range.max.without_tax.formatted}}</span>
     </div>

diff --git a/templates/components/products/price.html b/templates/components/products/price.html
@@ -1,3 +1,9 @@
+{{!-- There are 2 code paths for generating the PDP pricing HTML determined by the following #and condition. 
+If a 'price_range' exists then we generate all HTML in price-range.html, otherwise it is defined here. Both code
+paths generate the same HTML structure with some differences in whether that element is displayed by default (css styling).
+
+If you are making a change here or in price-range.html, you probably want to make that change in both files. --}}
+
 {{#and price.price_range (if theme_settings.price_ranges '==' true)}}
     {{> components/products/price-range price=price schema_org=schema_org}}
 {{else}}
@@ -21,7 +27,7 @@
             <span class="price-now-label" {{#unless price.non_sale_price_with_tax}}style="display: none;"{{/unless}}>
                 {{theme_settings.pdp-sale-price-label}}
             </span>
-            <span data-product-price-with-tax class="price"> {{price.with_tax.formatted}}</span>
+            <span data-product-price-with-tax class="price price--withTax">{{price.with_tax.formatted}}</span>
             {{#if schema_org}}
                 <meta itemprop="availability" content="{{product.availability}}">
                 <meta itemprop="itemCondition" itemtype="http://schema.org/OfferItemCondition" content="http://schema.org/{{product.condition}}Condition">
@@ -56,7 +62,7 @@
             <span class="price-now-label" {{#unless price.non_sale_price_without_tax}}style="display: none;"{{/unless}}>
                 {{theme_settings.pdp-sale-price-label}}
             </span>
-            <span data-product-price-without-tax class="price"> {{price.without_tax.formatted}}</span>
+            <span data-product-price-without-tax class="price price--withoutTax">{{price.without_tax.formatted}}</span>
             {{#if schema_org}}
                 <meta itemprop="availability" itemtype="http://schema.org/ItemAvailability"
                     content="http://schema.org/{{#if product.pre_order}}PreOrder{{else if product.out_of_stock}}OutOfStock{{else if product.can_purchase '===' false}}OutOfStock{{else}}InStock{{/if}}">
@@ -76,7 +82,7 @@
         {{#if price.saved}}
              <div class="price-section price-section--saving price">
                     <span class="price">{{lang 'products.you_save_opening_text'}}</span>
-                    <span data-product-price-saved class="price">
+                    <span data-product-price-saved class="price price--saving">
                         {{price.saved.formatted}}
                     </span>
                     <span class="price">{{lang 'products.you_save_closing_bracket'}}</span>