ブラウザーサポート

Needless UI は、ネイティブ要素と、Popover API などの新しい Web プラットフォーム機能の上に構築されています。下の表のブラウザーを、記載したバージョン以降でサポートします。それより古いバージョンでは、メニュー、セレクト、ポップオーバーが開きません。

対応ブラウザー

Opera や Brave など、Chromium をベースにしたほかのブラウザーは、Chrome のバージョンに準じます。Angular 22 自体も、Chrome、Edge、Firefox はバージョン 119 以降、Safari は 17 以降を必要とします。Internet Explorer と、Chromium ベースになる前の旧 Edge はサポートしていません。

テスト対象のブラウザー

変更のたびに、各コンポーネントのテストを Chrome、Firefox、Safari のエンジンで実行します。リリース前には、このドキュメントの全ページを、すべてのエンジンで、パソコンとタッチ操作のスマートフォンの両方で確認します。各ページは、問題なく起動し、すべてのメニューとポップアップが開き、画面に収まり、アクセシビリティチェックに合格しなければなりません。

対応する最も古いバージョンからテスト対象のバージョンまでの間にあるバージョンは、1つずつテストしているわけではありません。コンポーネントに必要な機能をすべて備えているので、サポート対象としています。

新しいブラウザーでの追加機能

いくつかの細かな部分は、新しいブラウザーにしかない機能を使っています。ほかのブラウザーではその部分が省かれるだけで、何も壊れません。

スマートフォンとタッチスクリーン

すべてのコンポーネントがタッチ操作に対応しています。スプリッターのハンドル、カラーピッカーのエリア、データグリッドの列の境界、トーストは、ページをスクロールさせずに指の動きに追従します。カルーセルはブラウザー本来のスクロールでスワイプでき、スケジューラーの予定は長押しでつかんで動かせます。タッチスクリーンでは入力欄の文字を 16px 以上にしているので、iPhone で入力欄が拡大されません。また、Android のキーボードのように単語を未確定のまま組み立てるキーボードでも、単語が欠けずに入力されます。

タッチスクリーンではホバーできないため、ホバーカードはページ上の内容を補足するだけのものです。欠かせない情報はホバーカードに入れないでください。スマートフォンでは、チャットの Return キーで改行し、送信はボタンで行います。

Safari でのキーボード操作

Safari の Tab キーは、デフォルトではテキストフィールドとポップアップメニューの間しか移動しません。すべてのボタンとリンクに移動するには、Safari の「詳細」設定で「Tabキーを押したときにWebページ上の各項目を強調表示」をオンにするか、Option + Tab キーを押します。また、Safari はクリックされたボタンにフォーカスを移しません。コンポーネントがこれを補うため、クリックしたあとも、ほかのブラウザーと同じようにキーボードで操作を続けられます。