2017-09-28 10:28:16 +03:00
|
|
|
# accessibilityjs
|
|
|
|
|
|
|
|
|
|
Client side accessibility error scanner.
|
|
|
|
|
|
|
|
|
|
## Usage
|
|
|
|
|
|
|
|
|
|
```javascript
|
|
|
|
|
import scanForProblems from 'accessibilityjs'
|
|
|
|
|
|
|
|
|
|
function logError(error, onPageWarning = true) {
|
|
|
|
|
error.element.addEventListener('click', function () {
|
|
|
|
|
alert(`${error.name}\n\n${error.message}`)
|
|
|
|
|
}, {once: true})
|
|
|
|
|
|
|
|
|
|
if (onPageWarning) error.element.classList.add('accessibility-error')
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
document.addEventListener('ready', function() {
|
|
|
|
|
scanForProblems(document, logError)
|
|
|
|
|
})
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
## Browser support
|
|
|
|
|
|
|
|
|
|
- Chrome
|
|
|
|
|
- Firefox
|
|
|
|
|
- Safari
|
|
|
|
|
- Internet Explorer 11+
|
|
|
|
|
- Microsoft Edge
|
|
|
|
|
|
|
|
|
|
Internet Explorer and Edge require a polyfill for [`closest`](https://developer.mozilla.org/en-US/docs/Web/API/Element/closest#Polyfill).
|
|
|
|
|
|
|
|
|
|
## Development
|
|
|
|
|
|
|
|
|
|
Test script changes with `test.html`.
|
