Fix product price not displaying properly when product is on sale (#3853)

* Use else if in ProductPrice

This is because the priceComponent variable should be set depending on some conditions, but multiple of them could be true, so by using else if we only handle the first true case

* Update snapshots for jest

Author: opr

assets/js/base/components/product-price/index.js

@@ -126,7 +126,6 @@ const ProductPrice = ( {
 	}
 
 	const isDiscounted = regularPrice && price !== regularPrice;
-
 	let priceComponent = (
 		<span
 			className={ classNames(
@@ -148,9 +147,7 @@ const ProductPrice = ( {
 				regularPriceStyle={ regularPriceStyle }
 			/>
 		);
-	}
-
-	if ( minPrice !== null && maxPrice !== null ) {
+	} else if ( minPrice !== null && maxPrice !== null ) {
 		priceComponent = (
 			<PriceRange
 				currency={ currency }
@@ -160,9 +157,7 @@ const ProductPrice = ( {
 				priceStyle={ priceStyle }
 			/>
 		);
-	}
-
-	if ( price !== null ) {
+	} else if ( price !== null ) {
 		priceComponent = (
 			<FormattedMonetaryAmount
 				className={ classNames(

assets/js/base/components/product-price/test/__snapshots__/index.js.snap

@@ -6,10 +6,25 @@ exports[`ProductPrice should apply the format if one is provided 1`] = `
 >
   pre price 
   <span
-    className="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-product-price__value"
+    className="screen-reader-text"
   >
-    £0.50
+    Previous price:
   </span>
+  <del
+    className="wc-block-components-product-price__regular"
+  >
+    £1.00
+  </del>
+  <span
+    className="screen-reader-text"
+  >
+    Discounted price:
+  </span>
+  <ins
+    className="wc-block-components-product-price__value is-discounted"
+  >
+    £0.50
+  </ins>
    Test format
 </span>
 `;
@@ -19,9 +34,24 @@ exports[`ProductPrice should use default price if no format is provided 1`] = `
   className="price wc-block-components-product-price"
 >
   <span
-    className="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-product-price__value"
+    className="screen-reader-text"
   >
-    £0.50
+    Previous price:
   </span>
+  <del
+    className="wc-block-components-product-price__regular"
+  >
+    £1.00
+  </del>
+  <span
+    className="screen-reader-text"
+  >
+    Discounted price:
+  </span>
+  <ins
+    className="wc-block-components-product-price__value is-discounted"
+  >
+    £0.50
+  </ins>
 </span>
 `;