Chrome 137 Beta

Rachel Andrew

Publicado em 1º de maio de 2025

A menos que indicado de outra forma, as mudanças a seguir se aplicam à versão mais recente do canal Beta do Chrome para Android, ChromeOS, Linux, macOS e Windows. Saiba mais sobre os recursos listados aqui nos links fornecidos ou na lista do ChromeStatus.com. O Chrome 130 é Beta desde 30 de abril de 2025. Faça o download da versão mais recente em Google.com para computadores ou na Google Play Store no Android.

CSS e interface

Esta versão adiciona sete novos recursos de CSS e interface.

A função if()

A função if() do CSS oferece uma maneira concisa de expressar valores condicionais. Ele aceita uma série de pares de condição-valor, delimitados por ponto e vírgula. A função avalia cada condição sequencialmente e retorna o valor associado à primeira condição verdadeira. Se nenhuma das condições for avaliada como verdadeira, a função vai retornar um stream de token vazio. Isso permite expressar uma lógica condicional complexa de maneira simples e concisa. Exemplo:

div {
      color: var(--color);
      background-color: if(style(--color: white): black; else: white);
  }
  .dark {
      --color: black;
  }
  .light {
      --color: white;
  }

<div class="dark">dark</div>
<div class="light">light</div>

As propriedades reading-flow e reading-order

A propriedade CSS reading-flow controla a ordem em que os elementos em um layout flexível, de grade ou de bloco são expostos a ferramentas de acessibilidade e focados usando a navegação de foco do teclado de guia. Ele usa um dos seguintes valores de palavra-chave:

  • normal
  • flex-visual
  • flex-flow
  • grid-rows
  • grid-columns
  • grid-order
  • source-order

A propriedade CSS reading-order permite que você substitua manualmente a ordem em um contêiner de fluxo de leitura. É um número inteiro com valor padrão 0.

Para saber mais, leia Usar o fluxo de leitura do CSS para navegação de foco sequencial lógico e teste alguns exemplos de fluxo de leitura.

offset-path: shape()

A função shape() já tem suporte em clip-path e permite corte responsivo. Ativar essa propriedade também para offset-path fecha uma pequena lacuna em que o mesmo tipo de forma pode ser usado para essa propriedade.

Compatibilidade com o atributo de transformação em SVGSVGElement

Esse recurso permite a aplicação de propriedades de transformação, como dimensionamento, rotação, translação e inclinação, diretamente ao elemento raiz <svg> usando o atributo de transformação. Essa melhoria permite manipular todo o sistema de coordenadas SVG ou o conteúdo como um todo, oferecendo maior flexibilidade na criação de gráficos vetoriais dinâmicos, responsivos e interativos. Com o suporte a esse atributo, o elemento SVG pode ser transformado sem exigir elementos de wrapper adicionais ou soluções alternativas de CSS complexas, simplificando o processo de criação de gráficos da Web escalonáveis e animados.

Permitir que <use> faça referência ao elemento raiz de um documento externo omitindo o fragmento.

Neste recurso, estamos simplificando o elemento <use> do SVG, simplificando os requisitos de referência. No momento, é necessário fazer referência explícita a fragmentos no documento SVG. Se nenhum ID de fragmento for fornecido, <use> não vai conseguir resolver o destino, e nada será renderizado ou referenciado.

Com esse recurso, omitir fragmentos ou apenas fornecer o nome do arquivo SVG externo faz referência automaticamente ao elemento raiz, eliminando a necessidade de alterar o documento referenciado apenas para atribuir um ID à raiz. Essa melhoria simplifica o processo de edição manual e melhora a eficiência.

A cor de destaque do sistema para a propriedade accent-color foi expandida para o Windows e o ChromeOS

Isso permite que você use a cor de destaque do sistema operacional para elementos de formulário. Ao usar a propriedade CSS accent-color, você pode garantir que elementos de formulário, como caixas de seleção, botões de opção e barras de progresso, adotem automaticamente a cor de destaque definida pelo sistema operacional do usuário. Esse recurso é compatível com o macOS desde 2021 e agora também é compatível com o Windows e o ChromeOS.

view-transition-name: match-element

O valor match-element da propriedade view-transition gera um ID exclusivo com base na identidade do elemento e permanece o mesmo para esse elemento. Isso é usado em casos de apps de página única em que o elemento está sendo movido e você quer animá-lo com uma transição de visualização.

APIs Web

O tipo de erro alinhado foi gerado para a criação de credenciais da WebAuthn "payment".

