diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/scroll-to-text-fragment/scroll-to-text-fragment-target.html | |
| parent | Initial commit. (diff) | |
| download | firefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/scroll-to-text-fragment/scroll-to-text-fragment-target.html')
| -rw-r--r-- | testing/web-platform/tests/scroll-to-text-fragment/scroll-to-text-fragment-target.html | 99 |
1 files changed, 99 insertions, 0 deletions
diff --git a/testing/web-platform/tests/scroll-to-text-fragment/scroll-to-text-fragment-target.html b/testing/web-platform/tests/scroll-to-text-fragment/scroll-to-text-fragment-target.html new file mode 100644 index 0000000000..b2be85132c --- /dev/null +++ b/testing/web-platform/tests/scroll-to-text-fragment/scroll-to-text-fragment-target.html @@ -0,0 +1,99 @@ +<!doctype html> +<title>Navigating to a text fragment anchor</title> +<script src="stash.js"></script> +<script> +function isInView(element) { + let rect = element.getBoundingClientRect(); + return rect.top >= 0 && rect.top <= window.innerHeight + && rect.left >= 0 && rect.left <= window.innerWidth; +} + +function checkScroll() { + let position = 'unknown'; + if (window.scrollY == 0) + position = 'top'; + else if (isInView(document.getElementById('element'))) + position = 'element'; + else if (isInView(document.getElementById('text'))) + position = 'text'; + else if (isInView(document.getElementById('more-text'))) + position = 'more-text'; + else if (isInView(document.getElementById('cross-node-context'))) + position = 'cross-node-context'; + else if (isInView(document.getElementById('text-directive-parameters'))) + position = 'text-directive-parameters'; + else if (isInView(document.getElementById('shadow-parent'))) + position = 'shadow-parent'; + else if (isInView(document.getElementById('hidden'))) + position = 'hidden'; + else if (isInView(document.getElementById('horizontal-scroll')) && window.scrollX > 0) + position = 'horizontal-scroll'; + + let target = document.querySelector(":target"); + + if (!target && position == 'shadow-parent') { + let shadow = document.getElementById("shadow-parent").shadowRoot.firstElementChild; + if (shadow.matches(":target")) { + target = shadow; + position = 'shadow'; + } + } + + let results = { + scrollPosition: position, + href: window.location.href, + target: target ? target.id : 'undefined' + }; + + let key = (new URL(document.location)).searchParams.get("key"); + stashResultsThenClose(key, results); +} + +// Ensure two animation frames on load to test the fallback to element anchor, +// which gets queued for the next frame if the text fragment is not found. +window.onload = function() { + window.requestAnimationFrame(function() { + window.requestAnimationFrame(checkScroll); + }) +} +</script> +<style> + .scroll-section { + /* 1000px margin on top and bottom so only one section can be in view. */ + margin: 1000px 0px; + } + #hidden { + visibility: hidden; + } + #horizontal-scroll { + margin-left: 2000px; + } + #display-none { + display: none; + } +</style> +<body> + <div id="element" class="scroll-section">Element</div> + <p id="text" class="scroll-section"> + This is a test page !$'()*+./:;=?@_~ &,- ネコ + <br> + foo foo foo bar bar bar + </p> + <p id="more-text" class="scroll-section">More test page text</p> + <div class="scroll-section"> + <div> + <p>prefix</p> + <p id="cross-node-context">test page</p> + </div> + <div><p>suffix</p></div> + </div> + <p id="text-directive-parameters" class="scroll-section">this,is,test,page</p> + <div id="shadow-parent" class="scroll-section"></div> + <script> + let shadow = document.getElementById("shadow-parent").attachShadow({mode: 'open'}); + shadow.innerHTML = '<p id="shadow">shadow text</p>'; + </script> + <p id="hidden" class="scroll-section">hidden text</p> + <p id="horizontal-scroll" class="scroll-section">horizontally scrolled text</p> + <p id="display-none" class="scroll-section">display none</p> +</body> |