From d4a5c00373904a92edd9763ab12b55dd6eed409e Mon Sep 17 00:00:00 2001
From: Xinyi Feng <105081458+FentPams@users.noreply.github.com>
Date: Tue, 20 Aug 2024 12:44:59 -0700
Subject: [PATCH] test: add tests for page level redirects (#45)

<!--- Provide a general summary of your changes in the Title above -->
## Description
<!--- Describe your changes in detail -->
**To test:**
 1. RUM is fired before redirect
2. Page is successfully redirected in all three cases (experiments,
campaigns, audiences)

**Finding:**
1. Tried different ways to override the `window.location.replace () ` to
let it do nothing when testing RUM is fired before redirect.
However, some browsers have strict security restriction that don't allow
certain function to be overridden, which leads to test fails.
2. Modify the script before its execution. The line with
`window.location.replace () ` is commented out before the script is
executed and security policies are applied.

## Types of changes

<!--- What types of changes does your code introduce? Put an `x` in all
the boxes that apply: -->

- [ ] Bug fix (non-breaking change which fixes an issue)
- [ ] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality to change)

## Checklist:

<!--- Go over all the following points, and put an `x` in all the boxes
that apply. -->
<!--- If you're unsure about any of these, don't hesitate to ask. We're
here to help! -->

