WIP
Edit me
While in the HTML 5.1 spec, it is removed in the HTML living standard. Dropped because lack of support by browsers.
It was only used opening menus . At this moment there isn’t a spec. for adding menu items to the context menu.
Advised markup
Emmet
button [ type = "button" ][ aria-pressed ]
button [ type = "button" ][ aria-haspopup ][ aria-expanded ]
HTML
<button type= "button" ></button>
<button type= "button" aria-pressed= "false" ></button>
<!-- when closed -->
<button type= "button" aria-haspopup= "true" ></button>
<!-- when opened -->
<button type= "button" aria-haspopup= "true" aria-expanded= "true" ></button>
Screen reader results
<button>
<button> Test</button>
<input type="button">
<input type= "button" value= "Test" >
Toggle button
<button type= 'button' aria-pressed= 'false' > Test</button>
Screen reader
voiceover (macOs) 7.0 (477.40.6)
ChromeVox 53
NVDA 2017.4
Narrator 10.0.16299.15
Browser
Chrome
62
Safari
10
Firefox
55
Chrome
62
Firefox
57
Chrome
63
Edge
16
IE
11
Edge
16
IE
11
Spoken output
Test, toggle button Test, toggle button Test, button Test, button not pressed toggle button not pressed, Test toggle button not pressed, Test toggle button not pressed, Test button, Test off, Test, button off, Test, button
Skipped
false false false false false false false false false false
Pressed Toggle Button
<button type= 'button' aria-pressed= 'true' > Test</button>
Screen reader
voiceover (macOs) browsers
ChromeVox 53
NVDA 2017.4
Browser
Chrome
62
Safari
10
Firefox
55
Chrome
62
Firefox
57
Chrome
63
Edge
16
IE
11
Spoken output
Test, selected, toggle button Test, toggle button Test, button Test, button pressed toggle button pressed, Test toggle button pressed, Test toggle button pressed, Test button pressed, Test
Skipped
false false false false false false false false
Menu Button
<button type= "button" aria-haspopup= "true" > Test</button>
Screen reader
voiceover (macOs) 7.0 (477.40.6)
ChromeVox 53
NVDA 2017.4
Browser
Chrome
62
Safari
10
Firefox
55
Chrome
62
Firefox
57
Chrome
63
Edge
16
IE
11
Spoken output
Test, pop up button Test, pop up button Test, menu button Test, pop up button menu button subMenu, Test menu button subMenu, Test button, Test button subMenu, Test
Skipped
false false false false false false false false
Menu button with open menu
<button type= "button" aria-haspopup= "true" aria-expanded= "true" > Test</button>
Screen reader
voiceover (macOs) 7.0 (477.40.6)
ChromeVox 53
NVDA 2017.4
Browser
Chrome
62
Safari
10
Firefox
55
Chrome
62
Firefox
57
Chrome
63
Edge
16
IE
11
Spoken output
Test, expanded, pop up button Test, expanded, pop up button Test, menu button Test, popup button expanded menu button expanded subMenu, Test menu button expanded subMenu, Test button expanded, Test button expanded subMenu, Test
Skipped
false false false false false false false false
<button type= "button" aria-haspopup= "true" aria-expanded= "true" aria-controls= "menu-1" > Test</button>
<ul id= "menu-1" role= "menu" >
<li role= "menuitem" > Menu item</li>
</ul>
Screen reader
voiceover (macOs) 7.0 (477.40.6)
ChromeVox 53
NVDA 2017.4
Browser
Chrome
62
Safari
10
Firefox
55
Chrome
62
Firefox
57
Chrome
63
Edge
16
IE
11
Spoken output
Test, expanded, pop up button Test, expanded, pop up button Test, menu button Test, popup button expanded menu button expanded subMenu, Test menu button expanded subMenu, Test button expanded, Test button expanded subMenu, Test
Skipped
false false false false false false false false
Specifications