Chrome 120 の新機能

Adriana Jara

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

アドリアナ・ジャラですChrome 120 のデベロッパー向け新機能を見てみましょう。

CloseWatcher API。

モーダル コンポーネントやポップアップ コンポーネントの重要な特長は、閉じるための一貫したメカニズムを使用して簡単に閉じることができる点です。このようなメカニズムはクローズ リクエストと呼ばれ、デスクトップ プラットフォームでは ESC キー、Android では「戻る」ジェスチャーまたはボタンです。

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

Chrome 120 では、クローズ リクエストを直接リッスンして応答するための新しい API、CloseWatcher でこのソリューションを提供します。また、<dialog> と popover="" のアップグレードも含まれており、新しいクローズ リクエスト フレームワークを使用して、Android の [戻る] ボタンに応答できるようにします。

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

<details> name 属性

<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 Developers YouTube チャンネル 新しい動画が公開されるたびに メールでも通知されます

Adriana Jara です。Chrome 121 がリリースされ次第、Chrome の最新情報をお届けします。