新しい CSS の色の種類と色空間、CSS 三角関数、View Transitions API。
特に明記しない限り、以下の変更は Android、ChromeOS、Linux、macOS、Windows 向けの最新の Chrome ベータ版チャンネル リリースに適用されます。ここに記載されている機能について詳しくは、記載されているリンク先または ChromeStatus.com のリストをご覧ください。Chrome 111 は 2023 年 2 月 9 日時点でベータ版です。最新バージョンは、パソコンの Google.com または Android の Google Play ストアからダウンロードできます。
CSS
新しい CSS の色の種類と空間
CSS Color Level 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 ルートフォント単位
既存のルートフォント単位 rem に、ルートフォント単位 rex、rch、ric、rlh を追加します。
CSS 三角関数
CSS 数式に三角関数 sin()、cos()、tan()、asin()、acos()、atan()、atan2() が追加されました。
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 は拡張され、インプレース成長を可能にする追加の最大長が指定できるようになりました。
推測ルール: 参照元ポリシー キー
これにより、推測ルールの構文が拡張され、デベロッパーは推測ルールによってトリガーされる推測リクエストで使用する参照元ポリシーを指定できるようになります。また、「十分に厳格な参照元ポリシー」の要件も再導入されます。
宣言型 Shadow DOM のストリーミング
これにより、シャドウルートを閉じではなく開くテンプレートタグに接続することで、ストリーミングのサポートが追加されます。
View Transitions API
ビューをスナップショットし、状態間の重複なしで DOM を変更できるようにすることで、シングルページ アプリケーション（SPA）で洗練された遷移を作成できます。View Transitions を使用してカスタム遷移を作成するか、シンプルなクロスフェード デフォルトを使用してユーザー エクスペリエンスを改善します。
詳しくは、Chrome デベロッパー向けの記事で、開始に役立つ遷移の例をご覧ください。
WebRTC スケーラブル動画コーディング拡張機能
この拡張機能は、送信される WebRTC 動画トラックで可能なスケーラブル ビデオ コーディング（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
canmakepayment サービス ワーカー イベントを使用すると、ユーザーがインストール済みの支払いアプリにカードを登録しているかどうかを販売者に知らせることができます。このイベントは、支払いアプリの送信元から販売者の送信元と任意のデータをサービス ワーカーにサイレントで渡すために使用されていました。このクロスオリジン通信は、JavaScript での PaymentRequest の作成時に行われ、ユーザー操作は必要ありませんでした。また、ユーザー インターフェースも表示されませんでした。このサイレント データの送信は、canmakepayment イベントと Android IS_READY_TO_PAY インテントから削除されました。