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 のその他の変更については、以下のリンクをご覧ください。

• Chrome DevTools の新機能（120）
• Chrome 120 の非推奨と削除
• Chrome 120 の ChromeStatus.com の更新
• Chromium ソース リポジトリの変更リスト
• Chrome のリリース カレンダー

登録

最新情報を入手するには、Chrome Developers の YouTube チャンネルにチャンネル登録してください。新しい動画が公開されると、メール通知が届きます。

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