Create Web Platform Tests for Scroll to text

Nick Burris · natechapin · commit fdcb8ff8940e · 2019-08-23T16:30:01.000-07:00
Add a web platform test that performs navigations to a test page with various targetText parameters and checks if the target page successfully scrolled as expected. Using a BroadcastChannel is the only way to communicate whether the target page scrolled, since scroll to text is specifically restricted from iframes or pages with an opener, so there's no other way for the test page to track the status of the child target page. Bug: 994299 Change-Id: I69243e739c3a7469ac48647508e379f204ccfbf6 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1756707 Commit-Queue: Nick Burris <nburris@chromium.org> Reviewed-by: Robert Ma <robertma@chromium.org> Cr-Commit-Position: refs/heads/master@{#689453}
diff --git a/scroll-to-text-fragment/scroll-to-text-fragment-target.html b/scroll-to-text-fragment/scroll-to-text-fragment-target.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<title>Navigating to a text fragment anchor</title>
+<script>
+function checkScroll() {
+  let bc = new BroadcastChannel('scroll-to-text-fragment');
+  bc.postMessage({ didScrollToTarget: window.scrollY > 0 });
+  bc.close();
+  window.close();
+}
+</script>
+<style>
+  body {
+    height: 3200px;
+  }
+  p {
+    position: absolute;
+    top: 3000px;
+  }
+</style>
+<body onload="checkScroll()">
+  <p id="text">This is a test page</p>
+</body>
diff --git a/scroll-to-text-fragment/scroll-to-text-fragment.html b/scroll-to-text-fragment/scroll-to-text-fragment.html
@@ -0,0 +1,38 @@
+<!doctype html>
+<title>Navigating to a text fragment anchor</title>
+<meta name="timeout" content="long">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script>
+let test_cases = [
+  { fragment: '#', expect_scroll: false },
+  { fragment: '##targetText=test', expect_scroll: true },
+  { fragment: '##targetText=this,page', expect_scroll: true },
+  { fragment: '##targetText=this-,is,test', expect_scroll: true },
+  { fragment: '##targetText=this-,is,test,-page', expect_scroll: true },
+  { fragment: '##targetText=this-,is,page,-none', expect_scroll: false },
+  { fragment: '##targetText=this,test,-page', expect_scroll: true },
+  { fragment: '##targetText=this%20is%20a%20test%20page', expect_scroll: true },
+  { fragment: '##targetText=this&targetText=test,page', expect_scroll: true },
+  { fragment: '#pagestate##targetText=test', expect_scroll: true },
+  { fragment: '#pagestate##targetText=nomatch', expect_scroll: false },
+];
+
+for (const test_case of test_cases) {
+  promise_test(t => new Promise(resolve => {
+    let channel = new BroadcastChannel('scroll-to-text-fragment');
+    channel.addEventListener("message", e => {
+      resolve(e.data.didScrollToTarget);
+    }, {once: true});
+
+    test_driver.bless('Open a URL with a text fragment anchor', () => {
+      window.open('scroll-to-text-fragment-target.html' + test_case.fragment, '_blank', 'noopener');
+    });
+  }).then(scroll => {
+    assert_equals(scroll, test_case.expect_scroll,
+                  'Expected ' + test_case.fragment + (test_case.expect_scroll ? ' to scroll.' : ' to not scroll.'));
+  }), 'Test navigation with text fragment anchor ' + test_case.fragment);
+}
+</script>
