prevent ad placeholder elements being inserted for articles where shouldHideAds is true

Author: cemms1

dotcom-rendering/src/model/enhance-ad-placeholders.test.ts

@@ -96,7 +96,11 @@ describe('Enhancing ad placeholders', () => {
 			const expectedPlaceholders = expectedPositions.length;
 			const input: FEElement[] = elements;
 
-			const output = enhanceAdPlaceholders(exampleFormat, 'Apps')(input);
+			const output = enhanceAdPlaceholders(
+				exampleFormat,
+				'Apps',
+				false,
+			)(input);
 			const placeholderIndices = output.flatMap((el, idx) =>
 				elementIsAdPlaceholder(el) ? [idx] : [],
 			);
@@ -115,7 +119,7 @@ describe('Enhancing ad placeholders', () => {
 		},
 	);
 
-	describe('should not insert an ad placeholder before an inline image element, but can insert it after the image', () => {
+	it('should not insert an ad placeholder before an inline image element, but can insert it after the image', () => {
 		const threeParagraphs = getTestParagraphElements(3);
 
 		const elements = [
@@ -126,7 +130,11 @@ describe('Enhancing ad placeholders', () => {
 
 		const input: FEElement[] = elements;
 
-		const output = enhanceAdPlaceholders(exampleFormat, 'Apps')(input);
+		const output = enhanceAdPlaceholders(
+			exampleFormat,
+			'Apps',
+			false,
+		)(input);
 		const outputPlaceholders = output.filter(elementIsAdPlaceholder);
 
 		expect(outputPlaceholders.length).toEqual(1);
@@ -139,7 +147,7 @@ describe('Enhancing ad placeholders', () => {
 		expect(placeholderIndices).toEqual([4]);
 	});
 
-	describe('should not insert an ad placeholder after a thumbnail image element', () => {
+	it('should not insert an ad placeholder after a thumbnail image element', () => {
 		const threeParagraphs = getTestParagraphElements(3);
 
 		const elements = [
@@ -150,7 +158,11 @@ describe('Enhancing ad placeholders', () => {
 
 		const input: FEElement[] = elements;
 
-		const output = enhanceAdPlaceholders(exampleFormat, 'Apps')(input);
+		const output = enhanceAdPlaceholders(
+			exampleFormat,
+			'Apps',
+			false,
+		)(input);
 		const outputPlaceholders = output.filter(elementIsAdPlaceholder);
 
 		expect(outputPlaceholders.length).toEqual(1);
@@ -163,7 +175,7 @@ describe('Enhancing ad placeholders', () => {
 		expect(placeholderIndices).toEqual([5]);
 	});
 
-	describe('should not insert an ad placeholder after an element which is not an image or text', () => {
+	it('should not insert an ad placeholder after an element which is not an image or text', () => {
 		const threeParagraphs = getTestParagraphElements(3);
 
 		const elements = [
@@ -174,7 +186,11 @@ describe('Enhancing ad placeholders', () => {
 
 		const input: FEElement[] = elements;
 
-		const output = enhanceAdPlaceholders(exampleFormat, 'Apps')(input);
+		const output = enhanceAdPlaceholders(
+			exampleFormat,
+			'Apps',
+			false,
+		)(input);
 		const outputPlaceholders = output.filter(elementIsAdPlaceholder);
 
 		expect(outputPlaceholders.length).toEqual(1);
@@ -186,4 +202,17 @@ describe('Enhancing ad placeholders', () => {
 		// Expect one placeholder to be present after the fifth element only
 		expect(placeholderIndices).toEqual([5]);
 	});
+
+	it('should not insert ad placeholders if shouldHideAds is true', () => {
+		const input: FEElement[] = getTestParagraphElements(6);
+
+		const output = enhanceAdPlaceholders(
+			exampleFormat,
+			'Apps',
+			true,
+		)(input);
+		const outputPlaceholders = output.filter(elementIsAdPlaceholder);
+
+		expect(outputPlaceholders.length).toEqual(0);
+	});
 });

dotcom-rendering/src/model/enhance-ad-placeholders.ts

@@ -135,9 +135,14 @@ const insertAdPlaceholders = (elements: FEElement[]): FEElement[] => {
 };
 
 export const enhanceAdPlaceholders =
-	(format: ArticleFormat, renderingTarget: RenderingTarget) =>
+	(
+		format: ArticleFormat,
+		renderingTarget: RenderingTarget,
+		shouldHideAds: boolean,
+	) =>
 	(elements: FEElement[]): FEElement[] =>
 		renderingTarget === 'Apps' &&
+		!shouldHideAds &&
 		format.design !== ArticleDesign.LiveBlog &&
 		format.design !== ArticleDesign.DeadBlog
 			? insertAdPlaceholders(elements)

dotcom-rendering/src/model/enhanceBlocks.ts

@@ -32,6 +32,7 @@ type Options = {
 	hasAffiliateLinksDisclaimer: boolean;
 	audioArticleImage?: ImageBlockElement;
 	tags?: TagType[];
+	shouldHideAds: boolean;
 };
 
 const enhanceNewsletterSignup =
@@ -76,7 +77,11 @@ export const enhanceElements =
 				options.promotedNewsletter,
 				blockId,
 			),
-			enhanceAdPlaceholders(format, options.renderingTarget),
+			enhanceAdPlaceholders(
+				format,
+				options.renderingTarget,
+				options.shouldHideAds,
+			),
 			enhanceDisclaimer(options.hasAffiliateLinksDisclaimer),
 		].reduce(
 			(enhancedBlocks, enhancer) => enhancer(enhancedBlocks),

dotcom-rendering/src/model/pinnedPost.ts

@@ -17,5 +17,6 @@ export const enhancePinnedPost = (
 		imagesForLightbox: [],
 		promotedNewsletter: undefined,
 		hasAffiliateLinksDisclaimer: false,
+		shouldHideAds: false,
 	})[0];
 };

dotcom-rendering/src/server/handler.article.apps.ts

@@ -59,6 +59,7 @@ export const handleAppsBlocks: RequestHandler = ({ body }, res) => {
 		promotedNewsletter: undefined,
 		imagesForLightbox: [],
 		hasAffiliateLinksDisclaimer: false,
+		shouldHideAds,
 	});
 	const html = renderAppsBlocks({
 		blocks: enhancedBlocks,

dotcom-rendering/src/server/handler.article.web.ts

@@ -78,6 +78,7 @@ export const handleBlocks: RequestHandler = ({ body }, res) => {
 		promotedNewsletter: undefined,
 		imagesForLightbox: [],
 		hasAffiliateLinksDisclaimer: false,
+		shouldHideAds,
 	});
 	const html = renderBlocks({
 		blocks: enhancedBlocks,

dotcom-rendering/src/types/article.ts

@@ -90,6 +90,7 @@ export const enhanceArticleType = (
 		hasAffiliateLinksDisclaimer: !!data.affiliateLinksDisclaimer,
 		audioArticleImage: data.audioArticleImage,
 		tags: data.tags,
+		shouldHideAds: data.shouldHideAds,
 	});
 
 	const crosswordBlock = buildCrosswordBlock(data);