Nova plataforma da Web em fevereiro

Descubra alguns dos recursos interessantes que foram lançados em navegadores da Web estáveis e Beta em fevereiro de 2025.

Publicado em 28 de fevereiro de 2025

Versões estáveis do navegador

Em fevereiro de 2025, o Firefox 135 e o Chrome 133 passaram a ser estáveis. Esta postagem aborda os novos recursos adicionados à plataforma da Web.

Verificar os recursos do WebAuthn

O Firefox 135 e o Chrome 133 adicionam suporte ao método estático PublicKeyCredential.getClientCapabilities(). Isso permite verificar se um navegador oferece suporte a recursos da API Authentication da Web, sem precisar recorrer ao sniffing do navegador.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: 135.
  • Safari: 17.4.

Source

O Firefox 135 também inclui recursos da análise JSON com proposta de origem: o parâmetro reviver context do argumento JSON.parse, JSON.isRawJSON() e JSON.rawJSON().

Browser Support

  • Chrome: 114.
  • Edge: 114.
  • Firefox: 135.
  • Safari: not supported.

Source

O valor da dica do atributo do pop-up

O Chrome 133 adiciona um terceiro valor para o atributo popover, popover="hint". As dicas, que geralmente são associadas a comportamentos do tipo "tooltip", têm comportamentos um pouco diferentes. Agora é possível abrir um popover de dica não relacionado enquanto uma pilha de popovers automáticos permanece aberta.

O exemplo canônico é quando um seletor <select> está aberto (popover="auto") e uma dica acionada por passar o cursor (popover="hint") é mostrada. Essa ação não fecha o seletor <select>.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Leia mais em Popover = dica.

Função attr() avançada do CSS

Há uma boa coleção de adições de CSS no Chrome 133. Esta versão do Chrome inclui o aumento de attr() especificado no CSS Level 5, que permite tipos além de <string> e uso em todas as propriedades CSS (além do suporte existente para o conteúdo de pseudoelementos).

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Saiba mais em O CSS attr() recebe um upgrade.

Consultas de contêiner de estado de rolagem do CSS

Também no Chrome 133, use consultas de contêiner para definir o estilo de descendentes de contêineres com base no estado de rolagem.

O contêiner de consulta é um contêiner de rolagem ou um elemento afetado pela posição de rolagem de um contêiner de rolagem. Os seguintes estados podem ser consultados:

  • stuck: um contêiner com posição fixa fica preso a uma das bordas da caixa de rolagem.
  • snapped: um contêiner alinhado com o ajuste de rolagem está fixado horizontal ou verticalmente.
  • scrollable: indica se um contêiner de rolagem pode ser rolado na direção consultada.

Também há um novo valor para container-type: scroll-state, que permite que os contêineres sejam consultados.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Leia CSS scroll-state() para saber mais.

CSS text-box, text-box-trim e text-box-edge

Também no CSS para o Chrome 133 estão as propriedades text-box-trim e text-box-edge, junto com a propriedade abreviada text-box. Elas permitem um controle mais preciso do alinhamento vertical do texto.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: 18.2.

Saiba como essa propriedade funciona no CSS text-box-trim.

Mover preservando o estado do DOM

O Chrome 133 adiciona uma primitiva DOM (Node.prototype.moveBefore) que permite mover elementos em uma árvore DOM sem redefinir o estado do elemento.

Ao mover em vez de remover e inserir, o estado a seguir é preservado:

  • Os elementos <iframe> continuam carregados.
  • O elemento ativo continua em foco.
  • Pop-ups, caixas de diálogo modais e em tela cheia permanecem abertos.
  • As transições e animações do CSS continuam.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Interface FileSystemObserver

A interface FileSystemObserver adicionada no Chrome 133 notifica os sites sobre mudanças no sistema de arquivos. Os sites observam as mudanças em arquivos e diretórios, para os quais o usuário concedeu permissão anteriormente, no dispositivo local do usuário ou no sistema de arquivos do bucket (também conhecido como sistema de arquivos particular de origem) e são notificados sobre informações básicas de mudança, como o tipo de mudança.

Browser Support

  • Chrome: 133.
  • Edge: 133.
  • Firefox: not supported.
  • Safari: not supported.

Versões Beta do navegador

As versões Beta do navegador oferecem uma prévia do que vai estar na próxima versão estável do navegador. É um ótimo momento para testar novos recursos ou remoções que podem afetar seu site antes que o mundo receba a versão. As novas versões Beta são Firefox 136, Safari 18.4 e Chrome 134. Essas versões trazem muitos recursos excelentes para a plataforma. Confira as notas da versão para saber todos os detalhes. Confira alguns destaques.

A versão Beta mais recente do Safari traz uma lista enorme de adições e melhorias, incluindo alguns recursos que esperamos que fiquem disponíveis na versão de referência quando o navegador estiver estável. Por exemplo, writing-mode: sideways-rl e writing-mode: sideways-lr, o método estático supports() para ClipboardItem e uma lista inteira de coisas da proposta de auxiliares de iterador.

O Safari 18.4 Beta e o Firefox 136 incluem a API Cookie Store, que será disponibilizada como Baseline Newly quando os dois navegadores forem lançados.

O Firefox 136 inclui as pseudoclasses :open e :has-slotted, e a última também está no Chrome 134. Também inclui Intl.DurationFormat, que deve ser "Baseline recém-disponível".

O Chrome 134 inclui elementos <select> personalizáveis, a propriedade CSS dynamic-range-limit e a funcionalidade de dispensa leve para elementos <dialog>.