- [x] I have signed the [Adobe Open Source
CLA](https://opensource.adobe.com/cla.html).
- [x] My code follows the code style of this project.
- [ ] My change requires a change to the documentation.
- [ ] I have updated the documentation accordingly.
- [x] I have read the **CONTRIBUTING** document.
- [x] I have added tests to cover my changes.
- [x] All new and existing tests passed.

---------

Co-authored-by: Julien Ramboz <ramboz@adobe.com>
---
 documentation/experiments.md                  |  2 +-
 package.json                                  |  2 +-
 tests/audiences.test.js                       | 18 ++++++++++
 tests/campaigns.test.js                       | 18 ++++++++++
 tests/experiments.test.js                     | 34 +++++++++++++++++++
 .../audiences/page-level--redirect.html       | 20 +++++++++++
 .../campaigns/page-level--redirect.html       | 19 +++++++++++
 .../experiments/page-level--redirect.html     | 12 +++++++
 tests/utils.js                                |  2 +-
 9 files changed, 124 insertions(+), 3 deletions(-)
 create mode 100644 tests/fixtures/audiences/page-level--redirect.html
 create mode 100644 tests/fixtures/campaigns/page-level--redirect.html
 create mode 100644 tests/fixtures/experiments/page-level--redirect.html

diff --git a/documentation/experiments.md b/documentation/experiments.md
index 38c5be5..bf2b0ac 100644
--- a/documentation/experiments.md
+++ b/documentation/experiments.md
@@ -136,7 +136,7 @@ For the use case that fully redirect to the target URL instead of just replacing
 | Experiment Variants   | [https://{ref}--{repo}--{org}.hlx.page/my-page-variant-1](), [https://{ref}--{repo}--{org}.hlx.page/my-page-variant-2](), [https://{ref}--{repo}--{org}.hlx.page/my-page-variant-3]() |
 | Experiment Resolution     | redirect
 
-In this example, the Hero Test experiment will redirect to one of the specified URLs when you simulate that variant.
+In this example, the Hero Test experiment will redirect to one of the specified URLs based on the selected variant.
 
 Similarly, the redirects for audience personalization and campaign personalization could be enabled by adding:
 
diff --git a/package.json b/package.json
index 6b8a714..d8bf5ce 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
   "version": "1.0.1",
   "main": "src/index.js",
   "scripts": {
-    "lint:js": "eslint src",
+    "lint:js": "eslint src tests",
     "lint:css": "stylelint src/**/*.css --allow-empty-input",
     "lint": "npm run lint:js && npm run lint:css",
     "start": "http-server . -p 3000",
diff --git a/tests/audiences.test.js b/tests/audiences.test.js
index 62b0ef4..8ce57cc 100644
--- a/tests/audiences.test.js
+++ b/tests/audiences.test.js
@@ -65,6 +65,24 @@ test.describe('Page-level audiences', () => {
     ]);
   });
 
+  test('Track RUM is fired before redirect.', async ({ page }) => {
+    const rumCalls = [];
+    await page.exposeFunction('logRumCall', (...args) => rumCalls.push(args));
+    await page.addInitScript(() => {
+      window.hlx = { rum: { sampleRUM: (...args) => window.logRumCall(args) } };
+    });
+    await page.goto('/tests/fixtures/audiences/page-level--redirect');
+    await page.waitForURL('/tests/fixtures/audiences/variant-1');
+    expect(await page.evaluate(() => window.document.body.innerText)).toEqual('Hello v1!');
+    expect(rumCalls[0]).toContainEqual([
+      'audience',
+      {
+        source: 'foo',
+        target: 'foo:bar',
+      },
+    ]);
+  });
+
   test('Exposes the audiences in a JS API.', async ({ page }) => {
     await goToAndRunAudience(page, '/tests/fixtures/audiences/page-level');
     expect(await page.evaluate(() => window.hlx.audiences)).toContainEqual(
diff --git a/tests/campaigns.test.js b/tests/campaigns.test.js
index 45277f2..1c4fef3 100644
--- a/tests/campaigns.test.js
+++ b/tests/campaigns.test.js
@@ -75,6 +75,24 @@ test.describe('Page-level campaigns', () => {
     ]);
   });
 
+  test('Track RUM is fired before redirect.', async ({ page }) => {
+    const rumCalls = [];
+    await page.exposeFunction('logRumCall', (...args) => rumCalls.push(args));
+    await page.addInitScript(() => {
+      window.hlx = { rum: { sampleRUM: (...args) => window.logRumCall(args) } };
+    });
+    await page.goto('/tests/fixtures/campaigns/page-level--redirect?campaign=bar');
+    await page.waitForURL('/tests/fixtures/campaigns/variant-2');
+    expect(await page.evaluate(() => window.document.body.innerText)).toEqual('Hello v2!');
+    expect(rumCalls[0]).toContainEqual([
+      'audience',
+      {
+        source: 'bar',
+        target: 'foo:bar',
+      },
+    ]);
+  });
+
   test('Exposes the campaign in a JS API.', async ({ page }) => {
     await goToAndRunCampaign(page, '/tests/fixtures/campaigns/page-level?campaign=bar');
     expect(await page.evaluate(() => window.hlx.campaigns)).toContainEqual(
diff --git a/tests/experiments.test.js b/tests/experiments.test.js
index 8405c7b..e6380ad 100644
--- a/tests/experiments.test.js
+++ b/tests/experiments.test.js
@@ -117,6 +117,40 @@ test.describe('Page-level experiments', () => {
     ]);
   });
 
+  test('Track RUM is fired before redirect', async ({ page }) => {
+    const rumCalls = [];
+    await page.exposeFunction('logRumCall', (...args) => rumCalls.push(args));
+    await page.addInitScript(() => {
+      window.hlx = { rum: { sampleRUM: (...args) => window.logRumCall(args) } };
+    });
+    await page.goto('/tests/fixtures/experiments/page-level--redirect');
+    await page.waitForFunction(() => window.hlx.rum.sampleRUM);
+    expect(rumCalls[0]).toContainEqual([
+      'experiment',
+      {
+        source: 'foo',
+        target: expect.stringMatching(/control|challenger-1|challenger-2/),
+      },
+    ]);
+
+    const expectedContent = {
+      v1: 'Hello v1!',
+      v2: 'Hello v2!',
+      redirect: 'Hello World!',
+    };
+    const expectedUrlPath = {
+      v1: '/tests/fixtures/experiments/page-level-v1',
+      v2: '/tests/fixtures/experiments/page-level-v2',
+      redirect: '/tests/fixtures/experiments/page-level--redirect',
+    };
+    const url = new URL(page.url());
+    const variant = Object.keys(expectedUrlPath).find((k) => url.pathname.endsWith(k));
+    expect(await page.evaluate(() => window.document.body.innerText)).toMatch(
+      new RegExp(expectedContent[variant]),
+    );
+    expect(expectedUrlPath[variant]).toBe(url.pathname);
+  });
+
   test('Exposes the experiment in a JS API.', async ({ page }) => {
     await goToAndRunExperiment(page, '/tests/fixtures/experiments/page-level');
     expect(await page.evaluate(() => window.hlx.experiments)).toContainEqual(
diff --git a/tests/fixtures/audiences/page-level--redirect.html b/tests/fixtures/audiences/page-level--redirect.html
new file mode 100644
index 0000000..fc061f7
--- /dev/null
+++ b/tests/fixtures/audiences/page-level--redirect.html
@@ -0,0 +1,20 @@
+<html>
+<head>
+  <meta name="audience-foo" content="/tests/fixtures/audiences/variant-1"/>
+  <meta name="audience-bar" content="/tests/fixtures/audiences/variant-2"/>
+  <meta name="audience-resolution" content="redirect"/>
+  <meta property="audience:-foo" content="/tests/fixtures/audiences/variant-1"/>
+  <script>
+    window.AUDIENCES = {
+      foo: () => true,
+      bar: () => true,
+    }
+  </script>
+  <script type="module" src="/tests/fixtures/scripts.js"></script>
+</head>
+<body>
+  <main>
+    <div>Hello World!</div>
+  </main>
+</body>
+</html>
\ No newline at end of file
diff --git a/tests/fixtures/campaigns/page-level--redirect.html b/tests/fixtures/campaigns/page-level--redirect.html
new file mode 100644
index 0000000..79714b2
--- /dev/null
+++ b/tests/fixtures/campaigns/page-level--redirect.html
@@ -0,0 +1,19 @@
+<html>
+<head>
+  <meta name="campaign-foo" content="/tests/fixtures/campaigns/variant-1"/>
+  <meta name="campaign-bar" content="/tests/fixtures/campaigns/variant-2"/>
+  <meta name="campaign-resolution" content="redirect"/>
+  <script type="module" src="/tests/fixtures/scripts.js"></script>
+  <script>
+    window.AUDIENCES = {
+      foo: () => true,
+      bar: () => true,
+    }
+  </script>
+</head>
+<body>
+  <main>
+    <div>Hello World!</div>
+  </main>
+</body>
+</html>
\ No newline at end of file
diff --git a/tests/fixtures/experiments/page-level--redirect.html b/tests/fixtures/experiments/page-level--redirect.html
new file mode 100644
index 0000000..392d598
--- /dev/null
+++ b/tests/fixtures/experiments/page-level--redirect.html
@@ -0,0 +1,12 @@
+<html>
+<head>
+  <meta name="experiment" content="foo"/>
+  <meta name="experiment-variants" content="/tests/fixtures/experiments/page-level-v1,/tests/fixtures/experiments/page-level-v2"/>
+  <meta name="experiment-name" content="V1,V2"/>
+  <meta name="experiment-resolution" content="redirect"/>
+  <script type="module" src="/tests/fixtures/scripts.js"></script>
+</head>
+<body>
+  <main>Hello World!</main>
+</body>
+</html>
\ No newline at end of file
diff --git a/tests/utils.js b/tests/utils.js
index 1df0890..38656fb 100644
--- a/tests/utils.js
+++ b/tests/utils.js
@@ -30,5 +30,5 @@ export async function waitForDomEvent(page, eventName) {
       document.addEventListener(name, (ev) => resolve(ev.detail));
     });
   }, eventName);
-  return async () => await window.eventPromise;
+  return async () => window.eventPromise;
 }