diff options
Diffstat (limited to 'testing/web-platform/tests/html/editing/the-hidden-attribute')
13 files changed, 411 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/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> |
