Add middleware to extract AB tests from query params in dev server

Author: dskamiotis

dotcom-rendering/src/server/lib/add-queryparams-to-abtests.ts

@@ -0,0 +1,29 @@
+import type { Handler } from 'express';
+import { validateAsFEArticle } from '../../../src/model/validate';
+
+export const addQueryParamsToABTests: Handler = async (req, res, next) => {
+	try {
+		const frontendData = validateAsFEArticle(req.body);
+
+		const { config } = frontendData;
+
+		const queryParamsAb = req.query;
+
+		const filteredQuery: Record<string, string> = {};
+		for (const [key, value] of Object.entries(queryParamsAb)) {
+			if (typeof value == 'string' && key.startsWith('ab-')) {
+				const testId = key.replace(/^ab-/, '');
+				filteredQuery[testId] = value;
+			}
+		}
+
+		config.serverSideABTests = {
+			...config.serverSideABTests,
+			...filteredQuery,
+		};
+		req.body = frontendData;
+	} catch (error) {
+		return next();
+	}
+	next();
+};

dotcom-rendering/src/server/server.dev.ts

@@ -20,6 +20,7 @@ import {
 	handleFootballMatchPage,
 	handleFootballTablesPage,
 } from './handler.sportDataPage.web';
+import { addQueryParamsToABTests } from './lib/add-queryparams-to-abtests';
 import { getContentFromURLMiddleware } from './lib/get-content-from-url';
 
 /** article URLs contain a part that looks like “2022/nov/25” */
@@ -89,6 +90,7 @@ const renderer = Router();
 // populates req.body with the content data from a production
 // URL if req.params.url is present
 renderer.use(getContentFromURLMiddleware);
+renderer.use(addQueryParamsToABTests);
 renderer.get('/Article/*url', handleArticle);
 renderer.get('/Interactive/*url', handleInteractive);
 renderer.get('/Blocks/*url', handleBlocks);