Merge branch 'main' into ds/force-ab-test-participation-in-development

Author: SiAdcock

ab-testing/config/abTests.ts

@@ -53,7 +53,7 @@ const ABTests: ABTest[] = [
 		status: "ON",
 		expirationDate: "2025-12-30",
 		type: "server",
-		audienceSize: 0 / 100,
+		audienceSize: 10 / 100,
 		groups: ["control", "variant"],
 		shouldForceMetricsCollection: false,
 	},

dotcom-rendering/package.json

@@ -102,7 +102,6 @@
 		"constructs": "10.4.2",
 		"cpy": "11.0.0",
 		"css-loader": "7.1.2",
-		"curlyquotes": "1.5.5",
 		"dompurify": "3.2.4",
 		"dynamic-import-polyfill": "0.1.1",
 		"eslint": "8.57.1",

dotcom-rendering/src/components/Card/Card.tsx

@@ -844,7 +844,6 @@ export const Card = ({
 			format={format}
 			showTopBarDesktop={showTopBarDesktop}
 			showTopBarMobile={showTopBarMobile}
-			isOnwardContent={isOnwardContent}
 			containerPalette={containerPalette}
 		>
 			<CardLink
@@ -1081,10 +1080,6 @@ export const Card = ({
 											imageSize={mediaSize}
 											alt={headlineText}
 											loading={imageLoading}
-											roundedCorners={
-												isOnwardContent &&
-												!isMoreGalleriesOnwardContent
-											}
 											aspectRatio={aspectRatio}
 										/>
 									</div>
@@ -1098,10 +1093,6 @@ export const Card = ({
 									imageSize={mediaSize}
 									alt={media.imageAltText}
 									loading={imageLoading}
-									roundedCorners={
-										isOnwardContent &&
-										!isMoreGalleriesOnwardContent
-									}
 									aspectRatio={aspectRatio}
 								/>
 								{isVideoMainMedia && mainMedia.duration > 0 && (
@@ -1143,10 +1134,6 @@ export const Card = ({
 											imageSize="small"
 											alt={media.imageAltText}
 											loading={imageLoading}
-											roundedCorners={
-												isOnwardContent &&
-												!isMoreGalleriesOnwardContent
-											}
 											aspectRatio="1:1"
 										/>
 									</div>

dotcom-rendering/src/components/Card/components/CardWrapper.tsx

@@ -1,6 +1,6 @@
 import { css } from '@emotion/react';
 import { from, space, until } from '@guardian/source/foundations';
-import { ArticleDesign, type ArticleFormat } from '../../../lib/articleFormat';
+import type { ArticleFormat } from '../../../lib/articleFormat';
 import { palette } from '../../../palette';
 import type { DCRContainerPalette } from '../../../types/front';
 import { ContainerOverrides } from '../../ContainerOverrides';
@@ -11,7 +11,6 @@ type Props = {
 	format: ArticleFormat;
 	showTopBarDesktop: boolean;
 	showTopBarMobile: boolean;
-	isOnwardContent: boolean;
 	containerPalette?: DCRContainerPalette;
 };
 
@@ -93,21 +92,11 @@ const desktopTopBarStyles = css`
 	}
 `;
 
-const onwardContentStyles = css`
-	border-radius: ${space[2]}px;
-	overflow: hidden;
-
-	:hover .media-overlay {
-		border-radius: ${space[2]}px;
-	}
-`;
-
 export const CardWrapper = ({
 	children,
 	format,
 	showTopBarDesktop,
 	showTopBarMobile,
-	isOnwardContent,
 	containerPalette,
 }: Props) => {
 	return (
@@ -119,9 +108,6 @@ export const CardWrapper = ({
 						hoverStyles,
 						showTopBarDesktop && desktopTopBarStyles,
 						showTopBarMobile && mobileTopBarStyles,
-						isOnwardContent &&
-							format.design !== ArticleDesign.Gallery &&
-							onwardContentStyles,
 					]}
 				>
 					{children}

dotcom-rendering/src/components/CardPicture.tsx

@@ -1,5 +1,5 @@
 import { css } from '@emotion/react';
-import { breakpoints, space, until } from '@guardian/source/foundations';
+import { breakpoints, until } from '@guardian/source/foundations';
 import type { ImgHTMLAttributes } from 'react';
 import React from 'react';
 import type { AspectRatio } from '../types/front';
@@ -14,7 +14,6 @@ export type Props = {
 	mainImage: string;
 	loading: Loading;
 	alt?: string;
-	roundedCorners?: boolean;
 	isCircular?: boolean;
 	aspectRatio?: AspectRatio;
 	mobileAspectRatio?: AspectRatio;
@@ -200,12 +199,6 @@ const decideAspectRatioStyles = (aspectRatio?: AspectRatio) => {
 	`;
 };
 
-const borderRadius = css`
-	& > * {
-		border-radius: ${space[2]}px;
-	}
-`;
-
 const circularStyles = css`
 	border-radius: 100%;
 	object-fit: cover;
@@ -227,7 +220,6 @@ export const CardPicture = ({
 	alt,
 	imageSize,
 	loading,
-	roundedCorners,
 	isCircular,
 	aspectRatio = '5:3',
 	mobileAspectRatio,
@@ -251,7 +243,6 @@ export const CardPicture = ({
 				decideAspectRatioStyles(aspectRatio),
 				mobileAspectRatio &&
 					decideMobileAspectRatioStyles(mobileAspectRatio),
-				roundedCorners && borderRadius,
 				isCircular && circularStyles,
 			]}
 		>

dotcom-rendering/src/components/ListenToArticle.importable.tsx

@@ -1,9 +1,6 @@
 import { log } from '@guardian/libs';
 import { useEffect, useState } from 'react';
-import {
-	getListenToArticleClient,
-	getNativeABTestingClient,
-} from '../lib/bridgetApi';
+import { getListenToArticleClient } from '../lib/bridgetApi';
 import { useIsBridgetCompatible } from '../lib/useIsBridgetCompatible';
 import { ListenToArticleButton } from './ListenToArticleButton';
 
@@ -37,39 +34,19 @@ export const ListenToArticle = ({ articleId }: Props) => {
 	useEffect(() => {
 		if (isBridgetCompatible) {
 			Promise.all([
-				// AB TESTING native
-				getNativeABTestingClient().getParticipations(),
 				getListenToArticleClient().isAvailable(articleId),
 				getListenToArticleClient().isPlaying(articleId),
 				getListenToArticleClient().getAudioDurationSeconds(articleId),
 			])
-				.then(
-					([
-						abParticipations,
-						isAvailable,
-						isPlaying,
-						durationSeconds,
-					]) => {
-						// AB TESTING native start
-						const variant = abParticipations.get(
-							'l2a_article_button_test',
-						);
-						if (variant === 'no-button') {
-							setShowButton(false);
-						} else if (variant === 'with-duration') {
-							setAudioDurationSeconds(
-								typeof durationSeconds === 'number' &&
-									durationSeconds > 0
-									? durationSeconds
-									: undefined,
-							);
-							setShowButton(isAvailable && !isPlaying);
-						} else if (variant === 'without-duration') {
-							setShowButton(isAvailable && !isPlaying);
-						}
-						// AB TESTING native ends
-					},
-				)
+				.then(([isAvailable, isPlaying, durationSeconds]) => {
+					setAudioDurationSeconds(
+						typeof durationSeconds === 'number' &&
+							durationSeconds > 0
+							? durationSeconds
+							: undefined,
+					);
+					setShowButton(isAvailable && !isPlaying);
+				})
 				.catch((error) => {
 					console.error(
 						'Error fetching article audio status: ',

dotcom-rendering/src/components/SignInGate/signInGateMappings.ts

@@ -1,20 +1,14 @@
 import type { ABTest } from '@guardian/ab-core';
 import { abTestTest } from './tests/ab-test-test';
-import { auxiaSignInGate } from './tests/auxia-sign-in-gate';
 import { noAuxiaSignInGate } from './tests/no-auxia-sign-in-gate';
 import { personalisedHighlights } from './tests/personalised-highlights';
-import { signInGateMainControl } from './tests/sign-in-gate-main-control';
-import { signInGateMainVariant } from './tests/sign-in-gate-main-variant';
 import { userBenefitsApi } from './tests/user-benefits-api';
 
 // keep in sync with ab-tests in frontend
 // https://github.com/guardian/frontend/tree/main/static/src/javascripts/projects/common/modules/experiments/ab-tests.ts
 export const tests: ABTest[] = [
 	abTestTest,
-	signInGateMainVariant,
-	signInGateMainControl,
 	userBenefitsApi,
-	auxiaSignInGate,
 	personalisedHighlights,
 	noAuxiaSignInGate,
 ];