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

Chrome 126 の新機能

Adriana Jara

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

View Transitions API でドキュメント間の遷移が新たにサポートされました。
CloseWatcher API が再び利用可能になりました。
Gamepad API に trigger-rumble が追加されました。
他にも多くの機能を利用できます。

アドリアナ・ジャラですChrome 126 のデベロッパー向けの新機能について詳しく見てみましょう。

同一オリジンのナビゲーションのクロスドキュメントビュー遷移

View Transitions API を使用すると、さまざまなビュー間でシームレスな視覚的な遷移を作成できます。この API は、同じオリジンのナビゲーションに対してデフォルトで使用できるようになりました。これまでは、シングルページアプリケーションアーキテクチャでのみ使用可能でした。

ドキュメント間のビュー遷移を実装するには、両方の端末でオプトインする必要があります。そのためには、view-transition アットルールを使用して、ナビゲーション記述子を auto に設定します。

ドキュメント間のビュー遷移では、同じドキュメント内のビュー遷移と同じ構成要素と原則が使用されます。

@view-transition {
  navigation: auto;
}

詳細とサンプルについては、View Transition API によるスムーズな遷移をご覧ください。

CloseWatcher API が再度有効になりました

<dialog> 要素と popover="" 要素の場合、CloseWatcher API を使用すると、パソコンプラットフォームの ESC キーや Android の「戻る」ジェスチャーなどのクローズリクエストを簡単に処理できます。

この機能はもともと Chrome 120 でリリースされましたが、ダイアログ要素との予期しないやり取りが原因で無効になりました。以前の問題を最小限に抑える改善を行った後、Chrome 126 で再度有効になりました。

CloseWatcher の使い方については、デモをご覧ください。

Gamepad API トリガーランブル拡張機能

トリガーランブル機能が Gamepad API の一部になりました。対応するコントローラでウェブでのゲーム体験が向上します。

trigger-rumble は GamepadHapticActuator を拡張します。これは、ユーザーに触覚フィードバックを提供する（利用可能な場合）ように設計されたコントローラ内のハードウェアを表すインターフェースです。trigger-rumble を使用すると、Gamepad API を使用するウェブアプリケーションで、それらのゲームパッドデバイスのトリガーも振動させることができます。

次のコードを使用すると、この機能がブラウザでサポートされているかどうかと、トリガーする方法を確認できます。trigger-rumble

// This assumes a `Gamepad` as the value of the `gamepad` variable.
const triggerRumble = (gamepad, delay = 0, duration = 100, weak = 1.0, strong = 1.0) => {
  if (!('vibrationActuator' in gamepad)) {
    return;
  }
  // Feature detection.
  if (!('effects' in gamepad.vibrationActuator) || !gamepad.vibrationActuator.effects.includes('trigger-rumble')) {
    return;
  }
  gamepad.vibrationActuator.playEffect('trigger-rumble', {
    // Duration in ms.
    duration: duration,
    // The left trigger (between 0 and 1).
    leftTrigger: leftTrigger,
    // The right trigger (between 0 and 1).
    rightTrigger: rightTrigger,
  });
};

Gamepad API を最大限に活用する方法については、ゲームパッドで Chrome 恐竜ゲームをプレイするをご覧ください。

その他

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

GeolocationCoordinates と GeolocationPosition に .toJSON() メソッドが追加されました。
DevTools の更新では、[Application] > [Storage] セクションの専用ツリーでストレージバケットを検査できます。
ChromeOS でウェブアプリのタブモードがサポートされるようになりました。

リリースノート全体

Chrome 126 の新機能

同一オリジンのナビゲーションのクロスドキュメント ビュー遷移

CloseWatcher API が再度有効になりました

Gamepad API トリガー ランブル拡張機能

その他

関連情報

登録

同一オリジンのナビゲーションのクロスドキュメントビュー遷移

Gamepad API トリガーランブル拡張機能