Plataforma da Web novidade em junho

Descubra alguns dos recursos interessantes que chegaram em navegadores da Web estáveis e Beta em junho de 2024.

Lançamentos de navegadores estáveis

Em junho de 2024, o Firefox 127 e o Chrome 126 se tornaram estáveis. Esta postagem analisa os novos recursos adicionados à plataforma Web.

Métodos "set" do JavaScript

Os conjuntos são uma estrutura de dados essencial em qualquer linguagem de programação. Agora você pode usar os métodos integrados do JavaScript para executar operações de conjunto. Os métodos de conjunto abaixo já estão disponíveis no Firefox 127 e se tornaram parte do valor de referência recentemente disponível:

Compatibilidade com navegadores

  • 122
  • 122
  • 127
  • 17

Origem

Para saber mais, leia Os métodos JavaScript Set agora fazem parte do valor de referência.

API Async Clipboard

A API Clipboard agora é totalmente compatível com o Firefox 127. O Firefox agora é compatível com a interface ClipboardItem, junto com os métodos read() e write() da interface da área de transferência. Saiba mais sobre a API Clipboard em Como desbloquear o acesso à área de transferência.

Compatibilidade com navegadores

  • 76
  • 79
  • 127
  • 13.1

Origem

Interpolação de cores em gradientes de CSS

Os gradientes de CSS são especificados para aceitar um <color-interpolation-method>, e isso agora é compatível com o Firefox, o que o torna interoperável em todos os principais mecanismos. Agora você pode, por exemplo, especificar um linear-gradient() usando o sistema de cores hsl e uma interpolação mais longa.

.longer {
  background: linear-gradient(90deg in hsl longer hue, red, blue);
}

Compatibilidade com navegadores

  • 111
  • 111
  • 127
  • 16,2

Transições de visualização entre documentos

Anteriormente, você tinha que reestruturar seu site para um SPA para usar a API View Transitions. Entretanto, esse não é mais o caso. No Chrome 126, as transições de visualização agora são ativadas por padrão para navegações de mesma origem. Você pode criar uma transição de visualização entre dois documentos diferentes da mesma origem.

Para permitir uma transição de visualização de vários documentos, as duas extremidades precisam ativar o recurso. Para fazer isso, use a política @view-transition e defina o descritor de navegação como auto.

@view-transition {
  navigation: auto;
}

Compatibilidade com navegadores

  • 126
  • 126
  • x
  • x

Origem

Saiba mais na documentação sobre transições de visualização entre documentos.

A extensão trigger-rumble da API Gamepad

O Chrome 126 estende a interface GamepadHapticActuator para expor o recurso trigger-rumble na Web para gamepads compatíveis. Essa extensão permitirá que aplicativos da Web que usam a API Gamepad também vibrem os acionadores dos dispositivos gamepad que vêm equipados com essa funcionalidade.

Versões do navegador Beta

As versões Beta oferecem uma prévia do que vai estar na próxima versão estável do navegador. Esse é um ótimo momento para testar novos recursos, ou remoções, que podem afetar seu site antes do lançamento oficial. As novas versões Beta são o Firefox 128, o Chrome 127, o Safari 18 e o Safari 17.6. Esses lançamentos trazem muitos recursos excelentes para a plataforma. Confira as notas da versão para ver todos os detalhes. Estes são alguns destaques.

O Safari 17.6 é uma versão de correções para os recursos existentes. O Safari 18 tem vários recursos novos e interessantes, incluindo consultas de contêiner de estilo, a API de transição de visualização para apps de página única e suporte à palavra-chave safe em propriedades flexbox.

O Chrome 127 inclui a propriedade CSS font-size-adjust, a capacidade de especificar texto alternativo no conteúdo gerado como um número arbitrário de elementos e a capacidade de adicionar informações de capítulos individuais em MediaMetaData.

O Firefox 128 inclui propriedades e valores de CSS, o que torna esse recurso de referência recentemente disponível. Use @property para definir um type e um valor substituto para as propriedades personalizadas do CSS.