From ccf573d2f2f4769d1d95ac4d39db2c310a9f9f26 Mon Sep 17 00:00:00 2001
From: Dave Vandyke <kzar@kzar.co.uk>
Date: Fri, 1 Dec 2023 11:21:51 +0000
Subject: [PATCH] Improve usability of the surrogate script test page

The surrogate script test page was a little hard to use. Some expected
results being shown as red, some unexpected results being shown
green. Let's improve that a bit, making it clear to folks what a
success/failure looks like.
---
 privacy-protections/surrogates/index.html |  2 +-
 privacy-protections/surrogates/main.js    | 20 ++++++++++++++++----
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/privacy-protections/surrogates/index.html b/privacy-protections/surrogates/index.html
index a7b72e7..68ab825 100644
--- a/privacy-protections/surrogates/index.html
+++ b/privacy-protections/surrogates/index.html
@@ -28,7 +28,7 @@
 </head>
 <p><a href="../../">[Home]</a> ↣ <a href="../">[Privacy Protections Tests]</a> ↣ <strong>[Surrogates Test Page]</strong></p>
 
-<p>This page tests if surrogate script for google-analytics.com/analytics.js is being loaded. This page expects <a href='https://github.com/duckduckgo/tracker-surrogates/blob/main/surrogates/analytics.js'>specific surrogate</a> to be loaded.</p>
+<p>This page tests that requests to google-analytics.com/analytics.js are redirected to the <a href='https://github.com/duckduckgo/tracker-surrogates/blob/main/surrogates/analytics.js'>analytics.js surrogate script</a>. The page also tests some related edge-cases. Note: "request failed" is expected for some test cases, but green always indicates a test success and red a test failure.</p>
 <table id='results-table'>
     <tr><th>Description</th><th>Loaded</th></tr>
 </table>
diff --git a/privacy-protections/surrogates/main.js b/privacy-protections/surrogates/main.js
index 7205e84..d2dcef7 100644
--- a/privacy-protections/surrogates/main.js
+++ b/privacy-protections/surrogates/main.js
@@ -1,3 +1,6 @@
+const GREEN = '#71bf69';
+const RED = '#f97268';
+
 const results = {
     page: 'surrogates',
     date: (new Date()).toUTCString(),
@@ -11,10 +14,14 @@ function updateTable ({ name, testData, error }) {
     const descriptionCell = row.insertCell(0);
     const testCell = row.insertCell(1);
 
+    const requestFailExpected = testData.expectedResult === 'failed';
+    const requestLoadedColor = requestFailExpected ? RED : GREEN;
+    const requestFailedColor = requestFailExpected ? GREEN : RED;
+
     // set default values and colors
     descriptionCell.innerText = testData.notes;
     testCell.innerText = 'request failed';
-    testCell.style.backgroundColor = '#f97268';
+    testCell.style.backgroundColor = requestFailedColor;
 
     const result = {
         id: name,
@@ -27,7 +34,7 @@ function updateTable ({ name, testData, error }) {
         if (testResult) {
             result.loaded = true;
             testCell.innerText = 'surrogate loaded';
-            testCell.style.backgroundColor = '#71bf69';
+            testCell.style.backgroundColor = requestLoadedColor;
         } else {
             testCell.innerText = 'surrogate not loaded';
         }
@@ -61,6 +68,7 @@ const surrogates = {
         url: 'https://google-analytics.com/analytics.js',
         notes: 'Loading surrogate in the main frame.',
         test: checkSurrogate,
+        expectedResult: 'loaded',
         cleanUp: () => { delete window.ga; }
     },
     'cross-origin': {
@@ -68,6 +76,7 @@ const surrogates = {
         crossOrigin: 'anonymous',
         notes: 'Loading surrogate with crossOrigin=anonymous set.',
         test: checkSurrogate,
+        expectedResult: 'loaded',
         cleanUp: () => { delete window.ga; }
     },
     'integrity-check': {
@@ -76,12 +85,14 @@ const surrogates = {
         integrity: 'sha512-1xNTXD/ZeaKg/Xjb6De9la7CXo5gC1lMk+beyKo691KJrjlj0HbZG6frzK0Wo6bm96i9Cp6w/WB4vSN/8zDBLQ==',
         notes: 'Loading surrogate with integrity=sha512-… set.',
         test: checkSurrogate,
+        expectedResult: 'failed',
         cleanUp: () => { delete window.ga; }
     },
     'direct-access': {
         url: 'chrome-extension://bkdgflcldnnnapblkhphbgpggdiikppg/web_accessible_resources/analytics.js',
         notes: 'Chromium only - it should not be possible to access local surrogate file',
-        test: () => { return true; }
+        test: () => { return true; },
+        expectedResult: 'failed'
     },
     'sub-frame': {
         notes: 'Loading surrogate in an iframe.',
@@ -115,7 +126,8 @@ const surrogates = {
             });
 
             return promise;
-        }
+        },
+        expectedResult: 'loaded'
     },
     'delayed-set': {
         notes: 'Set script src after insert',