diff --git a/html/cross-origin-opener-policy/coop-csp-sandbox-navigate.https.html b/html/cross-origin-opener-policy/coop-csp-sandbox-navigate.https.html
new file mode 100644
index 00000000000000..e9e83072ce5f15
--- /dev/null
+++ b/html/cross-origin-opener-policy/coop-csp-sandbox-navigate.https.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<title>CSP sandbox popup navigate to Cross-Origin-Opener-Policy document should work</title>
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script src="/common/utils.js"></script> <!-- Use token() to allow running tests in parallel -->
+<div id=log>
+<script>
+[
+  "allow-popups allow-scripts allow-same-origin",
+  "allow-popups allow-scripts",
+].forEach(sandboxValue => {
+  async_test(t => {
+    const channel = new BroadcastChannel(token());
+    channel.onmessage = t.step_func_done();
+    const navigateTo = `/html/cross-origin-opener-policy/resources/coop-coep.py?coop=same-origin&coep=&channel=${channel.name}`;
+    const popup = window.open(`resources/csp-sandbox.py?coop=&coep=&sandbox=${sandboxValue}&channel=&navigate=${encodeURIComponent(navigateTo)}`);
+    t.add_cleanup(() => { popup.close(); });
+    addEventListener('load', t.step_func(() => {
+      t.step_timeout(() => {
+        assert_unreached('Navigation from CSP sandbox to COOP document failed')
+      }, 1500);
+    }));
+  }, `CSP: sandbox ${sandboxValue}; ${document.title}`);
+});
+</script>
diff --git a/html/cross-origin-opener-policy/resources/common.js b/html/cross-origin-opener-policy/resources/common.js
index 8a3cd133734dc3..85d548c4629ae2 100644
--- a/html/cross-origin-opener-policy/resources/common.js
+++ b/html/cross-origin-opener-policy/resources/common.js
@@ -92,4 +92,16 @@ function run_coop_test_iframe (documentTitle, iframe_origin, popup_origin, popup
       });
       document.body.append(frame);
   }, `${documentTitle} with ${iframe_origin.name} iframe opening popup a ${popup_origin.name} with COOP: ${popup_coop}`);
-}
\ No newline at end of file
+}
+
+// Need to wait until the page is fully loaded before navigating
+// so that it creates a history entry properly.
+const fullyLoaded = new Promise((resolve, reject) => {
+  addEventListener('load', () => {
+    requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        resolve();
+      });
+    });
+  });
+});
diff --git a/html/cross-origin-opener-policy/resources/coop-coep.py b/html/cross-origin-opener-policy/resources/coop-coep.py
index e0a3d90050a624..dea3724e9df0a2 100644
--- a/html/cross-origin-opener-policy/resources/coop-coep.py
+++ b/html/cross-origin-opener-policy/resources/coop-coep.py
@@ -26,23 +26,13 @@ def main(request, response):
 <!doctype html>
 <meta charset=utf-8>
 <script src="/common/get-host-info.sub.js"></script>
+<script src="/html/cross-origin-opener-policy/resources/common.js"></script>
 <body></body>
 <script>
   const params = new URL(location).searchParams;
   const navHistory = params.get("navHistory");
   const avoidBackAndForth = params.get("avoidBackAndForth");
   const navigate = params.get("navigate");
-  // Need to wait until the page is fully loaded before navigating
-  // so that it creates a history entry properly.
-  const fullyLoaded = new Promise((resolve, reject) => {
-    addEventListener('load', () => {
-      requestAnimationFrame(() => {
-        requestAnimationFrame(() => {
-          resolve();
-        });
-      });
-    });
-  });
   if (navHistory !== null) {
     fullyLoaded.then(() => {
       history.go(Number(navHistory));
diff --git a/html/cross-origin-opener-policy/resources/csp-sandbox.py b/html/cross-origin-opener-policy/resources/csp-sandbox.py
index fd19acb339c0b5..5b819404e6d8d3 100644
--- a/html/cross-origin-opener-policy/resources/csp-sandbox.py
+++ b/html/cross-origin-opener-policy/resources/csp-sandbox.py
@@ -12,9 +12,18 @@ def main(request, response):
     response.content = b"""
 <!doctype html>
 <meta charset=utf-8>
+<script src="/common/get-host-info.sub.js"></script>
+<script src="/html/cross-origin-opener-policy/resources/common.js"></script>
 <script>
   const params = new URL(location).searchParams;
   params.delete("sandbox");
-  window.open(`/html/cross-origin-opener-policy/resources/coop-coep.py?${params}`);
+  const navigate = params.get("navigate");
+  if (navigate) {
+    fullyLoaded.then(() => {
+      self.location = navigate;
+    });
+  } else {
+    window.open(`/html/cross-origin-opener-policy/resources/coop-coep.py?${params}`);
+  }
 </script>
 """
