diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/html/editing/the-hidden-attribute | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/html/editing/the-hidden-attribute')
28 files changed, 939 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/beforematch-element-fragment-navigation.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/beforematch-element-fragment-navigation.html new file mode 100644 index 0000000000..812a55f318 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/beforematch-element-fragment-navigation.html @@ -0,0 +1,200 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<link rel="author" title="Joey Arhar" href="mailto:jarhar@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<div id=parentid> + <div id=hiddenid> + <div id=childid>hello</div> + </div> +</div> + +<div id=spacer style="height:4000px">spacer</div> + +<script> +test(() => { + window.location.hash = ''; + hiddenid.hidden = 'until-found'; + window.location.hash = '#hiddenid'; + assert_false(hiddenid.hasAttribute('hidden')); +}, 'Verifies that fragment navigation reveals hidden=until-found elements.'); + +test(() => { + window.location.hash = ''; + parentid.hidden = 'until-found'; + hiddenid.hidden = 'until-found'; + childid.hidden = 'until-found'; + window.location.hash = 'childid'; + assert_false(parentid.hasAttribute('hidden'), 'parentid should not have the hidden attribute.'); + assert_false(hiddenid.hasAttribute('hidden'), 'hiddenid should not have the hidden attribute.'); + assert_false(childid.hasAttribute('hidden'), 'childid should not have the hidden attribute.'); +}, 'Verifies that fragment navigation reveals all parent hidden=until-found elements.'); + +test(() => { + window.location.hash = ''; + hiddenid.hidden = 'until-found'; + let beforematchFiredOnParent = false; + let beforematchFiredOnHidden = false; + let beforematchFiredOnChild = false; + parentid.onbeforematch = () => beforematchFiredOnParent = true; + hiddenid.onbeforematch = () => beforematchFiredOnHidden = true; + childid.onbeforematch = () => beforematchFiredOnChild = true; + + window.location.hash = '#childid'; + assert_true(beforematchFiredOnParent, 'beforematch should have been fired on parentid.'); + assert_true(beforematchFiredOnHidden, 'beforematch should have been fired on hiddenid.'); + assert_false(beforematchFiredOnChild, 'beforematch should not have been fired on childid.'); +}, 'Verifies that the beforematch event is fired synchronously and bubbles after fragment navigation.'); + +test(t => { + window.location.hash = ''; + window.scrollTo(0, 0); + assert_true(window.pageYOffset === 0, 'Scroll should reset at the beginning of the test.'); + + const target = document.createElement('div'); + target.textContent = 'target'; + target.id = 'target'; + target.hidden = 'until-found'; + document.body.appendChild(target); + const spacer = document.createElement('div'); + spacer.style.height = '4000px'; + t.add_cleanup(() => { + target.remove(); + spacer.remove(); + }); + + let beforematchCalled = false; + target.onbeforematch = () => { + assert_equals(window.pageYOffset, 0, 'scrolling should happen after beforematch is fired.'); + beforematchCalled = true; + // Move the target down the page. + document.body.appendChild(spacer); + target.remove(); + document.body.appendChild(target); + }; + + window.location.hash = '#target'; + assert_true(beforematchCalled, 'The beforematch event should have been fired.'); + + const offsetAfterMatch = window.pageYOffset; + assert_not_equals(offsetAfterMatch, 0, 'Fragment navigation should have scrolled down the page to the target element.'); + target.scrollIntoView(); + assert_equals(offsetAfterMatch, window.pageYOffset, `The scroll after beforematch should be the same as scrolling directly to the element's final destination.`); +}, 'Verifies that when a beforematch event handler moves a matching element, we scroll to its final location.'); + +test(t => { + window.location.hash = ''; + const foo = document.createElement('div'); + foo.textContent = 'foo'; + foo.id = 'foo'; + foo.hidden = 'until-found'; + document.body.appendChild(foo); + + const bar = document.createElement('div'); + bar.textContent = 'bar'; + bar.id = 'bar'; + bar.hidden = 'until-found'; + document.body.appendChild(bar); + + t.add_cleanup(() => { + foo.remove(); + bar.remove(); + }); + + let beforematchFiredOnFoo = false; + foo.onbeforematch = () => beforematchFiredOnFoo = true; + let beforematchFiredOnBar = false; + bar.onbeforematch = () => beforematchFiredOnBar = true; + + window.location.hash = '#bar'; + + assert_false(beforematchFiredOnFoo, 'foo was not navigated to, so it should not get the beforematch event.'); + assert_true(beforematchFiredOnBar, 'bar was navigated to, so it should get the beforematch event.'); + assert_true(window.pageYOffset > 0, 'the page should be scrolled down to bar.'); +}, 'Verifies that the beforematch event is fired on the right element when there are multiple hidden=until-found elements.'); + +test(t => { + window.location.hash = ''; + window.scrollTo(0, 0); + assert_true(window.pageYOffset === 0, 'Scroll should reset at the beginning of the test.'); + + const div = document.createElement('div'); + div.textContent = 'detach'; + div.id = 'detach'; + div.hidden = 'until-found'; + document.body.appendChild(div); + t.add_cleanup(() => div.remove()); + + let beforematchCalled = false; + div.onbeforematch = () => { + div.remove(); + beforematchCalled = true; + }; + + window.location.hash = '#detach'; + + assert_true(beforematchCalled, 'beforematch should be called when window.location.hash is set to #detach.'); + assert_true(window.pageYOffset === 0, 'The page should not be scrolled down to where #detach used to be.'); +}, 'Verifies that no scrolling occurs when an element selected by the fragment identifier is detached by the beforematch event handler.'); + +test(t => { + window.location.hash = ''; + window.scrollTo(0, 0); + assert_true(window.pageYOffset === 0, 'Scroll should reset at the beginning of the test.'); + + const div = document.createElement('div'); + div.textContent = 'displaynone'; + div.id = 'displaynone'; + div.hidden = 'until-found'; + document.body.appendChild(div); + t.add_cleanup(() => div.remove()); + + let beforematchCalled = false; + div.addEventListener('beforematch', () => { + div.style = 'display: none'; + beforematchCalled = true; + }); + + window.location.hash = '#displaynone'; + + assert_true(beforematchCalled, 'beforematch should be called when window.location.hash is set to #displaynone.'); + assert_true(window.pageYOffset === 0, 'The page should not be scrolled down to where #displaynone used to be.'); +}, `No scrolling should occur when the beforematch event handler sets the target element's style to display: none.`); + +test(t => { + window.location.hash = ''; + window.scrollTo(0, 0); + assert_true(window.pageYOffset === 0, 'Scroll should reset at the beginning of the test.'); + + const div = document.createElement('div'); + div.textContent = 'visibilityhidden'; + div.id = 'visibilityhidden'; + div.hidden = 'until-found'; + document.body.appendChild(div); + t.add_cleanup(() => div.remove()); + + let beforematchCalled = false; + div.addEventListener('beforematch', () => { + div.style = 'visibility: hidden'; + beforematchCalled = true; + }); + + window.location.hash = '#visibilityhidden'; + + assert_true(beforematchCalled, 'beforematch should be called when window.location.hash is set to #visibilityhidden.'); + assert_true(window.pageYOffset !== 0, 'The page should be scrolled down to where #visibilityhidden is.'); +}, `Scrolling should still occur when beforematch sets visiblity:hidden on the target element.`); + +test(t => { + window.location.hash = ''; + const div = document.createElement('div'); + div.id = 'target'; + div.textContent = 'target'; + document.body.appendChild(div); + t.add_cleanup(() => div.remove()); + div.addEventListener('beforematch', t.unreached_func('beforematch should not be fired without hidden=until-found.')); + window.location.hash = '#target'; +}, 'Verifies that the beforematch event is not fired on elements without hidden=until-found.'); +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/beforematch-scroll-to-text-fragment.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/beforematch-scroll-to-text-fragment.html new file mode 100644 index 0000000000..dddab4c6ba --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/beforematch-scroll-to-text-fragment.html @@ -0,0 +1,68 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>beforematch fired on ScrollToTextFragment</title> +<link rel="author" title="Joey Arhar" href="mailto:jarhar@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<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 src="/common/utils.js"></script> +<script src="/scroll-to-text-fragment/stash.js"></script> + +<script> +promise_test(t => new Promise((resolve, reject) => { + const key = token(); + test_driver.bless('Open a scroll to text fragment URL', () => { + window.open( + `resources/beforematch-scroll-to-text-fragment-basic.html?key=${key}#:~:text=foo`, + '_blank', + 'noopener'); + }); + fetchResults(key, resolve, reject); +}).then(results => { + assert_equals(results.pageYOffsetDuringBeforematch, 0, + 'Scrolling should happen after beforematch is fired.'); + assert_true(results.beforematchFiredOnFoo, + 'Foo was searched for, so it should get a beforematch event.'); + assert_false(results.beforematchFiredOnBar, + 'Bar was not searched for, so it should not get a beforematch event.'); + assert_true(results.pageYOffsetAfterRaf > 0, + 'The page should be scrolled down to foo.'); +}), 'Verifies that the beforematch event is fired on the matching element of a ScrollToTextFragment navigation.'); + +promise_test(t => new Promise((resolve, reject) => { + const key = token(); + test_driver.bless('Open a scroll to text fragment URL', () => { + window.open( + `resources/beforematch-scroll-to-text-fragment-with-anchor.html?key=${key}#:~:text=foo`, + '_blank', + 'noopener'); + }); + fetchResults(key, resolve, reject); +}).then(results => { + assert_true(results.beforematchFiredOnFoo, + 'foo was searched for, so it should get the beforematch event.'); + assert_false(results.beforematchFiredOnBar, + 'bar should not get the beforematch event despite being the target of an element fragment due to the text fragment.'); +}), 'Verifies that beforematch is only fired on elements targeted by a text fragment when there is both a text fragment and an element fragment.'); + +promise_test(t => new Promise((resolve, reject) => { + const key = token(); + test_driver.bless('Open a scroll to text fragment URL', () => { + window.open( + `resources/beforematch-scroll-to-text-fragment-bubble.html?key=${key}#:~:text=foo`, + '_blank', + 'noopener'); + }); + fetchResults(key, resolve, reject); +}).then(results => { + assert_true(results.beforematchFiredOnChild, + 'The element containing the searched text should have beforematch fired on it.'); + assert_true(results.beforematchFiredOnParent, + 'The parent element of the element containing the matching text should have the beforematch event fired on it because the event should bubble.'); +}), 'Verifies that the beforematch event bubbles with scroll to text fragment.'); + +// TODO(jarhar): Write more tests here once we decide on a behavior here: https://github.com/WICG/display-locking/issues/150 +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1-ref.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1-ref.html new file mode 100644 index 0000000000..7346ce919d --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1-ref.html @@ -0,0 +1,4 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<p>This line should be visible. diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1a.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1a.html new file mode 100644 index 0000000000..036bfc88b5 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1a.html @@ -0,0 +1,8 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=match href=hidden-1-ref.html> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<link rel=help href=https://html.spec.whatwg.org/multipage/#the-hidden-attribute> +<link rel=help href=https://html.spec.whatwg.org/multipage/#hidden-elements> +<p>This line should be visible. +<p hidden>This line should not be visible. diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1b.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1b.html new file mode 100644 index 0000000000..3d8b05d349 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1b.html @@ -0,0 +1,11 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=match href=hidden-1-ref.html> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<link rel=help href=https://html.spec.whatwg.org/multipage/#the-hidden-attribute> +<link rel=help href=https://html.spec.whatwg.org/multipage/#hidden-elements> +<style> +p { display: none; } +[hidden] { display: block; } +</style> +<p hidden>This line should be visible. diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1c.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1c.html new file mode 100644 index 0000000000..8a8cc63c48 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1c.html @@ -0,0 +1,12 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=match href=hidden-1-ref.html> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<link rel=help href=https://html.spec.whatwg.org/multipage/#the-hidden-attribute> +<link rel=help href=https://html.spec.whatwg.org/multipage/#hidden-elements> +<p hidden>This line should be visible. +<p>This line should not be visible. +<script> +document.getElementsByTagName("p")[0].hidden = false; +document.getElementsByTagName("p")[1].hidden = true; +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1d.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1d.html new file mode 100644 index 0000000000..e759148f22 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1d.html @@ -0,0 +1,12 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=match href=hidden-1-ref.html> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<link rel=help href=https://html.spec.whatwg.org/multipage/#the-hidden-attribute> +<link rel=help href=https://html.spec.whatwg.org/multipage/#hidden-elements> +<p hidden>This line should be visible. +<p>This line should not be visible. +<script> +document.getElementsByTagName("p")[0].removeAttribute("hidden"); +document.getElementsByTagName("p")[1].setAttribute("hidden", ""); +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1e.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1e.html new file mode 100644 index 0000000000..2f3f3c617e --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1e.html @@ -0,0 +1,10 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=match href=hidden-1-ref.html> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<link rel=help href=https://html.spec.whatwg.org/multipage/#the-hidden-attribute> +<link rel=help href=https://html.spec.whatwg.org/multipage/#hidden-elements> +<style> +p { display: block; } +</style> +<p hidden>This line should be visible. diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1f.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1f.html new file mode 100644 index 0000000000..6df30a6143 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1f.html @@ -0,0 +1,10 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=match href=hidden-1-ref.html> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<link rel=help href=https://html.spec.whatwg.org/multipage/#the-hidden-attribute> +<link rel=help href=https://html.spec.whatwg.org/multipage/#hidden-elements> +<style> +p { display: block !important; } +</style> +<p hidden>This line should be visible. diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1g.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1g.html new file mode 100644 index 0000000000..849d61fe1e --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-1g.html @@ -0,0 +1,11 @@ +<!doctype html> +<title>The hidden attribute</title> +<link rel=match href=hidden-1-ref.html> +<link rel=author title=Ms2ger href=mailto:Ms2ger@gmail.com> +<link rel=help href=https://html.spec.whatwg.org/multipage/#the-hidden-attribute> +<link rel=help href=https://html.spec.whatwg.org/multipage/#hidden-elements> +<p>This line should be visible. +<p hidden=hidden>This line should not be visible. +<p hidden=blue>This line should not be visible. +<p hidden=true>This line should not be visible. +<p hidden=false>This line should not be visible. diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-2-ref.svg b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-2-ref.svg new file mode 100644 index 0000000000..10931bfcab --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-2-ref.svg @@ -0,0 +1,7 @@ +<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20"> +<metadata> + <link xmlns="http://www.w3.org/1999/xhtml" rel="author" title="Ms2ger" + href="mailto:Ms2ger@gmail.com"/> +</metadata> +<rect height="20" width="20"/> +</svg> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-2.svg b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-2.svg new file mode 100644 index 0000000000..a5f08f6b27 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-2.svg @@ -0,0 +1,12 @@ +<svg xmlns="http://www.w3.org/2000/svg" height="20" width="20"> +<metadata> + <link xmlns="http://www.w3.org/1999/xhtml" rel="match" href="hidden-2-ref.svg" /> + <link xmlns="http://www.w3.org/1999/xhtml" rel="author" title="Ms2ger" + href="mailto:Ms2ger@gmail.com"/> + <link xmlns="http://www.w3.org/1999/xhtml" rel="help" + href="https://html.spec.whatwg.org/multipage/#the-hidden-attribute"/> + <link xmlns="http://www.w3.org/1999/xhtml" rel="help" + href="https://html.spec.whatwg.org/multipage/#hidden-elements"/> +</metadata> +<rect hidden="" height="20" width="20"/> +</svg> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-idl.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-idl.html new file mode 100644 index 0000000000..331b63f93f --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-idl.html @@ -0,0 +1,49 @@ +<!DOCTYPE html> +<link rel=author href="mailto:jarhar@chromium.org"> +<link rel=help href="https://github.com/whatwg/html/pull/7475"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<div>hello</div> +<script> +const div = document.querySelector('div'); + +function runPropertyTest(assignedValue, expectedValue, expectedAttribute) { + test(() => { + div.hidden = assignedValue; + assert_equals(div.hidden, expectedValue, + `div.hidden = ${JSON.stringify(assignedValue)} should return ${JSON.stringify(expectedValue)}`); + assert_equals(div.getAttribute('hidden'), expectedAttribute, + `div.hidden = ${JSON.stringify(assignedValue)} should set the hidden attribute to ${JSON.stringify(expectedAttribute)}`); + }, `div.hidden = ${Number.isNaN(assignedValue) ? 'NaN' : JSON.stringify(assignedValue)}`); +} + +function runAttributeTest(assignedAttribute, expectedValue) { + test(() => { + div.setAttribute('hidden', assignedAttribute); + assert_equals(div.hidden, expectedValue); + }, `div.setAttribute('hidden', ${JSON.stringify(assignedAttribute)}) should make div.hidden return ${JSON.stringify(expectedValue)}`); +} + +runPropertyTest(false, false, null); +runPropertyTest(true, true, ''); +runPropertyTest('foo', true, ''); +runPropertyTest('false', true, ''); +runPropertyTest('', false, null); + +runAttributeTest('false', true); +runAttributeTest('foo', true); + +runPropertyTest('until-found', 'until-found', 'until-found'); +runPropertyTest('UNTIL-FOUND', 'until-found', 'until-found'); +runPropertyTest('UnTiL-FoUnD', 'until-found', 'until-found'); +runPropertyTest('unt\u0131l-found', true, ''); +runPropertyTest('unt\u0130l-found', true, ''); + +runPropertyTest(null, false, null); +runPropertyTest(undefined, false, null); + +runPropertyTest(1, true, ''); +runPropertyTest(0, false, null); +runPropertyTest(NaN, false, null); +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-ua-stylesheet.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-ua-stylesheet.html new file mode 100644 index 0000000000..913ecc037c --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-ua-stylesheet.html @@ -0,0 +1,65 @@ +<!DOCTYPE html> +<link rel=author href="mailto:jarhar@chromium.org"> +<link rel=help href="https://html.spec.whatwg.org/multipage/rendering.html#hiddenCSS"> +<link rel=help href="https://github.com/whatwg/html/pull/7475#issuecomment-1069313217"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<div id=div>hello world</div> +<table id=table> + <colgroup id=colgroup> + <col id=col></col> + </colgroup> +</table> + +<script> +function testDisplayNone(description) { + test(() => { + assert_equals(getComputedStyle(div).display, 'none', + `${description} should make the div display:none.`); + assert_equals(getComputedStyle(div).contentVisibility, 'visible', + `${description} should not affect the div's content-visibility property.`); + }, description); +} + +function testCVHidden(description) { + test(() => { + assert_equals(getComputedStyle(div).display, 'block', + `${description} should not affect the div's display property.`); + assert_equals(getComputedStyle(div).contentVisibility, 'hidden', + `${description} should make the div content-visibility:hidden.`); + }, description); +} + +function testNormal(description) { + test(() => { + assert_equals(getComputedStyle(div).display, 'block', + `${description} should not affect the div's display property.`); + assert_equals(getComputedStyle(div).contentVisibility, 'visible', + `${description} should not affect the div's content-visibility property.`); + }, description); +} + +test(() => { + div.removeAttribute('hidden'); + testNormal(`div.removeAttribute('hidden')`); + + div.setAttribute('hidden', ''); + testDisplayNone(`div.setAttribute('hidden', '')`); + + div.setAttribute('hidden', 'asdf'); + testDisplayNone(`div.setAttribute('hidden', 'asdf')`); + + div.setAttribute('hidden', 'until-found'); + testCVHidden(`div.setAttribute('hidden', 'until-found')`); + + div.setAttribute('hidden', 'UNTIL-FOUND'); + testCVHidden(`div.setAttribute('hidden', 'UNTIL-FOUND')`); + + div.setAttribute('hidden', 'UnTiL-FoUnD'); + testCVHidden(`div.setAttribute('hidden', 'UnTiL-FoUnD')`); + + div.setAttribute('hidden', '0'); + testDisplayNone(`div.setAttribute('hidden', '0')`); +}); +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-001.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-001.html new file mode 100644 index 0000000000..3c87b985dc --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-001.html @@ -0,0 +1,49 @@ +<!doctype HTML> + +<html class="reftest-wait"> +<meta charset="utf8"> +<title>content-visibility changes after a delay</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<link rel="match" href="./resources/container-ref.html"> +<meta name="assert" content="scrollIntoView has no effect on hidden=until-found"> +<script src="/common/reftest-wait.js"></script> + +<style> +#container { + width: 150px; + height: 150px; + background: lightblue; +} +#child { + width: 50px; + height: 50px; + background: lightgreen; +} +</style> + +<div id=container hidden=until-found> + Text. + <div id=child></div> +</div> + + +<script> + +function runTest() { + document.getElementById("container").scrollIntoView(); + takeScreenshot(); +} + +window.onload = requestAnimationFrame(() => { + requestAnimationFrame(() => { + requestAnimationFrame(() => { + runTest(); + }); + }); +}); + +</script> +</html> + + diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-002.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-002.html new file mode 100644 index 0000000000..a454e3a009 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-002.html @@ -0,0 +1,43 @@ +<!doctype HTML> +<meta charset="utf8"> +<title>Content Visibility: tab order navigation ignores hidden=until-found subtrees</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<meta name="assert" content="tab order navigation ignores hidden=until-found subtrees."> + +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/resources/testdriver.js"></script> +<script src="/resources/testdriver-actions.js"></script> +<script src="/resources/testdriver-vendor.js"></script> + +<input id=one type=text></input> +<div hidden=until-found> + <input id=two type=text></input> + <input id=three type=text></input> + <input id=four type=text></input> +</div> +<input id=five type=text></input> + +<script> +async_test((t) => { + const tab = "\t"; + async function step1() { + await test_driver.send_keys(document.body, tab); + t.step(() => { + assert_equals(document.activeElement, document.getElementById("one")); + }); + requestAnimationFrame(step2); + } + + async function step2() { + await test_driver.send_keys(document.body, tab); + t.step(() => { + assert_equals(document.activeElement, document.getElementById("five")); + }); + t.done(); + } + + window.onload = () => { requestAnimationFrame(step1); }; +}, "Tab order navigation skips hidden=until-found subtrees"); +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-004.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-004.html new file mode 100644 index 0000000000..3ca6feb7a3 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-004.html @@ -0,0 +1,28 @@ +<!doctype HTML> +<html> +<meta charset="utf8"> +<title>hidden=until-found does not paint</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<link rel="match" href="./resources/container-ref.html"> +<meta name="assert" content="content-visibility subtrees are not painted"> + +<style> +#container { + width: 150px; + height: 150px; + background: lightblue; +} +#child { + width: 50px; + height: 50px; + background: lightgreen; +} +</style> + +<div id=container hidden=until-found> + Text. + <div id=child></div> + <span>inline child</span> +</div> +</html> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-005-ref.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-005-ref.html new file mode 100644 index 0000000000..0ca77849a4 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-005-ref.html @@ -0,0 +1,17 @@ +<!doctype HTML> +<html> +<meta charset="utf8"> +<title>Content Visibility: hidden-matchable and size contained (reference)</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> + +<style> +div { + border: 1px solid black; +} +</style> + +Test passes if there is a empty div with border below. +<div></div> +</html> + diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-005.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-005.html new file mode 100644 index 0000000000..fabf636ec9 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-005.html @@ -0,0 +1,22 @@ +<!doctype HTML> +<html> +<meta charset="utf8"> +<title>hidden=until-found and size contained</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<link rel="match" href="hidden-until-found-005-ref.html"> +<meta name="assert" content="hidden=until-found puts in size containment"> + +<style> +div { + border: 1px solid black; +} +</style> + +Test passes if there is a empty div with border below. +<div hidden=until-found> + This text is not visible, and neither should be the div below. + <div style="width: 100px; height: 100px; background: red"></div> +</div> +</html> + diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-006-ref.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-006-ref.html new file mode 100644 index 0000000000..e14ba82c27 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-006-ref.html @@ -0,0 +1,40 @@ +<!doctype HTML> +<html> +<meta charset="utf8"> +<title>content-visibility hidden-matchable + scrollIntoView (reference)</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> + +<style> +.spacer { + height: 1000px; + background: lightgreen; +} +#container { + width: 150px; + height: 150px; + background: lightblue; +} +#target { + position: relative; + top: 75px; + visibility: hidden; + + width: 50px; + height: 50px; + background: red; +} +</style> + +<div>top of the page</div> +<div class=spacer></div> +<div id=container> + <div id=target></div> +</div> +<div class=spacer></div> +<div>bottom of the page</div> + +<script> +onload = () => document.getElementById("target").scrollIntoView(); +</script> +</html> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-007.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-007.html new file mode 100644 index 0000000000..7b11a92cc9 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-007.html @@ -0,0 +1,52 @@ +<!doctype HTML> + +<html class="reftest-wait"> +<meta charset="utf8"> +<title>hidden=until-found + focus</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<link rel="match" href="./resources/spacer-and-container-ref.html"> +<meta name="assert" content="focus does not scroll or focus element under hidden=until-found"> +<script src="/common/reftest-wait.js"></script> + +<style> +.spacer { + width: 150px; + height: 3000px; + background: lightblue; +} +#container { + width: 150px; + height: 150px; + background: lightblue; +} +#target { + position: relative; + top: 75px; + + width: 50px; + height: 50px; + background: red; +} +</style> + +<div class=spacer></div> +<div id=container hidden=until-found> + <div id=target tabindex=0></div> +</div> + +<script> +function runTest() { + document.getElementById("target").focus(); + requestAnimationFrame(takeScreenshot); +} + +window.onload = requestAnimationFrame(() => { + requestAnimationFrame(() => { + requestAnimationFrame(() => { + runTest(); + }); + }); +}); +</script> +</html> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-text-fragment.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-text-fragment.html new file mode 100644 index 0000000000..05220f7ce1 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/hidden-until-found-text-fragment.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>beforematch fired on ScrollToTextFragment</title> +<link rel="author" title="Joey Arhar" href="mailto:jarhar@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> +<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 src="/common/utils.js"></script> +<script src="/scroll-to-text-fragment/stash.js"></script> + +<script> +promise_test(t => new Promise((resolve, reject) => { + const key = token(); + test_driver.bless('Open a scroll to text fragment URL', () => { + window.open( + `resources/hidden-until-found-text-fragment.html?key=${key}#:~:text=foo`, + '_blank', + 'noopener'); + }); + fetchResults(key, resolve, reject); +}).then(results => { + assert_false(results.targetHasHiddenAttribute, + 'The matching hidden=until-found element should have its hidden attribute removed so it can be scrolled to.'); + assert_true(results.pageYOffsetAfterRaf > 0, + 'The page should be scrolled down to foo.'); +}), 'Verifies that the beforematch event is fired on the matching element of a ScrollToTextFragment navigation.'); +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-basic.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-basic.html new file mode 100644 index 0000000000..884e9a67fa --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-basic.html @@ -0,0 +1,48 @@ +<!DOCTYPE html> +<script src="/scroll-to-text-fragment/stash.js"></script> + +<!-- This test is navigated to with the fragment #:~:text=foo --> + +<body> + <div style="height: 4000px;">spacer</div> + <script> + const results = {}; + + const foo = document.createElement('div'); + foo.textContent = 'foo'; + foo.hidden = 'until-found'; + document.body.appendChild(foo); + window.beforematchFiredOnFoo = false; + foo.addEventListener('beforematch', () => { + // This should be zero. Scrolling should happen after beforematch is + // fired. + results.pageYOffsetDuringBeforematch = window.pageYOffset; + window.beforematchFiredOnFoo = true; + }); + + const bar = document.createElement('div'); + bar.textContent = 'bar'; + document.body.appendChild(bar); + window.beforematchFiredOnBar = false; + bar.addEventListener('beforematch', () => { + window.beforematchFiredOnBar = true; + }); + + requestAnimationFrame(() => { + requestAnimationFrame(async () => { + // This should be true. Foo was searched for, so it should get a + // beforematch event. + results.beforematchFiredOnFoo = window.beforematchFiredOnFoo; + // This should be false. Bar was not searched for, so it should not get + // a beforematch event. + results.beforematchFiredOnBar = window.beforematchFiredOnBar; + // This should be greater than zero. The page should be scrolled down + // to foo. + results.pageYOffsetAfterRaf = window.pageYOffset; + + params = new URLSearchParams(window.location.search); + stashResultsThenClose(params.get('key'), results); + }); + }); + </script> +</body> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-bubble.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-bubble.html new file mode 100644 index 0000000000..abfe8ddd54 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-bubble.html @@ -0,0 +1,30 @@ +<!DOCTYPE html> +<script src="/scroll-to-text-fragment/stash.js"></script> + +<!-- This test is navigated to with the fragment #:~:text=foo --> + +<div id=parentid> + <div id=childid hidden=until-found>foo</div> +</div> + +<script> + const results = { + beforematchFiredOnChild: false, + beforematchFiredOnParent: false + }; + + childid.addEventListener('beforematch', () => { + results.beforematchFiredOnChild = true; + }); + + parentid.addEventListener('beforematch', () => { + results.beforematchFiredOnParent = true; + }); + + requestAnimationFrame(() => { + requestAnimationFrame(() => { + const params = new URLSearchParams(window.location.search); + stashResultsThenClose(params.get('key'), results); + }); + }); +</script> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-with-anchor.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-with-anchor.html new file mode 100644 index 0000000000..3506c6e60c --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/beforematch-scroll-to-text-fragment-with-anchor.html @@ -0,0 +1,36 @@ +<!DOCTYPE html> +<script src="/scroll-to-text-fragment/stash.js"></script> + +<!-- This test is navigated to with the fragment #bar:~:text=foo --> + +<body> + <div id=foo hidden=until-found>foo</div> + <div id=bar hidden=until-found>bar</div> + <script> + window.beforematchFiredOnFoo = false; + foo.addEventListener('beforematch', () => { + window.beforematchFiredOnFoo = true; + }); + + window.beforematchFiredOnBar = false; + bar.addEventListener('beforematch', () => { + window.beforematchFiredOnBar = true; + }); + + requestAnimationFrame(() => { + requestAnimationFrame(() => { + const results = {}; + // This should be true. Foo was searched for, so it should get the + // beforematch event. + results.beforematchFiredOnFoo = window.beforematchFiredOnFoo; + // This should be false. Bar should not get the beforematch event + // despite being the target of an element fragment due to the text + // fragment. + results.beforematchFiredOnBar = window.beforematchFiredOnBar; + + params = new URLSearchParams(window.location.search); + stashResultsThenClose(params.get('key'), results); + }); + }); + </script> +</body> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/container-ref.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/container-ref.html new file mode 100644 index 0000000000..e2df59014b --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/container-ref.html @@ -0,0 +1,17 @@ +<!doctype HTML> +<html> +<meta charset="utf8"> +<title>CSS Content Visibility: container (reference)</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> + +<style> +#container { + width: 150px; + height: 150px; + background: lightblue; +} +</style> + +<div id=container></div> + diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/hidden-until-found-text-fragment.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/hidden-until-found-text-fragment.html new file mode 100644 index 0000000000..fe89b407e6 --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/hidden-until-found-text-fragment.html @@ -0,0 +1,25 @@ +<!DOCTYPE html> +<script src="/scroll-to-text-fragment/stash.js"></script> + +<!-- This test is navigated to with the fragment #:~:text=foo --> + +<body> + <div style="height: 4000px;">spacer</div> + <div id=target hidden=until-found>foo</div> + <script> + requestAnimationFrame(() => { + requestAnimationFrame(() => { + const results = {}; + // This should be false. The hidden=until-found attribute should be + // removed in response to ScrollToTextFragment. + results.targetHasHiddenAttribute = document.getElementById('target').hasAttribute('hidden'); + // This should be greater than zero. The page should be scrolled down + // to foo. + results.pageYOffsetAfterRaf = window.pageYOffset; + + params = new URLSearchParams(window.location.search); + stashResultsThenClose(params.get('key'), results); + }); + }); + </script> +</body> diff --git a/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/spacer-and-container-ref.html b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/spacer-and-container-ref.html new file mode 100644 index 0000000000..816a6c9a9d --- /dev/null +++ b/testing/web-platform/tests/html/editing/the-hidden-attribute/resources/spacer-and-container-ref.html @@ -0,0 +1,23 @@ +<!doctype HTML> +<html> +<meta charset="utf8"> +<title>Content Visibility: spacer and a container (reference)</title> +<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> +<link rel="help" href="https://github.com/WICG/display-locking"> + +<style> +.spacer { + width: 150px; + height: 3000px; + background: lightblue; +} +#container { + contain: style layout; + width: 150px; + height: 150px; +} +</style> + +<div class="spacer"></div> +<div id="container"></div> +</html> |