| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"/> |
| <title>MathML tabIndex attribute</title> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#css-styling"> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#the-top-level-math-element"> |
| <meta name="assert" content="Verify default values for the tabIndex attribute"> |
| |
| <script src="/mathml/support/mathml-fragments.js"></script> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| </head> |
| <body> |
| <div id="log"></div> |
| <math> |
| </math> |
| <script> |
| const htmlLinkableElements = |
| new Set([ |
| 'mi', 'mo', 'mn', 'ms', 'mtext', 'mrow' |
| ]); |
| |
| Object.keys(MathMLFragments).forEach(elName => { |
| const mathEl = document.querySelector('math'); |
| |
| mathEl.innerHTML = ` |
| <${elName} id="el" onfocus="alert('fail')"></${elName}> |
| <${elName} id="el-link" href="javascript:alert('fail')" onfocus="alert('fail')"></${elName}> |
| `; |
| |
| const el = mathEl.querySelector('#el'); |
| const elLink = mathEl.querySelector('#el-link'); |
| |
| const expectedDefault = (htmlLinkableElements.has(elName)) ? 0 : -1; |
| |
| test(() => { |
| assert_equals(el.tabIndex, expectedDefault, "no attribute"); |
| el.setAttribute("tabindex", "invalid"); |
| assert_equals(el.getAttribute("tabindex"), "invalid"); |
| assert_equals(el.tabIndex, expectedDefault, "invalid"); |
| el.setAttribute("tabindex", "9999999999"); |
| assert_equals(el.getAttribute("tabindex"), "9999999999"); |
| assert_equals(el.tabIndex, expectedDefault, "too large integer"); |
| }, `default and invalid values for ${elName} without href`); |
| test(() => { |
| assert_equals(elLink.tabIndex, expectedDefault, "no attribute"); |
| elLink.setAttribute("tabindex", "invalid"); |
| assert_equals(elLink.getAttribute("tabindex"), "invalid"); |
| assert_equals(elLink.tabIndex, expectedDefault, "invalid"); |
| elLink.setAttribute("tabindex", "9999999999"); |
| assert_equals(elLink.getAttribute("tabindex"), "9999999999"); |
| assert_equals(elLink.tabIndex, expectedDefault, "too large integer"); |
| }, `default and invalid values for ${elName} with href`); |
| }); |
| </script> |
| </body> |
| </html> |
