B2GでAccessFuをそれなりに試す

B2Gのアクセシビリティ機能は常用できるレベルにはまだ達していませんが、試すレベルでもいくつかのハードルがあります。

スクリーン・リーダー(AccessFu)に関して言えば、そもそもテキストから音声に変換する機能が入っていない*1のですが、次のような問題もあります。

  • 1. SettingsにAccessFuの有効化オプションがない
  • 2. 画面に表示されていないアイテムにも仮想カーソルが移動し、どのアイテムを選択しているのかわからない
  • 3. ホームスクリーンのアプリを起動できない

1番目の「設定画面にAccessFuの有効化オプションがない」問題は、SettingsアプリのHTML(gaia/apps/settings/index.html)を編集するだけで解決します。

アクセシビリティの項目が表示されないのはhidden属性が設定されているためですので、表示させるにはhidden属性を取ります。

<li hidden>
  <a id="menuItem-accessibility" class="menu-item" href="#accessibility" data-l10n-id="accessibility">Accessibility</a>
</li>

2番目の、「画面に表示されていないアイテムに仮想カーソルが移動し、どのアイテムを選択しているのかわからない」には2つの観点があります。まず、画面に表示されていないアイテムに仮想カーソルが移動する問題から考えます。

B2GでAccessFuを起動すると、仮想カーソルが選択しているアイテムにオレンジ色の枠がつきます*2。ここまでは良いのですが、しばしば、アイテムが存在していないよう領域にも、オレンジ色の枠が移動します。これは、起動アプリの奥に存在する(z-indexの小さな)アプリの内部で、仮想カーソルが移動しているためです。画面上は、手前のアプリケーションに重なって見えないアプリケーションも、適切に作らないと、支援技術からは丸見えとなり、仮想カーソルが移動していってしまいます。

この問題の解決方法はいくつかあります。

  • display:noneを設定する
  • visibility:hiddenを設定する
  • aria-hidden属性を設定する

display:noneやvisibility:hiddenが設定された要素は、画面に描画されませんし、AccessFuからもアクセスできません(仮想カーソルが移動しません)。

描画はされているが、支援技術からアクセスできると困るものにはaria-hidden=trueを設定します。aria-hidden=trueを指定した要素(とその子孫)はAccessFuからアクセスできなくなり、仮想カーソルが移動しなくなります。Gaiaではロックスクリーンでaria-hidden属性が使われています(関連コミット)。ロックスクリーンを解除する前に、裏で起動しているアプリにアクセスできたら困ります。

もう1つの観点は、現状、仮想カーソルがどのアイテムに移動しているのかわからない、というものです。将来的には修正されるかもしれませんが、現状、端末の画面を睨んでいても、仮想カーソルがどのアイテムを指しているのか、わかりません。わからないなら、読み上げ内容を画面上に表示して、どのアイテムに仮想カーソルが移動しているかの手がかりにすれば良いと思い、AndroidのTalkbackをパクった読み上げ内容通知バーを捏造しました。

3番目の、ホームスクリーンのアプリを起動できない問題は、Eitan Isaacson(eeejay)さんが取り組まれています(885404 – Fix and enhance homescreen accessibility)。

ホームスクリーンのランチャー起動は現状ではTouch APIのイベントだけを監視していますが、clickイベントも監視することで対応するようです(Added click listener for doc items as well)。このあたりはPointer Eventsなどで綺麗に書けるようになるのでしょうか…?

修正が完了すれば、Gaia本家に取り込まれると思いますが、当面はeeejayさんの作業ブランチをビルドするのがてっとり早いでしょう。repoコマンドが使うリポジトリの情報はXMLファイル(.repo/manifests/*.xml)に記述されていますので、自分がビルドする端末用のXMLファイルを編集して、通常のGaiaではなくeeejayさんの作業ブランチをビルドするようにしました。Peakの場合、XMLファイルは.repo/manifests/peak.xmlとなります。

<manifest>
<!-- 追加 -->
<remote fetch="git://github.com/eeejay/" name="eeejay"/>
<!-- 略 -->
<!-- 通常のGaiaの設定をコメントアウトして、以下の設定を追加 -->
<project name="gaia" path="gaia" remote="eeejay" revision="homescreen-a11y-tweaks"/>
<!-- 略 -->
</manifest>

これで、B2GでAccessFuをそれなりに試せる状態になりましたが、いくつか問題が残っています。

  • アプリが立ち上がっても、新しいアプリに仮想カーソルが移動しない
  • テキスト入力ができない
  • 音声出力ができない

アクセシビリティの設定項目からhidden属性が取れるのはまだ先のようです。

*1:少なくとも私は見つけられていません

*2:AndroidFirefoxと同様です