add test for beta front mobile ad positions

guardian · Jan 8, 2025 · 322ad2d · 322ad2d
1 parent f43e8f1
commit 322ad2d
Show file tree

Hide file tree

Showing 2 changed files with 86 additions and 7 deletions.
diff --git a/dotcom-rendering/src/components/DecideFrontsAdSlots.tsx b/dotcom-rendering/src/components/DecideFrontsAdSlots.tsx
@@ -31,6 +31,7 @@ export const decideMerchHighAndMobileAdSlots = (
 		return (
 			<Hide from="desktop">
 				<div css={tempHighlighting('orange')}>
+					{index}
 					<AdSlot
 						data-print-layout="hide"
 						position="merchandising-high"
@@ -44,6 +45,7 @@ export const decideMerchHighAndMobileAdSlots = (
 		return (
 			<Hide from="tablet">
 				<div css={tempHighlighting('red')}>
+					{index}
 					<AdSlot
 						index={mobileAdPositions.indexOf(index)}
 						data-print-layout="hide"

diff --git a/dotcom-rendering/src/lib/getFrontsAdPositions.test.ts b/dotcom-rendering/src/lib/getFrontsAdPositions.test.ts
@@ -5,20 +5,21 @@ import {
 } from '../../fixtures/manual/frontCollections';
 import type { DCRCollectionType } from '../types/front';
 import {
+	type AdCandidate,
 	getFrontsBannerAdPositions,
 	getMobileAdPositions,
 } from './getFrontsAdPositions';
 
-const defaultTestCollections: Pick<DCRCollectionType, 'collectionType'>[] = [
-	...Array<number>(12),
-].map(() => ({
-	collectionType: 'fixed/large/slow-XIV',
-}));
+const defaultTestCollections: AdCandidate[] = [...Array<number>(12)].map(
+	() => ({ collectionType: 'fixed/large/slow-XIV' }),
+);
 
 describe('Mobile Ads', () => {
 	it(`Should not insert ad after container if it's the first one and it's a thrasher`, () => {
-		const testCollections = [...defaultTestCollections];
-		testCollections.unshift({ collectionType: 'fixed/thrasher' });
+		const testCollections = [
+			{ collectionType: 'fixed/thrasher' },
+			...defaultTestCollections,
+		] satisfies AdCandidate[];
 
 		const mobileAdPositions = getMobileAdPositions(testCollections);
 
@@ -223,6 +224,82 @@ describe('Mobile Ads', () => {
 
 		expect(mobileAdPositions).toEqual([1, 4, 6, 8, 10, 12]);
 	});
+
+	it('Europe Network Front, with beta containers and more than 4 collections, with thrashers in various places', () => {
+		const testCollections: AdCandidate[] = [
+			{ collectionType: 'flexible/general', containerLevel: 'Primary' }, // Ad position 0
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			},
+			{
+				collectionType: 'scrollable/feature',
+				containerLevel: 'Secondary',
+			}, // Ad position 4
+			{ collectionType: 'static/feature/2', containerLevel: 'Primary' },
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			}, // Ad position 6
+			{ collectionType: 'flexible/special', containerLevel: 'Primary' },
+			{ collectionType: 'fixed/thrasher' }, // Ad position 8
+			{ collectionType: 'flexible/general', containerLevel: 'Primary' },
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' }, // Ad position 10
+			{ collectionType: 'static/feature/2', containerLevel: 'Primary' },
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' }, // Ad position 14
+			{ collectionType: 'static/feature/2', containerLevel: 'Primary' },
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			},
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			},
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{ collectionType: 'fixed/thrasher' }, // Ad position 19
+			{ collectionType: 'static/feature/2', containerLevel: 'Primary' },
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			},
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			},
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			},
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' },
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			}, // Ad position 27
+			{ collectionType: 'flexible/general', containerLevel: 'Primary' },
+			{
+				collectionType: 'scrollable/medium',
+				containerLevel: 'Secondary',
+			},
+			{ collectionType: 'scrollable/small', containerLevel: 'Secondary' }, // Ad position 30
+			{ collectionType: 'flexible/general', containerLevel: 'Primary' },
+			{
+				collectionType: 'scrollable/feature',
+				containerLevel: 'Secondary',
+			},
+			{ collectionType: 'news/most-popular' },
+		];
+
+		const mobileAdPositions = getMobileAdPositions(testCollections);
+
+		expect(mobileAdPositions).toEqual([0, 4, 6, 8, 10, 14, 19, 27, 30, 32]);
+	});
 });
 
 describe('Standard fronts fronts-banner ad slots', () => {