このページは Cloud Translation API によって翻訳されました。

Chrome 120 の新機能

Adriana Jara

必知事項は次のとおりです。

CloseWatcher API を使用すると、クローズリクエストを処理する際に一貫したエクスペリエンスを実現できます。
<details> 要素を使用して、アコーディオンパターンを簡単に実装できます。
権限ポリシー違反レポートが利用可能になりました。
他にも多数の機能があります。

Adriana Jara と申します。Chrome 120 のデベロッパー向けの新機能について詳しく見てみましょう。

CloseWatcher API。

モーダルコンポーネントやポップアップコンポーネントの重要な機能は、閉じやすく、閉じる方法が統一されていることです。これらのメカニズムは閉じるリクエストと呼ばれ、通常は、デスクトッププラットフォームでは ESC キー、Android では「戻る」ジェスチャーまたはボタンです。

ウェブデベロッパーは、独自のコンポーネントの閉じるリクエストを適切に処理する方法がありませんでした。これは特に Android デバイスで問題になります。Android デバイスでは、戻るジェスチャーによるシンプルな閉じる動作を実現するのが非常に複雑です。

Chrome 120 では、クローズリクエストを直接リッスンして応答するための新しい API である CloseWatcher でこの問題を解決します。また、新しいクローズリクエストフレームワークを使用するように <dialog> と popover="" をアップグレードして、Android の [戻る] ボタンに応答できるようにします。

CloseWatcher API のデモをお試しください。

`<details>` 名前属性

<details> 要素の name 属性を使用すると、一連の <details> HTML 要素を使用して、アコーディオンパターンを簡単に実装できます。

同じ name を持つ複数の <details> 要素はグループを形成します。この設定では、一度に開くことができるグループ内の要素は 1 つまでです。

名前 cookies を共有するグループの例を次に示します。

<details name="cookies">
  <summary>Chocolate chip</summary>
  Yum yum chocolate chip.
</details>
<details name="cookies">
  <summary>Snickerdoodle</summary>
   Yum yum snickerdoodle.
</details>
<details name="cookies">
  <summary>Maicenitas</summary>
   Yum yum maicenitas.
</details>
<details name="cookies">
  <summary>Sugar cookies</summary>
   Yum yum sugar cookies.
</details>

権限ポリシー違反レポート

権限ポリシー違反レポートが利用可能になりました。これらのレポートには Permissions policy API が統合されています。これにより、デベロッパーは Reporting API でブラウザが適用するポリシーのセットを宣言することで、ページ、その iframe、サブリソースで使用可能なブラウザ機能を制御できます。Reporting API は、ウェブアプリケーションが複数のプラットフォーム機能に基づいてレポートを作成するために使用できる汎用レポートメカニズムを提供します。

Permissions Policy API と Reporting API を統合することで、ウェブデベロッパーはエンドポイントを設定できます。このエンドポイントに、権限ポリシー違反レポートが送信されます。これにより、サイト所有者は、フィールド内のページで許可されていない機能がリクエストされたタイミングを確認できます。

実装の詳細については、権限ポリシーによるブラウザ機能の制御をご覧ください。

その他

もちろん、他にもたくさんあります。

緩和された CSS ネストの実装により、ネストされたスタイルルールは is() でラップされたり、先頭にアンパサンドを付ける必要がなくなり、要素で始めることができます。
Media Session API の enterpictureinpicture アクションを使用すると、ウェブサイトはアクションハンドラを登録できます。このハンドラは、ピクチャーインピクチャーウィンドウまたはドキュメントのピクチャーインピクチャーウィンドウを開くために使用できます。
Chrome ではサードパーティ Cookie のサポートを終了する取り組みが進んでいます。1 月には、ウェブサイトに影響する可能性があるテストが開始されます。そのため、サードパーティ Cookie のサポート終了に備えるで、監査と緩和の手順を確認することが重要です。

Chrome 120 の新機能

CloseWatcher API。

<details> 名前属性

権限ポリシー違反レポート

その他

関連情報

登録

`<details>` 名前属性