New in Chrome 126

Here's what you need to know:

I'm Adriana Jara. Let's dive in and see what's new for developers in Chrome 126.

Cross-document view transitions for same-origin navigations

The View Transitions API gives you the power to create seamless visual transitions between different views and now it is available by default for same-origin navigations. Previously it was only available for single page application architectures.

To implement a cross-document view transition, both ends need to opt-in. To do this, use the view-transition at-rule and set the navigation descriptor to auto.

Cross-document view transitions use the same building blocks and principles as same-document view transitions.

@view-transition {
  navigation: auto;

Visit Smooth transitions with the View Transition API for details, samples are more.

CloseWatcher API re-enabled

For <dialog> and popover="" elements, the CloseWatcher API makes it easier to handle close requests, like the ESC key on desktop platforms or the back gesture on Android.

This feature was originally shipped in Chrome 120, but was disabled because of an unexpected interaction with the dialog element. It has been re enabled in Chrome 126 after improvements to minimize the previous problems.

To learn how to use CloseWatcher visit its demo.

Gamepad API trigger-rumble extension

The trigger-rumble capability is now part of the Gamepad API. It enhances gaming experiences on the web for compatible controllers.

trigger-rumble extends the GamepadHapticActuator, which is an interface that represents hardware in the controller designed to provide haptic feedback to the user (if available). trigger-rumble allows web applications that use the Gamepad API to also vibrate the triggers of those gamepad devices.

With the following code you can check if the functionality is supported in the browser and how to trigger— pun intended —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)) {
  // Feature detection.
  if (!('effects' in gamepad.vibrationActuator) || !gamepad.vibrationActuator.effects.includes('trigger-rumble')) {
  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,

Check out Play the Chrome dino game with your gamepad for more information to make the most of the Gamepad API.

And more!

Of course there's plenty more.

Read the full release notes.

Further reading

This covers only some key highlights. Check the following links for additional changes in Chrome 126.


To stay up to date, subscribe to the Chrome Developers YouTube channel, and you'll get an email notification whenever we launch a new video.

Yo soy Adriana Jara, and as soon as Chrome 127 is released, I'll be right here to tell you what's new in Chrome!