Consistent HTML entities in Store API (2.5.x changes) (#1608)

* apply changes from PR #1597 to release/2.5 branch:
- changes can't be cherry picked automatically due to significant
other API changes on master

* fix phpcs errors introduced in last commit

Author: haszari

assets/js/atomic/components/product/button/index.js

@@ -16,6 +16,7 @@ import { find } from 'lodash';
 import { useCollection } from '@woocommerce/base-hooks';
 import { COLLECTIONS_STORE_KEY as storeKey } from '@woocommerce/block-data';
 import { useProductLayoutContext } from '@woocommerce/base-context/product-layout-context';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * A custom hook for exposing cart related data for a given product id and an
@@ -113,7 +114,7 @@ const ProductButton = ( { product, className } ) => {
 				cartQuantity
 			);
 		}
-		return productCartDetails.text;
+		return decodeEntities( productCartDetails.text );
 	};
 
 	// This is a hack to trigger cart updates till we migrate to block based card
@@ -166,7 +167,9 @@ const ProductButton = ( { product, className } ) => {
 			{ allowAddToCart ? (
 				<button
 					onClick={ addToCart }
-					aria-label={ productCartDetails.description }
+					aria-label={ decodeEntities(
+						productCartDetails.description
+					) }
 					className={ buttonClasses }
 					disabled={ addingToCart }
 				>
@@ -175,7 +178,9 @@ const ProductButton = ( { product, className } ) => {
 			) : (
 				<a
 					href={ permalink }
-					aria-label={ productCartDetails.description }
+					aria-label={ decodeEntities(
+						productCartDetails.description
+					) }
 					className={ buttonClasses }
 					rel="nofollow"
 				>

assets/js/atomic/components/product/title/index.js

@@ -4,6 +4,7 @@
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import { useProductLayoutContext } from '@woocommerce/base-context/product-layout-context';
+import { decodeEntities } from '@wordpress/html-entities';
 
 const ProductTitle = ( {
 	className,
@@ -16,7 +17,7 @@ const ProductTitle = ( {
 		return null;
 	}
 
-	const productName = product.name;
+	const productName = decodeEntities( product.name );
 	const TagName = `h${ headingLevel }`;
 
 	return (

assets/js/blocks/active-filters/active-attribute-filters.js

@@ -2,6 +2,7 @@
  * External dependencies
  */
 import { useCollection, useQueryStateByKey } from '@woocommerce/base-hooks';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -39,7 +40,7 @@ const ActiveAttributeFilters = ( { attributeObject = {}, slugs = [] } ) => {
 			termObject &&
 			renderRemovableListItem(
 				attributeLabel,
-				termObject.name || slug,
+				decodeEntities( termObject.name || slug ),
 				() => {
 					removeAttributeFilterBySlug(
 						productAttributes,

assets/js/blocks/attribute-filter/block.js

@@ -15,6 +15,7 @@ import {
 	useMemo,
 } from '@wordpress/element';
 import CheckboxList from '@woocommerce/base-components/checkbox-list';
+import { decodeEntities } from '@wordpress/html-entities';
 
 /**
  * Internal dependencies
@@ -37,7 +38,7 @@ const AttributeFilterBlock = ( {
 		( name, count ) => {
 			return (
 				<Fragment>
-					{ name }
+					{ decodeEntities( name ) }
 					{ blockAttributes.showCounts && count !== null && (
 						<span className="wc-block-attribute-filter-list-count">
 							{ count }

package.json

@@ -59,6 +59,7 @@
 		"@wordpress/jest-preset-default": "4.3.0",
 		"@wordpress/rich-text": "3.7.0",
 		"@wordpress/scripts": "3.4.0",
+		"@wordpress/html-entities": "2.5.0",
 		"autoprefixer": "9.7.2",
 		"babel-core": "7.0.0-bridge.0",
 		"babel-eslint": "10.0.3",

src/RestApi/StoreApi/Schemas/AbstractSchema.php

@@ -63,4 +63,20 @@ function( $property ) {
 			$properties
 		);
 	}
+
+	/**
+	 * Prepares HTML based content, such as post titles and content, for the API response.
+	 *
+	 * The wptexturize, convert_chars, and trim functions are also used in the `the_title` filter.
+	 * The function wp_kses_post removes disallowed HTML tags.
+	 *
+	 * @param string|array $response Data to format.
+	 * @return string|array Formatted data.
+	 */
+	protected function prepare_html_response( $response ) {
+		if ( is_array( $response ) ) {
+			return array_map( [ $this, 'prepare_html_response' ], $response );
+		}
+		return is_scalar( $response ) ? wp_kses_post( trim( convert_chars( wptexturize( $response ) ) ) ) : $response;
+	}
 }

src/RestApi/StoreApi/Schemas/CartItemSchema.php

@@ -171,8 +171,8 @@ public function get_item_response( $cart_item ) {
 			'key'        => $cart_item['key'],
 			'id'         => $product->get_id(),
 			'quantity'   => wc_stock_amount( $cart_item['quantity'] ),
-			'name'       => $product->get_title(),
-			'sku'        => $product->get_sku(),
+			'name'       => $this->prepare_html_response( $product->get_title() ),
+			'sku'        => $this->prepare_html_response( $product->get_sku() ),
 			'permalink'  => $product->get_permalink(),
 			'images'     => ( new ProductImages() )->images_to_array( $product ),
 			'price'      => wc_format_decimal( $product->get_price(), wc_get_price_decimals() ),
@@ -207,7 +207,7 @@ protected function format_variation_data( $variation_data, $product ) {
 				$label = wc_attribute_label( str_replace( 'attribute_', '', $name ), $product );
 			}
 
-			$return[ $label ] = $value;
+			$return[ $this->prepare_html_response( $label ) ] = $this->prepare_html_response( $value );
 		}
 
 		return $return;

src/RestApi/StoreApi/Schemas/ProductAttributeSchema.php

@@ -77,7 +77,7 @@ protected function get_properties() {
 	public function get_item_response( $attribute ) {
 		return [
 			'id'           => (int) $attribute->id,
-			'name'         => $attribute->name,
+			'name'         => $this->prepare_html_response( $attribute->name ),
 			'slug'         => $attribute->slug,
 			'type'         => $attribute->type,
 			'order'        => $attribute->order_by,

src/RestApi/StoreApi/Schemas/ProductSchema.php

@@ -255,11 +255,11 @@ protected function get_properties() {
 	public function get_item_response( $product ) {
 		return [
 			'id'             => $product->get_id(),
-			'name'           => $product->get_title(),
-			'variation'      => $product->is_type( 'variation' ) ? wc_get_formatted_variation( $product, true, true, false ) : '',
+			'name'           => $this->prepare_html_response( $product->get_title() ),
+			'variation'      => $this->prepare_html_response( $product->is_type( 'variation' ) ? wc_get_formatted_variation( $product, true, true, false ) : '' ),
 			'permalink'      => $product->get_permalink(),
-			'sku'            => $product->get_sku(),
-			'description'    => apply_filters( 'woocommerce_short_description', $product->get_short_description() ? $product->get_short_description() : wc_trim_string( $product->get_description(), 400 ) ),
+			'sku'            => $this->prepare_html_response( $product->get_sku() ),
+			'description'    => $this->prepare_html_response( apply_filters( 'woocommerce_short_description', $product->get_short_description() ? $product->get_short_description() : wc_trim_string( $product->get_description(), 400 ) ) ),
 			'on_sale'        => $product->is_on_sale(),
 			'prices'         => $this->get_prices( $product ),
 			'average_rating' => $product->get_average_rating(),
@@ -268,10 +268,12 @@ public function get_item_response( $product ) {
 			'has_options'    => $product->has_options(),
 			'is_purchasable' => $product->is_purchasable(),
 			'is_in_stock'    => $product->is_in_stock(),
-			'add_to_cart'    => [
-				'text'        => $product->add_to_cart_text(),
-				'description' => $product->add_to_cart_description(),
-			],
+			'add_to_cart'    => $this->prepare_html_response(
+				[
+					'text'        => $product->add_to_cart_text(),
+					'description' => $product->add_to_cart_description(),
+				]
+			),
 		];
 	}
 

src/RestApi/StoreApi/Schemas/TermSchema.php

@@ -71,8 +71,8 @@ protected function get_properties() {
 	public function get_item_response( $term ) {
 		return [
 			'id'          => (int) $term->term_id,
-			'name'        => $term->name,
-			'description' => $term->description,
+			'name'        => $this->prepare_html_response( $term->name ),
+			'description' => $this->prepare_html_response( $term->description ),
 			'slug'        => $term->slug,
 			'count'       => (int) $term->count,
 		];