CSS の新しい色タイプと色空間、CSS の三角関数、View Transitions API が追加されました。
特に記載のない限り、Android、ChromeOS、Linux、macOS、Windows 向けの最新の Chrome Beta チャンネル リリースに以下の変更が適用されます。機能の詳細については、上記のリンクまたは ChromeStatus.com のリストをご覧ください。2023 年 2 月 9 日時点で Chrome 111 はベータ版です。最新版は Google.com（パソコン版）または Google Play ストア（Android 版）からダウンロードできます。
CSS
CSS の新しい色のタイプとスペース
CSS カラーレベル 4 で説明されているすべての機能が有効になりました。これには、デバイスに依存しない 4 つの色タイプ（lab、Oklab、lch、Oklch）、color() 関数、グラデーションやアニメーション用のユーザー定義の色空間が含まれます。
これらの新しいカラータイプとスペースについては、高解像度 CSS カラーガイドをご覧ください。
color-mix() 関数
CSS Color 5 の非常に便利な color-mix() 関数もリリースされています。この関数を使用すると、サポートされている色空間で、ある色の一部を別の色にミックスできます。次の例では、blue の 10% を SRGB の white にミックスしています。
.item {
background-color: color-mix(in srgb, blue 10%, white);
}
CSS セレクタ 4 疑似クラス :nth-child(an + b of S)
:nth-child(an + b) と :nth-last-child() を拡張してセレクタを取得します。たとえば、:nth-child(3 of .c) は特定の親の下の 3 番目の .c です。詳細については、of S 構文で :nth-child() の選択をより詳細に制御するをご覧ください。
CSS ルート フォント ユニット
ルート フォント単位 rex、rch、ric、rlh を rem の既存のルート フォント単位に追加します。
CSS 三角関数
三角関数 sin()、cos()、tan()、asin()、acos()、atan()、atan2() が CSS 数式に追加されました。
CSS カスタム プロパティのコンテナクエリをスタイル設定する
style() 関数を @container ルールに追加して、祖先要素のカスタム プロパティの計算値に基づいてスタイルを適用できるようにします。
baseline-source プロパティ
baseline-source プロパティを使用すると、ウェブ デベロッパーは、インライン レベルのボックスでラインボックス内の配置に first ベースラインと last ベースラインのどちらを使用するかを指定できます。
ウェブ API
window-management 権限と権限ポリシーの文字列
Chrome 111 では、window-placement 権限と権限ポリシー文字列のエイリアスとして window-management が追加されます。これは、最終的に window-placement のサポート終了と削除を行い、文字列の名前を変更する大規模な取り組みの一環です。この用語の変更により、Window Management API の経時的な進化に合わせて、記述子がより長く使用されるようになります。
Media Session API: スライド アクションの表示
既存の Media Session API に previousslide アクションと nextslide アクションを追加しました。
サイズ変更可能なArrayBufferと拡張可能なSharedArrayBuffer
ArrayBuffer コンストラクタを拡張して、バッファのインプレース拡張と縮小を可能にする最大長を追加します。同様に、SharedArrayBuffer を拡張して、インプレース 拡張を可能にする最大時間を追加します。
推測ルール: 参照 URL ポリシーキー
これにより投機ルールの構文が拡張され、デベロッパーは投機ルールによってトリガーされる投機的リクエストで使用するリファラー ポリシーを指定できるようになります。また、「十分に厳格なリファラー ポリシー」が導入されています。必要があります。
ストリーミング宣言型 Shadow DOM
これにより、終了テンプレート タグではなく開始テンプレート タグにシャドウルートを付けることで、ストリーミングのサポートが追加されます。
Transitions API を表示する
ビューのスナップショットを作成し、状態間の重複なしに DOM を変更できるようにすることで、シングルページ アプリケーション（SPA）で洗練された遷移を作成できます。ビュー遷移を使用してカスタム遷移を作成したり、シンプルなクロスフェードのデフォルトを使用してユーザー エクスペリエンスを改善したりできます。
移行の開始に役立つ詳細情報と例については、Chrome デベロッパー向けの記事をご覧ください。
WebRTC スケーラブル動画コーディング拡張機能
この拡張機能は、送信する WebRTC 動画トラックで可能な Scalable Video Coding（SVC）構成から選択するための標準メソッドを定義します。
WebXR の enabledFeatures 属性
XRSessionInit で指定されたこの XRSession で有効化された機能のセットと、指定されたモードと機能の仕様で必要とされる暗黙の機能を返します。付与されたセッションの場合、これにはすべての requiredFeatures が含まれますが、optionalFeatures のサブセットである場合もあります。ほとんどの機能には、付与されたかどうかを検出する別の方法が用意されています。ただし、機能によっては、機能が有効になったかどうかのシグナルが、現在利用できない機能のデータと密接に関連している可能性があります。enabledFeatures をクエリすることで、有用なヒント（トラッキングの改善や開始など）を表示するか、現在のセッションでサポートされない機能かを判断できます。
オリジン トライアルが進行中
Chrome 111 では、次の新しいオリジン トライアルを有効にできます。
Web Payment API における connect-src CSP のバイパスを削除するためのサポート終了トライアル
Web Payment API がマニフェストの取得時に connect-src CSP ポリシーをバイパスする機能を非推奨にしました。サポートの終了後に、サイトの connect-src CSP ポリシーで、PaymentRequest 呼び出しで指定されたお支払い方法の URL に加えて、メソッド チェーンでマニフェストを取得するその他の URL も許可する必要があります。
このバイパス機能は、一時的にバイパスを再度有効にする必要があるデベロッパーを対象に、Chrome 111 でリバースオリジン トライアル（111 ～ 113）により削除されます。これを有効にするには、connect-src CSP バイパスのリバース デプリケーション トライアルに登録してください。
ドキュメントのピクチャー イン ピクチャー
Document Picture-in-Picture API は、任意の HTML コンテンツを表示可能な常時表示ウィンドウを開くための新しい API です。これは、HTMLVideoElement を PIP ウィンドウに配置することのみを許可する既存の Picture-in-Picture API を拡張したものです。これにより、ウェブ デベロッパーは PIP のユーザー エクスペリエンスを向上させることができます。
ドキュメント ピクチャー イン ピクチャーのドキュメントをご覧ください。
ドキュメント ピクチャー イン ピクチャーのオリジン トライアルに登録します。
非推奨と削除
このバージョンの Chrome では、以下の非推奨化と削除が導入されています。サポート終了の予定、現在のサポート終了、以前の削除のリストについては、ChromeStatus.com をご覧ください。
Chrome の今回のリリースでは、次の 3 つの機能が削除されます。
PaymentInstruments を削除する
PaymentInstruments は、決済アプリの非 JIT インストールをサポートするウェブ API です（https://w3c.github.io/payment-handler/ を参照）。これは、ブラウザが実際の支払い方法の詳細を保存することを前提として設計されましたが、これは事実に反して、プライバシーがいくらか漏洩しています。また、他のブラウザには搭載されておらず、他のブラウザ ベンダーからの関心も寄せられていません。そのため、この API は非推奨となり、削除されました。
Web Payment API で connect-src CSP のバイパスを削除
マニフェストの取得時に Web Payment API が connect-src CSP ポリシーをバイパスする機能のサポートを終了。削除後は、サイトの connect-src CSP ポリシーで、PaymentRequest 呼び出しで指定されたお支払い方法の URL に加えて、メソッド チェーンでマニフェストを取得するその他の URL も許可する必要があります。
デプリケーション トライアルにオプトインする方法については、オリジン トライアルの情報をご覧ください。この削除により必要な変更に時間をかけることができます。
canmakepayment イベントの販売者 ID
Service Worker イベント canmakepayment は、インストールされた支払いアプリにユーザーのカードが登録されているかどうかを販売者に知らせます。以前は、販売者のオリジンと任意のデータを決済アプリのオリジンから Service Worker に暗黙的に受け渡していました。このクロスオリジン通信は JavaScript の PaymentRequest の作成時に行われ、ユーザー操作は必要なく、ユーザー インターフェースも表示されていません。このサイレント データパッセージは、canmakepayment イベントと Android IS_READY_TO_PAY インテントから削除されました。