React-axe で React アプリケーションのアクセシビリティを向上させる | メルカリエンジニアリング

こんにちは、この 4 月にメルカリに新卒入社したフロントエンドエンジニアの @karszawa です。 この頃は Google I/O 2019 のキーノートでアクセシビリティが大きく取り上げられたり、Safari に Audit タブが追加されアクセシビリティに関する様々なテストできるようになったりと、フロントエンド界隈におけるアクセシビリティへの関心の高まりを感じます。 本記事では React アプリケーションのアクセシビリティをチェックするためのライブラリである React-axe と、その中心技術である axe-core を応用した様々なツールをご紹介します。 React-axe とは React-axe は React アプリケーションのアクセシビリティをチェックするためのツールです。チェックの結果は Chrome DevTools に表示され、開発中にアクセシビリティの問題に気

[braitom]

React-axeを使ったReactアプリのアクセシビリティチェック方法、出てきた問題とその修正方法、jest-axeを使ったJestからの利用方法などが書かれている。

[efcl]

React-axeでReactアプリケーションのアクセシビリティについてをチェックすることについて。 React-axeで自動的にチェックできる項目とできない項目についてなど