Corrige o tipo de erro gerado durante a criação de credenciais do WebAuthn para credenciais payment. Devido a uma incompatibilidade histórica de especificação, a criação de uma credencial payment em um iframe de origem cruzada sem uma ativação do usuário gerava uma SecurityError em vez de uma NotAllowedError, que é o que é gerado para credenciais não de pagamento. Essa é uma alteração interruptiva. O código que detectava anteriormente o tipo de erro gerado (por exemplo, e instanceof SecurityError) seria afetado. O código que geralmente processa erros durante a criação de credenciais (por exemplo, catch (e)) continuará funcionando corretamente.

Particionamento de URL de blobs: busca/navegação

Como continuação do particionamento de armazenamento, isso implementa o particionamento do acesso ao URL do blob por chave de armazenamento (site de nível superior, origem do frame e o booleano has-cross-site-ancestor), com exceção das navegações de nível superior que vão permanecer particionadas apenas pela origem do frame.

Essa mudança pode ser revertida temporariamente definindo a política PartitionedBlobURLUsage. A política será descontinuada quando as outras políticas corporativas relacionadas ao particionamento de armazenamento forem descontinuadas.

Pilhas de chamadas em relatórios de erros de páginas da Web que não respondem

Esse recurso captura a pilha de chamadas do JavaScript quando uma página da Web para de responder devido a um código JavaScript que executa um loop infinito ou outra computação muito longa. Isso ajuda os desenvolvedores a identificar a causa da falta de resposta e corrigi-la com mais facilidade. A pilha de chamadas do JavaScript é incluída na API de relatórios de falhas quando o motivo não responde.

Tipos de cores de ponto flutuante da tela

Introduz a capacidade de usar formatos de pixel de ponto flutuante (em vez de ponto fixo de 8 bits) com CanvasRenderingContext2D, OffscreenCanvasRenderingContext2D e ImageData. Isso é necessário para aplicativos de alta precisão (por exemplo, visualização médica), conteúdo de alto alcance dinâmico e espaços de cores de trabalho linear.

Proibir a pré-renderização HTTP de texto simples não confiável

Atualmente, a pré-renderização é permitida por HTTP e HTTPS, enquanto a pré-busca só funciona por HTTPS. Restrição de pré-renderização para ser consistente com o pré-carregamento.

Document-Isolation-Policy

O Document-Isolation-Policy permite que um documento ative o crossOriginIsolation para si mesmo, sem precisar implantar o COOP ou o COEP, e independentemente do status crossOriginIsolation da página. A política é apoiada pelo isolamento de processos. Além disso, os subrecursos de origem cruzada do documento que não são CORS serão carregados sem credenciais ou precisarão ter um cabeçalho CORP.

Saiba mais em Política de isolamento de documentos: ative recursos avançados da Web com facilidade.

Ed25519 na criptografia da Web

Esse recurso adiciona suporte a algoritmos Curve25519 na API Web Cryptography, ou seja, o algoritmo de assinatura Ed25519.

Geração de registros e relatórios de endereços IP

O Chrome Enterprise está aprimorando os recursos de monitoramento de segurança e resposta a incidentes coletando e informando endereços IP locais e remotos e enviando esses endereços aos registros de investigação de segurança (SIT, na sigla em inglês). Além disso, o Chrome Enterprise permite que os administradores enviem os endereços IP para provedores de SIEM internos e de terceiros usando o conector de relatórios do Chrome Enterprise. Essa opção vai estar disponível para clientes do Chrome Enterprise Core.

Integração de promessas do JavaScript

A integração de promessas do JavaScript (JSPI, na sigla em inglês) é uma API que permite a integração de aplicativos do WebAssembly com promessas do JavaScript. Ele permite que um programa do WebAssembly atue como o gerador de uma promessa e permite que o programa do WebAssembly interaja com APIs que têm promessas. Especificamente, quando um aplicativo usa a JSPI para chamar uma API (JavaScript) com promessa, o código do WebAssembly é suspenso. Além disso, o autor da chamada original do programa WebAssembly recebe uma promessa que será cumprida quando o programa for concluído.

API Language Detector

A API Language Detector é uma API JavaScript que identifica o idioma de uma string fornecida. Essa API é apoiada por um modelo que é ajustado para realizar tarefas de detecção de idioma.

Dada uma string, a API Language Detector retorna uma lista ordenada dos idiomas detectados, junto com um índice de confiança para cada resultado.

