Chrome 87 ベータ版: DevTools の WebAuthn タブ、パン/チルト/ズーム、flow-relative の省略形など
特に記載のない限り、下記の変更は Android、Chrome OS、Linux、macOS、Windows 向けの最新の Chrome ベータ版チャンネル リリースに適用されます。ここに記載されている機能の詳細については、リンクまたは ChromeStatus.com の一覧でご確認ください。2020 年 10 月 15 日の時点で Chrome 87 はベータ版です。
DevTools の WebAuthn タブ
Web Authentication のテストは、コードをテストするデバイスが必要なので長らく困難でした。Chrome 87 より、DevTools の新しいパネルを使って認証のエミュレートやデバッグができるようになります。この DevTools のパネルは、[More options]、[More tools]、[WebAuthn] の順に選択すると表示されます。詳しい使用方法は、DevTools の新機能（Chrome 87）の WebAuthn のセクションをご覧ください。
カメラのパン、チルト、ズームの制御
部屋単位のビデオ会議ソリューションでは、ソフトウェアがカメラでミーティングの参加者を映せるよう、カメラをパン、チルト、ズームする機能が搭載されます。Chrome 87 より、MediaDevices.getUserMedia() と MediaStreamTrack.applyConstraints() のメディア トラック制約を使って、ウェブサイトからカメラのパン、チルト、ズーム機能にアクセスできるようになります。
この機能は、ユーザーが明示的にアクセス許可を与えた場合にのみ操作できます。新機能の詳しい使い方やデモは、カメラのパン、チルト、ズームを制御するをご覧ください。
CSS flow-relative の省略形と offset プロパティ
物理プロパティを論理プロパティで補完するというのが、長年にわたる CSS のトレンドになっています。中国語の縦書きテキストやアラビア語など、ヨーロッパ式以外のテキストでは、左から右や上から下に読むことを想定した言語のプロパティは動作しません。最新の CSS では、テキストの軸（方向）を扱うルールは、start や end のように flow-relative（テキストの方向に相対的）な語句を使って提供されています。
Chrome でこれを最初に実装したのは、CSS Logical Properties and Values 仕様によるおおまかな flow-relative 機能の実装でした。Chrome 87 では、この省略形が導入され、
このような論理プロパティと値が少しばかり書きやすくなります。具体的には、これまで複数の CSS ルールで書いていたことを 1 つのルールで書けるようになります。たとえば、margin-block-start と margin-block-end という別々のルールを、1 つの margin-block プロパティを使って書けるようになりました。
現在 Chrome でサポートされているすべての flow-relative の省略形の一覧や、その使い方の説明については、flow-relative の省略形による論理レイアウトの拡張をご覧ください。その他の CSS 関連のアップデートについては、下の CSS のセクションをご覧ください。
完了したオリジン トライアル
オリジン トライアルとして新機能を試せるようにすることで、ウェブ標準コミュニティにユーザビリティ、実用性、有効性についてのフィードバックを提供することができます。Chrome で以前にオリジン トライアルが行われていた以下の機能は、現在デフォルトで有効化されています。
Cookie Store API は、HTTP Cookie を Service Worker に公開するとともに、document.cookie に代わる非同期的な仕組みを提供します。
今回のリリースに追加されたその他の機能
Chrome 87 では、Cross-Origin Isolation に関する多数の変更が行われています。Chrome は、Cross-Origin Isolation エージェント クラスタのエージェント クラスタキーとして、サイトではなくオリジンを使うようになります。Cross-Origin Isolation エージェント クラスタでは、document.domain の変更はサポートされなくなります。この変更と合わせて、window.crossOriginIsolated も導入されます。これは、Cross-Origin Isolation が必要な API の使用が許可されているかどうかを示すブール値です。サポートされる API は以下になります。
SharedArrayBuffer（WebAssembly スレッドに必須）performance.measureMemory()- JS Self-Profiling API
詳しくは、Making your website "cross-origin isolated" using COOP and COEP をご覧ください。
disallowdocumentaccess プロパティを追加し、同じ親ドキュメント内の Same-Origin から iframe 間のクロスドキュメント スクリプティングを許可しないようにします。これにより、Same-Origin の iframe を別々のイベントループに入れるようにもなります。
長時間実行されるスクリプトによって、ユーザーの入力がブロックされることがあります。アプリでユーザーのアクションとレスポンスの間にタイムラグが発生すると、ユーザー エクスペリエンスが悪化します。これに対処するため、Chrome に isInputPending() というメソッドが追加されました。このメソッドには、長時間実行するオペレーションから navigator.scheduling を通して呼び出すことでアクセスできます。メソッドの使用例は、ドラフト版の仕様に掲載されています。
ここ数年の間に主要なブラウザで利用できるようになった HTTP 範囲リクエストを使うと、サーバーがクライアントにリクエストされた範囲のデータをチャンク形式で送信できます。この機能は、大きなメディア ファイルで特に有効です。スムーズな再生を実現し、一時停止や再開の機能を改善できるので、ユーザー エクスペリエンスを向上できます。
従来、範囲リクエストと Service Worker はうまく連携できませんでした。そのため、デベロッパーは回避策を構築せざるを得ませんでした。Chrome 87 より、Service Worker からネットワークに範囲リクエストを渡しても、通常どおり動作するようになります。
範囲リクエストに関する問題の説明や、Chrome 87 の変更点については、Service Worker で範囲リクエストを扱うをご覧ください。
Transferrable Streams で、postMessage() の引数に ReadableStream、WritableStream、TransformStream オブジェクトを渡せるようになります。Stream API では、データ ストリームの作成、構成、使用のためのユビキタスで相互運用可能なプリミティブが提供されます。ストリームは、Web Worker に渡して使うのが一般的です。この流れるようなプリミティブにより、作業を別のスレッドにオフロードできます。
ワーカーに作業をオフロードすることは、スムーズなユーザー エクスペリエンスを提供する上で重要なことですが、人間工学的に不自然になる可能性があります。Transferrable Streams は、このストリームの問題を解消します。ストリーム自体を転送すると、データは透過的にバックグラウンドにクローンされます。
ontransitionrun、ontransitionstart、ontransitioncancel イベント ハンドラ属性を利用すると、要素、Document オブジェクト、Window オブジェクトに 'transitionrun'、'transitionstart'、'transitioncancel' イベントに対応するイベント リスナーを追加できます。
WakeLockSentinel オブジェクトに released という新しいプロパティが追加されます。このプロパティは、sentinel が既にリリースされているかどうかを示します。デフォルトは false で、release イベントがディスパッチされると true になります。この新しい属性によって、ウェブ デベロッパーはロックのリリース タイミングを確認できるようになり、手動でトラッキングする必要はなくなります。
CSS
フォント メトリックをオーバーライドする @font-face 記述子
新しい @font-face 記述子が ascent-override、descent-override、line-gap-override に追加され、フォントのメトリックをオーバーライドできるようになりました。これにより、ブラウザやオペレーティング システム間の相互運用性が改善され、OS やブラウザによらず同じサイトで同じフォントが常に同じ外見になります。また、別のグリフで同時に提示される 2 つのウェブフォント間のメトリックを合わせます。さらに、フォールバック フォント用にフォントのメトリックをオーバーライドしてウェブフォントをエミュレートし、Cumulative Layout Shift（ページのレイアウトのずれ）を最小限に抑えます。
テキスト修飾と下線プロパティ
Chrome でいくつかの新しいテキスト修飾と下線プロパティがサポートされます。これらのプロパティを使うと、下線がテキストのベースラインに近すぎる場合や、下線が途切れる位置が早すぎる場合に対処できます。これは、text-decoration-skip-ink プロパティが導入されたことで起こるようになった問題を解決するものです。新しいプロパティは、text-underline-position の text-decoration-thickness、text-underline-offset、from-font キーワードです。
quotes プロパティが 'auto' 値をサポート
CSS2 では、ブラウザが quotes プロパティのデフォルト値を定義することが許可されていました。これまで、Chrome はそれに従っていました。Chrome 87 は CSS Generated Content Module Level 3 に従い、'auto' キーワードがデフォルト値になります。この仕様では、要素や親要素のコンテンツ言語に基づいてタイポグラフ的に適切な値を引用符に使用する必要があります。
JavaScript
このバージョンの Chrome には、V8 JavaScript エンジンのバージョン 8.7 が組み込まれます。具体的には、以下の変更点が含まれます。最新の機能リストをすべて確認したい方は、V8 リリースノートをご覧ください。
Atomics.waitAsync()
Chrome は、Atomics.wait() の非同期版である Atomics.waitAsync() をサポートします。プログラマーが Atomics.waitAsync() を使うと、Atomics.wait() と同じように SharedArrayBuffer の位置で待機できますが、返されるのは Promise になります。
Atomics.wait() はスレッドをブロックするので、ブロックが許可されていないウェブブラウザのメインスレッドでは使用できません。この仕組みは、SharedArrayBuffers を通してメインスレッドとワーカー スレッド間の調整を行うことで、人間にとって使いやすい形を実現します。
このバージョンの Chrome では、以下のサポートの終了および機能の削除が行われます。現在サポートが終了している機能および以前に削除された機能のリストは、ChromeStatus.com をご覧ください。
<iframe> タグのアクセス許可ポリシー宣言で、アイテム間の区切り文字としてコンマを利用できなくなります。代わりにセミコロンを使うようにしてください。
Blink は、ほとんど使われていない -webkit-font-size-delta プロパティをサポートしなくなります。フォントサイズを調整したい場合は、代わりに font-size を使うようにしてください。
Chrome では、FTP URL のサポートを終了して削除する作業が進んでいます。Google Chrome の現在の FTP 実装は、暗号化接続（FTPS）やプロキシをサポートしていません。ブラウザからの FTP の利用率はかなり低く、既存の FTP クライアント機能の改善に注力するのは現実的ではありません。また、影響するすべてのプラットフォームで、機能の豊富な FTP クライアントが利用できます。
Google Chrome 72 以降では、FTP によるドキュメント サブリソースのフェッチと、トップレベル FTP リソースのレンダリングのサポートが削除されています。現在、FTP URL を開くと、リソースの種類によって、ディレクトリ一覧またはダウンロードが表示されます。Google Chrome 74 以降のバグにより、HTTP プロキシを経由した FTP URL へのアクセスがサポートされなくなっています。FTP のプロキシ サポートは、Google Chrome 76 で完全に削除されました。Chrome 86 では、FTP がプレリリース チャンネル（Canary 版とベータ版）で無効になり、安定版のユーザーの 1% でも試験的に無効化されました。
Google Chrome の FTP 実装に残された機能は、暗号化されていない接続でのディレクトリ一覧の表示とリソースのダウンロードのみとなっています。
なお、サポート終了のスケジュールは以下のようになっています。
Chrome 87
デフォルトで、FTP サポートは 50% のユーザーに対して無効化されますが、フラグを使うと有効化できます。
Chrome 88
FTP サポートが無効化されます。
Reviewed by Eiji Kitamura - Developer Relations Team