Chrome 120 の新機能

Adriana Jara 氏
Adriana Jara

フォーマットの詳細については次をご覧ください。

アドリアナ ジャラです。それでは、Chrome 120 のデベロッパー向けの新機能を詳しく見ていきましょう。

CloseWatcher API。

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

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

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

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 Developers YouTube チャンネルご登録ください。新しい動画が公開されるたびにメール通知が届きます。

Adriana Jara 様、この度は皆様におかれましては、Chrome 121 がリリースされ次第、Chrome の新機能をお知らせいたします。