@@ -7,15 +7,12 @@ Warns about potential accessibility issues with your React elements.
77
88![ screenshot] ( http://i.imgur.com/naQTETB.png )
99
10- ## WIP
11-
12- This is a WIP, feel free to explore, open issues, and suggest assertions :)
1310
1411## Installation
1512
1613Run:
1714
18- ``` sh
15+ ``` bash
1916npm install react-a11y
2017```
2118
@@ -26,19 +23,19 @@ getting warnings in the console as your app renders. Note that by default all
2623rules are turned ` off ` so you need to turn them on first (by setting them to
2724` "warn" ` or ` "error" ` ).
2825
29- ``` js
30- import React from ' react'
31- import ReactDOM from ' react-dom'
26+ ``` javascript
27+ import React from ' react' ;
28+ import ReactDOM from ' react-dom' ;
3229
3330if (ENV === ' development' ) {
34- const a11y = require (' react-a11y' ).default
31+ const a11y = require (' react-a11y' ).default ;
3532 a11y (React, ReactDOM, {
3633 rules: {
37- ' img-uses-alt' : ' warn'
38- , ' redundant-alt' : [ ' warn' , [ ' image' , ' photo' , ' foto' , ' bild' ]]
34+ ' img-uses-alt' : ' warn' ,
35+ ' redundant-alt' : [ ' warn' , [ ' image' , ' photo' , ' foto' , ' bild' ]]
3936 // ...
4037 }
41- })
38+ });
4239}
4340```
4441
@@ -50,8 +47,8 @@ React rendering functions and this might make this slower.
5047These are the supported configuration options, annotated using [ flow] [ ] type
5148annotations
5249
53- ``` js
54- a11y (React : React, ReactDOM : ReactDOM, opts : object? )
50+ ``` flow js
51+ a11y(React : React, ReactDOM : ReactDOM, opts : object? );
5552```
5653
5754` React ` is the React object you want to shim to allow the
@@ -71,19 +68,20 @@ can safely omit it when using `react-a11y` in node.
7168 - ` rules : object `
7269 The configuration options for each of the rules. This uses the same format
7370 as [ eslint] [ ] does:
74- ` ` ` js
71+
72+ ``` javascript
7573 const rules = {
76- ' img-uses-alt' : ' off'
77- , ' redundant-alt' : [
78- ' warn'
74+ ' img-uses-alt' : ' off' ,
75+ ' redundant-alt' : [
76+ ' warn' ,
7977 // other options to pass to the rule:
80- , [
78+ [
8179 ' foto'
8280 ]
8381 ]
84- }
85-
82+ };
8683 ```
84+
8785 Refer to the [rule docs](docs/ rules)
8886 to see what options are defined for each rule.
8987
@@ -102,9 +100,10 @@ can safely omit it when using `react-a11y` in node.
102100 browser.
103101 - `url : string?` - The url to a webpage explaining why this rule
104102 is important
103+
105104 The default reporter displays all the information it can, but listens
106105 to the deprecated options `includeSrcNode`, `warningPrefix` and
107- ` throwErro and ` throwError` .
106+ `throwErro` and `throwError`.
108107
109108 - `filterFn : (string, string, string) => boolean`
110109 You can filter failures by passing a function to the `filterFn` option. The
@@ -114,11 +113,11 @@ can safely omit it when using `react-a11y` in node.
114113
115114 Note: If it is a ReactElement, the name will be the node type (eg. `div`)
116115
117- ```js
116+ ```javascript
118117 // only show errors on CommentList
119118 const commentListFailures = function (name, id, msg) {
120119 return name === " CommentList" ;
121- }
120+ };
122121
123122 a11y (React, ReactDOM, { filterFn: commentListFailures });
124123 ```
@@ -128,9 +127,9 @@ can safely omit it when using `react-a11y` in node.
128127Use the ` restoreAll()` method to clean up mutations made to ` React` .
129128Useful if you are using ` react-a11y` in your test suite:
130129
131- ` ` ` js
132- beforeEach (() => a11y (React))
133- afterEach (() => a11y .restoreAll ())
130+ ` ` ` javascript
131+ beforeEach(() => a11y(React));
132+ afterEach(() => a11y.restoreAll());
134133` ` `
135134
136135## Writing plugins
0 commit comments