(This screenshot from 駒瑠市〜アクセシビリティ上の問題の体験サイト〜)
- Accessibility Visualizer ユーザーズガイド (Japanese)
- Accessibility Visualizer User's Guide (English)
- Accessibility Visualizer 사용자 가이드 (Korean)
It is built with WXT.
To develop extension, launch the dev server
# Install dependencies
$ pnpm install
# To develop for Chrome/Chromium browsers
$ pnpm --filter=@a11y-visualizer/browser-extension dev
# To develop for Firefox
$ pnpm --filter=@a11y-visualizer/browser-extension dev:firefox
WXT will automatically open your browser and load the extension in development mode.
There is a test page in apps/test_site/ directory. You can use it to test the extension:
# Start the test site server
$ pnpm --filter=@a11y-visualizer/test-site dev
Then visit http://localhost:5173 to access various test pages for accessibility features.
# Install dependencies
$ pnpm install
# Build browser extension for Chrome/Chromium
$ pnpm --filter=@a11y-visualizer/browser-extension build
# Build browser extension for Firefox
$ pnpm --filter=@a11y-visualizer/browser-extension build:firefox
# Create zip files for store distribution
$ pnpm --filter=@a11y-visualizer/browser-extension zip
$ pnpm --filter=@a11y-visualizer/browser-extension zip:firefox
The built extensions will be in apps/browser_extension/dist/ directory, and zip files will be created in the same location.