summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/wai-aria/role/invalid-roles.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 00:47:55 +0000
commit26a029d407be480d791972afb5975cf62c9360a6 (patch)
treef435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/wai-aria/role/invalid-roles.html
parentInitial commit. (diff)
downloadfirefox-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/wai-aria/role/invalid-roles.html')
-rw-r--r--testing/web-platform/tests/wai-aria/role/invalid-roles.html135
1 files changed, 135 insertions, 0 deletions
diff --git a/testing/web-platform/tests/wai-aria/role/invalid-roles.html b/testing/web-platform/tests/wai-aria/role/invalid-roles.html
new file mode 100644
index 0000000000..3f4255083e
--- /dev/null
+++ b/testing/web-platform/tests/wai-aria/role/invalid-roles.html
@@ -0,0 +1,135 @@
+<!doctype html>
+<html>
+<head>
+ <title>Invalid Role Verification Tests</title>
+ <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="/resources/testdriver-actions.js"></script>
+ <script src="/wai-aria/scripts/aria-utils.js"></script>
+ <meta charset="utf-8">
+</head>
+<body>
+
+<p>Tests invalid ARIA roles from <a href="https://w3c.github.io/aria/#document-handling_author-errors_roles">9.1 Roles - handling author errors</a>.</p>
+
+<!-- Tests fallback for <nav> when 1/2/3 invalid roles are supplied -->
+<nav role="foo" data-testname="nav with invalid role name foo" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="foo bar" data-testname="nav with two invalid role names" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="foo bar baz" data-testname="nav with three invalid role names" data-expectedrole="navigation" class="ex">x</nav>
+
+<!-- Tests fallback for <button> when 1/2/3 invalid roles are supplied -->
+<button role="foo" data-testname="button with invalid role name foo" data-expectedrole="button" class="ex">x</button>
+<button role="foo bar" data-testname="button with two invalid role names" data-expectedrole="button" class="ex">x</button>
+<button role="foo bar baz" data-testname="button with three invalid role names" data-expectedrole="button" class="ex">x</button>
+
+<!-- Tests fallback for semantically neutral elements when 1/2/3 invalid roles are supplied -->
+<span role="foo" data-testname="span with invalid role name foo" class="ex-generic">x</span>
+<span role="foo bar" data-testname="span with two invalid role names" class="ex-generic">x</span>
+<span role="foo bar baz" data-testname="span with three invalid role names" class="ex-generic">x</span>
+<div role="foo" data-testname="div with invalid role name foo" class="ex-generic">x</div>
+<div role="foo bar" data-testname="div with two invalid role names" class="ex-generic">x</div>
+<div role="foo bar baz" data-testname="div with three invalid role names"class="ex-generic">x</div>
+
+<!-- Whitespace tests with <nav> (including line breaks, tabs, zero-width space, braille space, non-breaking space, standard space) -->
+<nav role=" " data-testname="nav with empty character as role" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="&#13" data-testname="nav with line break (&#13) character as role" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="&#9" data-testname="nav with tab (&#9) as role (should be treated as whitespace)" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="&#8203" data-testname="nav with zero-width space as role (should be treated as whitespace)" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="&#10240" data-testname="nav with braille space (10240) as role" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="&#x2800" data-testname="nav with braille space (x2800) as role" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="&nbsp;" data-testname="nav with non-breaking space (nbsp) as role" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="&#20" data-testname="nav with standard space (nbsp) as role" data-expectedrole="navigation" class="ex">x</nav>
+
+<!-- Escaped whitespace tests with <span> (including line breaks, tabs, zero-width space, braille space, non-breaking space, standard space) -->
+<span role=" " data-testname="span with escaped empty character as role" class="ex-generic">x</span>
+<span role="&#13" data-testname="span with escaped line break (&#13) character as role" class="ex-generic">x</span>
+<span role="&#9" data-testname="span with escaped tab (&#9) as role (should be treated as whitespace)" class="ex-generic">x</span>
+<span role="&#8203" data-testname="span with escaped zero-width space as role (should be treated as whitespace)" class="ex-generic">x</span>
+<span role="&#10240" data-testname="span with escaped braille space (10240) as role" class="ex-generic">x</span>
+<span role="&#x2800" data-testname="span with escaped braille space (x2800) as role" class="ex-generic">x</span>
+<span role="&nbsp;" data-testname="span with escaped non-breaking space (nbsp) as role" class="ex-generic">x</span>
+<span role="&#20" data-testname="span with escaped standard space (nbsp) as role" class="ex-generic">x</span>
+
+<!-- Unescaped whitespace tests with <span> (including line breaks, tabs, zero-width space, braille space, non-breaking space, standard space) -->
+ <span role=" " data-testname="span with empty character as role" class="ex-generic">x</span>
+ <span role="
+ " data-testname="span with line break (&#13) character as role" class="ex-generic">x</span>
+ <span role=" " data-testname="span with tab (&#9) as role (should be treated as whitespace)" class="ex-generic">x</span>
+ <span role="‍" data-testname="span with zero-width space as role (should be treated as whitespace)" class="ex-generic">x</span>
+ <span role="⠀" data-testname="span with braille space (10240) as role" class="ex-generic">x</span>
+ <span role=" " data-testname="span with non-breaking space (nbsp) as role" class="ex-generic">x</span>
+ <span role=" " data-testname="span with standard space as role" class="ex-generic">x</span>
+
+<!-- Diacritics with <a> -->
+<a href="#" role="&#771" data-testname="link with role set to tilde diacritic" data-expectedrole="link" class="ex">x</a>
+<a href="#" role="foo&#771" data-testname="link with role foo that has tilde diacritic" data-expectedrole="link" class="ex">x</a>
+<a href="#" role="&#773" data-testname="link with role set to overline diacritic" data-expectedrole="link" class="ex">x</a>
+<a href="#" role="foo&#773" data-testname="link with role foo that has overline diacritic" data-expectedrole="link" class="ex">x</a>
+<a href="#" role="&#813" data-testname="link with role set to circumflex diacritic below" data-expectedrole="link" class="ex">x</a>
+<a href="#" role="foo&#813" data-testname="link with role foo that has circumflex diacritic below" data-expectedrole="link" class="ex">x</a>
+<a href="#" role="button&#771" data-testname="link with role set to button with tilde diacritic" data-expectedrole="link" class="ex">x</a>
+
+<!-- Diacritics with <div> -->
+<div role="&#771" data-testname="div with role set to tilde diacritic" class="ex-generic">x</div>
+<div role="foo&#771" data-testname="div with role foo that has tilde diacritic" class="ex-generic">x</div>
+<div role="button&#771" data-testname="div with role set to button with tilde diacritic" class="ex-generic">x</div>
+<div role="button´" data-testname="div with role set to button with unescaped tilde diacritic" class="ex-generic">x</div>
+
+<!-- Zero-width joiners (e.g., ZWJ like emoji variants use) with <button> -->
+<!-- [sic] role="‍" should include an invisible ZWJ], and role="link‍" ends with an invisible ZWJ. Use caution when editing. -->
+<button role="‍" data-testname="button with role set to zero-width joiner" data-expectedrole="button" class="ex">x</button>
+<button role="link‍" data-testname="button with role set to foo with zero-width joiner" data-expectedrole="button" class="ex">x</button>
+
+<!-- Non-western chars with <nav> -->
+<nav role="Θ" data-testname="nav with role set to theta (Θ)" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="ژ" data-testname="nav with role set to Persian character (ژ)" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="ژ ♮" data-testname="nav with multiple non-latin character roles, Persian character (ژ) and ♮" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="漢字" data-testname="nav with role set to Japanese kanji" data-expectedrole="navigation" class="ex">x</nav>
+
+<!-- Non-western chars with <span> -->
+<span role="Θ" data-testname="span with role set to theta (Θ)" class="ex-generic">x</span>
+<span role="ژ" data-testname="span with role set to Persian character (ژ)" class="ex-generic">x</span>
+<span role="ژ ♮" data-testname="span with multiple non-latin character roles, Persian character (ژ) and ♮" class="ex-generic">x</span>
+<span role="漢字" data-testname="span with role set to Japanese kanji" class="ex-generic">x</span>
+
+<!-- RTL strings (Hebrew & Arabic) with <nav> -->
+<nav role="سلام" data-testname="nav with role set to Arabic text" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="سلام حبيب" data-testname="nav with multiple role assignments set to Arabic text" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="שלום" data-testname="nav with role set to Hebrew text" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="שלום חבר" data-testname="nav with multiple role assignments set to Hebrew text" data-expectedrole="navigation" class="ex">x</nav>
+
+<!-- RTL strings (Hebrew & Arabic) with <div> -->
+<div role="سلام" data-testname="div with role set to Arabic text" class="ex-generic">x</div>
+<div role="سلام حبيب" data-testname="div with multiple role assignments set to Arabic text" class="ex-generic">x</div>
+<div role="שלום" data-testname="div with role set to Hebrew text" class="ex-generic">x</div>
+<div role="שלום חבר" data-testname="div with multiple role assignments set to Hebrew text" class="ex-generic">x</div>
+
+<!-- Escaped chars, URL-encoded chars with <a> -->
+<a href="https://www.apple.com/" role="&amp" data-testname="link with role set to ampersand character" data-expectedrole="link" class="ex">x</a>
+<a href="https://www.apple.com/" role="&lt" data-testname="link with role set to less than angle bracket character" data-expectedrole="link" class="ex">x</a>
+
+<!-- Escaped chars, URL-encoded chars with <span> -->
+<span role="&amp" data-testname="span with role set to ampersand character" class="ex-generic">x</span>
+<span role="&lt" data-testname="span with role set to less than angle bracket character" class="ex-generic">x</span>
+<span role="&" data-testname="span with role set to unescaped ampersand character" class="ex-generic">x</span>
+<span role="<" data-testname="span with role set to unescaped less than angle bracket character" class="ex-generic">x</span>
+
+<!-- Backslash closing quote and other malformed roles with characters with <nav> -->
+<nav role="region\" data-testname="nav with role set to region followed by backslash" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="\region" data-testname="nav with role set to backslash followed by region" data-expectedrole="navigation" class="ex">x</nav>
+<nav role="re/gion" data-testname="nav with role set to region with backslash after e character" data-expectedrole="navigation" class="ex">x</nav>
+
+<!-- Backslash closing quote and other malformed roles with characters with <span> -->
+<span role="region\" data-testname="span with role set to region followed by backslash" class="ex-generic">x</span>
+<span role="\region" data-testname="span with role set to backslash followed by region" class="ex-generic">x</span>
+<span role="re/gion" data-testname="span with role set to region with forward slash after e character" class="ex-generic">x</span>
+
+<script>
+AriaUtils.verifyRolesBySelector(".ex");
+AriaUtils.verifyGenericRolesBySelector(".ex-generic");
+</script>
+
+</body>
+</html> \ No newline at end of file