diff --git a/ab-testing/config/abTests.ts b/ab-testing/config/abTests.ts index 2efeabe4a67..d3f27827c7b 100644 --- a/ab-testing/config/abTests.ts +++ b/ab-testing/config/abTests.ts @@ -215,7 +215,7 @@ const ABTests: ABTest[] = [ status: "ON", audienceSize: 0 / 100, audienceSpace: "B", - groups: ["control", "variant"], + groups: ["control", "variant", "variant2"], shouldForceMetricsCollection: true, }, { diff --git a/dotcom-rendering/src/components/StickyBottomBanner.island.tsx b/dotcom-rendering/src/components/StickyBottomBanner.island.tsx index 00a3168518c..953e5d0f7ad 100644 --- a/dotcom-rendering/src/components/StickyBottomBanner.island.tsx +++ b/dotcom-rendering/src/components/StickyBottomBanner.island.tsx @@ -125,6 +125,7 @@ const buildRRBannerConfigWith = ({ pageId, inHoldbackGroup, inAuxiaVariant, + inNoShowMobileAboveNavVariant, }: { isSignedIn: boolean; countryCode: CountryCode; @@ -144,6 +145,7 @@ const buildRRBannerConfigWith = ({ pageId?: string; inHoldbackGroup?: boolean; inAuxiaVariant?: boolean; + inNoShowMobileAboveNavVariant?: boolean; }): CandidateConfig> => { return { candidate: { @@ -182,6 +184,7 @@ const buildRRBannerConfigWith = ({ pageId, inHoldbackGroup, inAuxiaVariant, + inNoShowMobileAboveNavVariant, }), show: ({ name, props }: ModuleData) => ( @@ -339,6 +342,11 @@ export const StickyBottomBanner = ({ 'control', ) ?? false, inAuxiaVariant, + inNoShowMobileAboveNavVariant: + abTests?.isUserInTestGroup( + 'commercial-mobile-above-nav-test', + 'variant2', + ) ?? false, }); const brazeArticleContext: BrazeArticleContext = { section: sectionId, diff --git a/dotcom-rendering/src/components/StickyBottomBanner/ReaderRevenueBanner.tsx b/dotcom-rendering/src/components/StickyBottomBanner/ReaderRevenueBanner.tsx index caaf2996745..8b79029ea46 100644 --- a/dotcom-rendering/src/components/StickyBottomBanner/ReaderRevenueBanner.tsx +++ b/dotcom-rendering/src/components/StickyBottomBanner/ReaderRevenueBanner.tsx @@ -52,6 +52,7 @@ type BaseProps = { pageId?: string; inHoldbackGroup?: boolean; inAuxiaVariant?: boolean; + inNoShowMobileAboveNavVariant?: boolean; }; type BuildPayloadProps = BaseProps & { @@ -76,6 +77,19 @@ export type CanShowFunctionType = ( props: CanShowProps, ) => Promise>; +// the test includes the crossword pages (tag type/crossword) and the crosswords front (pageId === 'crosswords') +const isInMobileAboveNavTest = ( + tags: TagType[], + renderingTarget: RenderingTarget, + pageId?: string, +): boolean => { + return ( + (tags.some((tag) => tag.id === 'type/crossword') || + pageId === 'crosswords') && + renderingTarget === 'Web' + ); +}; + const getArticleCountToday = ( articleCounts: ArticleCounts | undefined, ): number | undefined => { @@ -209,7 +223,15 @@ export const canShowRRBanner: CanShowFunctionType< pageId, inHoldbackGroup, inAuxiaVariant, + inNoShowMobileAboveNavVariant, }) => { + if ( + inNoShowMobileAboveNavVariant === true && + isInMobileAboveNavTest(tags, renderingTarget, pageId) + ) { + return { show: false }; + } + if (!remoteBannerConfig) { return { show: false }; } diff --git a/dotcom-rendering/src/layouts/CrosswordLayout.tsx b/dotcom-rendering/src/layouts/CrosswordLayout.tsx index 9cdca5f7ca6..dca13427980 100644 --- a/dotcom-rendering/src/layouts/CrosswordLayout.tsx +++ b/dotcom-rendering/src/layouts/CrosswordLayout.tsx @@ -31,6 +31,7 @@ import { SubMeta } from '../components/SubMeta'; import { SubNav } from '../components/SubNav.island'; import { type ArticleFormat, ArticleSpecial } from '../lib/articleFormat'; import { canRenderAds } from '../lib/canRenderAds'; +import { shouldShowMobileAboveNavSlot } from '../lib/commercialMobileAboveNavTest'; import { getContributionsServiceUrl } from '../lib/contributions'; import type { NavType } from '../model/extract-nav'; import { palette as themePalette } from '../palette'; @@ -139,11 +140,11 @@ export const CrosswordLayout = (props: Props) => { shouldCenter={false} > diff --git a/dotcom-rendering/src/layouts/FrontLayout.tsx b/dotcom-rendering/src/layouts/FrontLayout.tsx index 15ee7b2183a..46732361c6d 100644 --- a/dotcom-rendering/src/layouts/FrontLayout.tsx +++ b/dotcom-rendering/src/layouts/FrontLayout.tsx @@ -35,6 +35,7 @@ import { MAX_FRONTS_BANNER_ADS as maxDesktopAds, MAX_FRONTS_MOBILE_ADS as maxMobileAds, } from '../lib/commercial-constants'; +import { shouldShowMobileAboveNavSlot } from '../lib/commercialMobileAboveNavTest'; import { getContributionsServiceUrl } from '../lib/contributions'; import { editionList } from '../lib/edition'; import { @@ -218,9 +219,11 @@ export const FrontLayout = ({ front, NAV }: Props) => { diff --git a/dotcom-rendering/src/lib/commercialMobileAboveNavTest.ts b/dotcom-rendering/src/lib/commercialMobileAboveNavTest.ts new file mode 100644 index 00000000000..7300140b9c3 --- /dev/null +++ b/dotcom-rendering/src/lib/commercialMobileAboveNavTest.ts @@ -0,0 +1,3 @@ +export const shouldShowMobileAboveNavSlot = (testGroup?: string): boolean => { + return testGroup === 'variant' || testGroup === 'variant2'; +}; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4e91bd585a0..2c6121dedce 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -377,16 +377,16 @@ importers: version: link:../config '@sveltejs/adapter-auto': specifier: 7.0.1 - version: 7.0.1(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0))) + version: 7.0.1(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0))) '@sveltejs/adapter-static': specifier: 3.0.10 - version: 3.0.10(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0))) + version: 3.0.10(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0))) '@sveltejs/kit': specifier: 2.70.3 - version: 2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)) + version: 2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)) '@sveltejs/vite-plugin-svelte': specifier: 7.3.0 - version: 7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)) + version: 7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)) svelte: specifier: 5.57.0 version: 5.57.0(@typescript-eslint/types@8.59.2) @@ -14425,19 +14425,19 @@ snapshots: dependencies: acorn: 8.18.0 - '@sveltejs/adapter-auto@7.0.1(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))': + '@sveltejs/adapter-auto@7.0.1(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))': dependencies: - '@sveltejs/kit': 2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)) + '@sveltejs/kit': 2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)) - '@sveltejs/adapter-static@3.0.10(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))': + '@sveltejs/adapter-static@3.0.10(@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))': dependencies: - '@sveltejs/kit': 2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)) + '@sveltejs/kit': 2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)) - '@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0))': + '@sveltejs/kit@2.70.3(@opentelemetry/api@1.9.1)(@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)))(svelte@5.57.0(@typescript-eslint/types@8.59.2))(typescript@6.0.3)(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0))': dependencies: '@standard-schema/spec': 1.1.0 '@sveltejs/acorn-typescript': 1.0.13(acorn@8.18.0) - '@sveltejs/vite-plugin-svelte': 7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)) + '@sveltejs/vite-plugin-svelte': 7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)) '@types/cookie': 0.6.0 acorn: 8.18.0 cookie: 0.6.0 @@ -14456,14 +14456,14 @@ snapshots: '@sveltejs/load-config@0.2.3': {} - '@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0))': + '@sveltejs/vite-plugin-svelte@7.3.0(svelte@5.57.0(@typescript-eslint/types@8.59.2))(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0))': dependencies: deepmerge: 4.3.1 magic-string: 1.2.2 obug: 2.1.4 svelte: 5.57.0(@typescript-eslint/types@8.59.2) vite: 6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0) - vitefu: 1.1.3(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)) + vitefu: 1.1.3(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)) '@svgr/babel-plugin-add-jsx-attribute@8.0.0(@babel/core@7.29.0(supports-color@8.1.1))': dependencies: @@ -20767,7 +20767,7 @@ snapshots: tsx: 4.23.13 yaml: 2.9.0 - vitefu@1.1.3(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)): + vitefu@1.1.3(vite@6.4.3(@types/node@24.12.4)(terser@5.51.2)(yaml@2.9.0)): optionalDependencies: vite: 6.4.3(@types/node@24.12.4)(terser@5.51.2)(tsx@4.23.13)(yaml@2.9.0)