Opcionalmente, os desenvolvedores podem transmitir uma lista de idiomas de entrada esperados ao criar uma instância do Language Detector para ajudar a otimizar para casos de uso em que a detecção é esperada em determinados idiomas.

Restrição de atributos e argumentos de ponto flutuante em SVGMatrix, SVGRect e SVGPoint

Ao definir atributos ou argumentos flutuantes em SVGMatrix, SVGRect e SVGPoint, agora não é possível defini-los como Infinity ou Nan. Uma exceção do JavaScript será gerada se você tentar configurá-la, conforme definido na especificação do SVG.

API Selection getComposedRanges e direction

Esse recurso inclui dois novos métodos para a API Selection:

  • Selection.direction, que retorna a direção da seleção como "none", "forward" ou "backward".
  • Selection.getComposedRanges(), que retorna uma lista de 0 ou 1 "composto" StaticRange

Um StaticRange "composto" pode cruzar limites de sombra, o que os Ranges normais não podem.

Exemplo:

const range = getSelection().getComposedRanges({ shadowRoots: [root] });

Se a seleção cruzar um limite de raiz de sombra que não for fornecido na lista shadowRoots, os endpoints do StaticRange serão "redefinidos" para ficarem fora dessa árvore. Isso garante que não expomos árvores de sombra desconhecidas.

Extensões de escopo do app da Web

Adiciona um campo de manifesto de app da Web scope_extensions que permite que os apps da Web estendam o escopo a outras origens.

Exemplo:

{
  "name": "Example",
  "display": "standalone",
  "start_url": "/index.html",
  "scope_extensions": [
    {"type" : "type", "origin" : "https://example.com"}
  ]
}

Isso permite que sites que controlam vários subdomínios e domínios de nível superior sejam apresentados como um único app da Web.

Requer que as origens listadas confirmem a associação com o app da Web usando um arquivo de configuração .well-known/web-app-origin-association.

{
  "https://sample-app.com/": {
    "scope": "/"
  }
}

Dicas de ramificação do WebAssembly

Melhora a performance do código compilado do WebAssembly informando ao mecanismo que uma instrução de ramificação específica tem uma probabilidade muito alta de seguir um caminho específico. Isso permite que o mecanismo tome decisões melhores para o layout do código (melhorando os acertos de cache de instrução) e a alocação de registro.

WebGPU: GPUTextureView para vinculação externalTexture

Agora é possível usar uma GPUTextureView para uma vinculação externalTexture ao criar uma GPUBindGroup.

WebGPU: sobrecarga de copyBufferToBuffer

O método copyBufferToBuffer() GPUCommandEncoder agora inclui uma maneira mais simples de copiar buffers inteiros usando uma nova sobrecarga com deslocamentos e parâmetros de tamanho opcionais.

Novos testes de origem

No Chrome 137, você pode ativar os seguintes novos testes de origem.

Atributo de bloqueio de renderização de frame rate

Adiciona um novo token de bloqueio de renderização full-frame-rate aos atributos de bloqueio. Quando o renderizador é bloqueado com o token de frame rate total, ele funciona com uma taxa de frames mais baixa para reservar mais recursos para o carregamento.

Pausar a reprodução de mídia em iframes não renderizados

Adiciona uma política de permissão "media-playback-while-not-rendered" para permitir que os sites de inserção pausem a reprodução de mídia de iframes incorporados que não são renderizados, ou seja, que têm a propriedade "display" definida como "none". Isso permite que os desenvolvedores criem experiências mais fáceis de usar e também melhorem o desempenho, permitindo que o navegador gerencie a reprodução de conteúdo que não é visível para os usuários.

API Rewriter

A API Rewriter transforma e reformula o texto de entrada das maneiras solicitadas, com o suporte de um modelo de linguagem de IA no dispositivo. Os desenvolvedores podem usar essa API para remover redundâncias em um texto para se adequar a um limite de palavras, reformular mensagens para se adequar ao público-alvo ou ser mais construtivo se uma mensagem usar linguagem tóxica, reformulando uma postagem ou artigo para usar palavras e conceitos mais simples e muito mais.

API Writer

A API Writer pode ser usada para escrever novos materiais com base em uma instrução de tarefa de escrita, com o suporte de um modelo de linguagem de IA no dispositivo. Os desenvolvedores poderão usar essa API para gerar explicações textuais de dados estruturados, criando uma postagem sobre um produto com base em avaliações ou na descrição do produto, expandindo listas de prós e contras em visualizações completas e muito mais.