Difference between revisions of "Random Testing RJ"

From Level Access Web Labs
Jump to navigation Jump to search
(118 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<html>
 
<html>
 +
<script>
 +
function getfocus() {
 +
  document.getElementById("myAnchor").focus();
 +
}
 +
 +
function losefocus() {
 +
  document.getElementById("myAnchor").blur();
 +
}
 +
 +
</script>
 
   <style type="text/css">
 
   <style type="text/css">
 
     .hidden {
 
     .hidden {
Line 21: Line 31:
 
   </head>
 
   </head>
 
   <body>
 
   <body>
  <p>Activate the button/link to expand them and set the aria-expanded state to true. Activate again to collapse.</p>
+
-DELETE ME--<br>
  <section>
+
<a href="#">Test</a><br>
    <button onclick="toggle(this);" id="b1" aria-expanded="false" aria-controls="p1"> Details </button>
+
<h2></h2>
    <p class="hidden" id="p1" tabindex="-1"> This is some text.</p>
+
<h3>&nbsp;</h3>
  </section>
+
 
  <section>
+
<div role="heading" aria-level="1">&nbsp;</div>
    <a href="#" onclick="toggle(this);" id="a1" aria-expanded="false" aria-controls="p2" > Level Access</a>
+
<input aria-hidden="true" type="radio" id="someid">
    <p class="hidden" id="p2">Level Access is an digital accessibility solutions provider.</p>
+
<label for="someid">Aria hidden on the radio input</label>
  </section>
+
 
 +
<input type="text" title="hi there" aria-hidden="true"><br>
 +
 
 +
<div class="material-radio f-material-radio"><input class="radio-input" id="m-spanish" name="prefLanguage" type="radio" aria-hidden="true" value="es-US"><label for="m-spanish" role="radio" aria-checked="false">Espa&ntilde;ol</label></div><br>
 +
 
 +
 
 +
-- Delete Me <br>
 +
<table role="presentation">
 +
<tr>
 +
<td>Company Name</td>
 +
<td>Level Access</td>
 +
</tr>
 +
<tr>
 +
<td>State</td>
 +
<td>VA</td>
 +
</tr>
 +
</tr>
 +
<tr>
 +
<td>Country</td>
 +
<td>USA</td>
 +
 
 +
</table><br>
 +
 
 +
<table role="presentation">
 +
<tr>
 +
<td>Company Name</td>
 +
<td><a href="#">Level Access</a></td>
 +
</tr>
 +
<tr>
 +
<td>State</td>
 +
<td><input type="text"></td>
 +
</tr>
 +
</tr>
 +
<tr>
 +
<td>Country</td>
 +
<td>USA</td>
 +
 
 +
</table>
 +
-DELETE ME--<br>
 +
 
 +
        <h3>div container with style="display: table-cell" and role of region</h3>
 +
        <div style="display: table-cell" role="region" aria-label="test">
 +
 
 +
            <div>Hello world</div>
 +
            <div>Goodbye World</div>
 +
        </div>
 +
 
 +
        <h3>div container with style="display: table-cell"</h3>
 +
        <div >
 +
            <div style="display: table-cell">Hello world</div>
 +
            <div style="display: table-cell">Goodbye World</div>
 +
        </div>
 +
 
 +
        <h3>div container with style="display:table" and role of region</h3>
 +
        <div  role="region" aria-label="testing region">
 +
            <div style="display:table;">Hello world</div>
 +
            <div style="display:table;">Goodbye World</div>
 +
        </div><br>
 +
<h3 tabindex="-1" >JavaScript Focus</h3>
 +
<div role="region" aria-label="errors and notifications">
 +
<div tabindex="-1" id="myAnchor" >The following errors has occurred<br>
 +
<a href="#">Error Number 1</a><br>
 +
Error Number 2</br>
 +
</div>
 +
 
 +
<input type="button" onclick="getfocus()" value="Get focus">
  
  <div role="img" aria-expanded="true"> test </div>
 
  <div role="tablist" aria-expanded="true"> test </div>
 
  <div role="tree" aria-expanded="true"> test </div>
 
 
   <body>
 
   <body>
 
</html>
 
</html>
 
See also  [[ARIA Accordion]]
 
  
 
==Notes==
 
==Notes==
This example uses ARIA-Expanded and ARIA-Controls.
+
Random Testing - Not accessible examples
  
 
==Test Results==
 
==Test Results==
JAWS with internet Explorer, Firefox and Chrome The expanded and collapsed state are announced as expected. In Firefox and Internet Explorer the JAWS command INSERT+ALT+M moves the virtual cursor to the new content. This does not work in Google chrome.
+
What are the test results?
With NVDA the Expanded and collapsed state are announced as expected. Note there is no NVDA command to move to the new content.
 
In iOS with VoiceOver the Expanded and collapsed state are announced as expected.
 
  
 
[[Category: ARIA]]
 
[[Category: ARIA]]

Revision as of 19:13, 19 September 2019

-DELETE ME--
Test

 

 



-- Delete Me

Company Name Level Access
State VA
Country USA


Company Name Level Access
State
Country USA

-DELETE ME--

div container with style="display: table-cell" and role of region

Hello world
Goodbye World

div container with style="display: table-cell"

Hello world
Goodbye World

div container with style="display:table" and role of region

Hello world
Goodbye World


JavaScript Focus

The following errors has occurred
Error Number 1
Error Number 2

Notes

Random Testing - Not accessible examples

Test Results

What are the test results?