remove html from primary heading for carousel and horizontal cards

Author: oliverabrahams

dotcom-rendering/src/model/enhanceProductElement.ts

@@ -1,3 +1,4 @@
+import { JSDOM } from 'jsdom';
 import type {
 	FEElement,
 	ProductBlockElement,
@@ -13,6 +14,7 @@ const enhanceProductBlockElement = (
 	...element,
 	content: elementsEnhancer(element.content),
 	lowestPrice: getLowestPrice(element.productCtas),
+	primaryHeadingText: getHeadingText(element.primaryHeadingHtml),
 });
 
 /**
@@ -72,3 +74,15 @@ export const enhanceProductElement =
 	(elementsEnhancer: ElementsEnhancer) =>
 	(elements: FEElement[]): FEElement[] =>
 		elements.flatMap(enhance(elementsEnhancer));
+
+const getHeadingText = (headingHtml: string): string => {
+	return removeTrailingColon(extractText(headingHtml));
+};
+
+const removeTrailingColon = (text: string): string => {
+	return text.replace(/\s*:\s*$/, '');
+};
+
+const extractText = (html: string): string => {
+	return JSDOM.fragment(html).textContent?.trim() ?? '';
+};

dotcom-rendering/src/types/content.ts

@@ -480,6 +480,7 @@ export interface ProductBlockElement {
 	image?: ProductImage;
 	secondaryHeadingHtml: string;
 	primaryHeadingHtml: string;
+	primaryHeadingText?: string;
 	customAttributes: ProductCustomAttribute[];
 	content: FEElement[];
 	h2Id?: string;