Novas unidades de janela de visualização do CSS, API Federated Credential Management, fontes COLRv1 variáveis e muito mais.
Salvo indicação em contrário, as mudanças descritas abaixo 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 em ChromeStatus.com. O Chrome 108 está na versão Beta desde 27 de outubro de 2022. Faça o download da versão mais recente em Google.com para computador ou na Google Play Store no Android.
CSS
O Chrome 108 inclui vários novos recursos de CSS.
Estouro de CSS para elementos substituídos
O Chrome vai começar a lançar uma mudança que permite aos desenvolvedores usar a propriedade overflow já existente com elementos substituídos que pintam fora da caixa de conteúdo. Pareado com object-view-box, é possível usar para criar uma imagem com um brilho ou sombra personalizado aplicado, com comportamento adequado de estouro de tinta, como uma sombra CSS.
Essa é uma possível alteração interruptiva. Saiba mais em Uma mudança para transbordar em elementos substituídos.
Unidades de janela de visualização pequenas, grandes, dinâmicas e lógicas
Agora é possível usar unidades pequenas (svw, svh, svi, svb, svmin, svmax), grandes (lvw, lvh, lvi, lvb, lvmin, lvmax), dinâmicas (dvw, dvh, dvi, dvb, dvmin, dvmax) e lógicas (vi, vb).
Suporte a CSS break-after, break-before e break-inside
Suporte ao valor evitado das propriedades de fragmentação de CSS break-before, break-after e break-inside ao imprimir Esse valor instrui o navegador a evitar falhas antes, depois ou dentro do elemento ao qual é aplicado. Por exemplo, o CSS a seguir evita que uma figura seja quebrada em uma quebra de página.
figure {
break-inside: avoid;
}
Esse recurso foi adicionado porque o Chrome 108 adicionou suporte à impressão do LayoutNG.
Último alinhamento de item de referência
Esse recurso permite que os desenvolvedores alinhem itens no layout flexível ou de grade pelo último valor de referência, em vez do primeiro. Isso é feito usando estas propriedades:
align-items: last baseline;justify-items: last baseline;align-self: last baseline;justify-self: last baseline;
ContentVisibilityAutoStateChanged evento
Um evento acionado em um elemento com content-visibility: auto quando o estado de renderização dele muda devido a um dos atributos que o tornam relevante para o usuário.
O caso de uso é permitir que os desenvolvedores tenham mais controle sobre quando interromper ou iniciar a renderização em resposta à interrupção ou ao início da renderização do user agent da subárvore de visibilidade do conteúdo. Por exemplo, o desenvolvedor pode querer interromper as atualizações do React em uma subárvore que não é renderizada pelo user agent. Da mesma forma, o desenvolvedor pode querer interromper outras atualizações de script (por exemplo, atualizações de tela) quando o user agent não estiver renderizando o elemento.
APIs Web
Gerenciamento de credenciais federadas (era WebID)
A API Federated Credential Management permite que os usuários tragam suas identidades federadas para fazer login em sites de uma maneira compatível com melhorias na privacidade do navegador.
Extensões de origem de mídia em workers
Ativa o uso da API Media Source Extensions (MSE) em contextos do {/5}dedicado para melhorar o desempenho da mídia de armazenamento em buffer para reprodução por um HTMLMediaElement no contexto da janela principal Ao criar um objeto MediaSource em um contexto dedicadWorker, um aplicativo pode receber um MediaSourceHandle dele e transferir esse identificador para o encadeamento principal para ser anexado a um HTMLMediaElement. O contexto que criou o objeto MediaSource pode então usá-lo para armazenar mídia em buffer.
Cabeçalho de dicas do cliente para recursos de mídia de preferência de Sec-CH-Prefers-Reduced-Motion
Os Cabeçalhos de dicas do cliente de recursos de mídia de preferência de usuário definem um conjunto de cabeçalhos de dicas do cliente HTTP sobre recursos de mídia de preferência do usuário, conforme definido pelo nível 5 das consultas de mídia. Se usados como dicas críticas do cliente, esses cabeçalhos permitem que os servidores façam escolhas inteligentes sobre, por exemplo, a inserção de CSS em linha. Sec-CH-Prefers-Reduced-Motion reflete a preferência de prefers-reduced-motion do usuário.
Leitores BYOB do WebTransport
Oferece suporte a leitores BYOB(traga seu próprio buffer) para WebTransport para permitir a leitura em um buffer fornecido pelo desenvolvedor. Os leitores BYOB podem minimizar cópias de buffer e reduzir alocações de memória.
Caracteres curinga em origens de políticas de permissões
A especificação da Política de permissões define um mecanismo que permite que os desenvolvedores ativem e desativem seletivamente o uso de vários recursos do navegador e APIs. Um recurso desse mecanismo permite que os recursos sejam ativados somente em origens explicitamente enumeradas (por exemplo, https://foo.com/). Esse mecanismo não é flexível o suficiente para o design de algumas CDNs, que enviam conteúdo por uma origem que pode estar hospedada em centenas de subdomínios possíveis.
Portanto, esse recurso adiciona suporte a caracteres curinga na política de permissões estruturada como SCHEME://*.HOST:PORT (por exemplo, https://*.foo.com/), em que uma origem válida pode ser construída em SCHEME://HOST:PORT (por exemplo, https://foo.com/). Isso exige que HOST seja um domínio registrável. Isso significa que https://*.bar.foo.com/ funciona, mas o https://*.com/ não. Se você quiser permitir que todos os domínios usem o recurso, delegue para *.
Métodos de sincronização para AccessHandles na API File System Access
Atualiza os métodos assíncronos flush(), getSize() e truncate() em FileSystemSyncAccessHandle na API File System Access para métodos síncronos
Atualmente, o FileSystemSyncAccessHandle tem uma combinação de métodos assíncronos e de sincronização, prejudicando a performance e a usabilidade, especialmente para aplicativos que transferem C/C++ para o Wasm. Essa atualização traz consistência no uso da API e melhora o desempenho das bibliotecas baseadas no Wasm.
Essa é uma possível alteração interruptiva. Saiba mais em Alteração interruptiva: métodos de sincronização para AccessHandles.
interface condicional do WebAuthn
A interface condicional para o WebAuthn tem suporte no Windows 22H2 ou mais recente, no macOS e no Android P ou mais recente. A interface WebAuthn em plataformas para computadores também foi atualizada.
Detecção de fontes e recursos de fontes COLRv1 variáveis
Suporte à fonte da variável COLRv1
As fontes vetoriais de cores COLRv1 têm suporte desde o Chrome 98, mas essa versão inicial oferece suporte apenas à funcionalidade estática da tabela COLRv1. A especificação COLRv1 define a integração com variações OpenType, que permite modificar as propriedades de fonte de gradientes e transformações por meio da alteração dos parâmetros do eixo das variáveis. Essa segunda etapa oferece suporte a essas variações do COLRv1.
Extensões de condição font-tech() e font-format() para CSS @supports
O uso de font-tech() e font-format() junto com o CSS @supports permite a detecção da tecnologia de fonte e do suporte a formato, além de aprimoramento progressivo do conteúdo. O exemplo a seguir testa a compatibilidade com as fontes COLRv1.
@supports font-tech(color-COLRv1) {
}
Suporte à função tech() no descritor @font-face src:.
O nível 4 de fontes CSS oferece mais meios de selecionar ou filtrar recursos de fonte. Foi introduzida a função tech(), que permite transmitir uma lista de tecnologias de fonte necessárias para esse blob de fonte funcionar. Com base nisso, o user agent seleciona o primeiro recurso adequado.
Chrome no Android
O Android OSK agora redimensiona a janela de visualização por padrão
O teclado na tela Android redimensiona a janela de visualização por padrão em vez do bloco inicial. Os autores podem desativar essa opção usando a nova chave de meta-janela de visualização interactive-widget.
Testes de origem
Esta versão do Chrome tem dois novos testes de origem.
Identidade do comerciante no evento canmakepayment
O evento canmakepayment do service worker permite que o comerciante saiba se o usuário tem um cartão registrado em um app de pagamento instalado. Ele transmite silenciosamente a origem do comerciante e os dados arbitrários para um service worker da origem do app de pagamento. Essa comunicação de origem cruzada ocorre na construção PaymentRequest em JavaScript, não requer um gesto do usuário e não mostra nenhuma interface do usuário. O teste do desenvolvedor para remover os campos de identidade do evento "canmakepayment" pode ser ativado usando: chrome://flags/#clear-identity-in-can-make-payment. A ativação dessa flag vai esvaziar os campos de identidade no evento "canmakepayment" e a intent IS_READY_TO_PAY do Android.
Saiba mais em Atualização do comportamento do evento CanMakePayment da API Payment Handler.
API NotRestoredReason de cache de avanço e retorno
A API NotRestoredReason vai informar a lista de motivos para uma página não ser veiculada do BFcache em uma estrutura de árvore de frames, usando a API PerformanceNavigationTiming.
As páginas podem ser bloqueadas do SFcache por diferentes motivos, como os exigidos pela especificação e outros específicos da implementação do navegador. Os desenvolvedores podem coletar a taxa de hits do TFCache no site usando o parâmetro persistido do gerenciador do pageshow e o PerformanceNavigationTiming.type(back-forward). Essa API possibilita que sites coletem informações sobre por que o BFCache não é usado em uma navegação de histórico. Assim, eles podem realizar ações em cada motivo e tornar a página compatível com o BFCache.
Descontinuações e remoções
Esta versão do Chrome apresenta as suspensões de uso e remoções listadas abaixo. Acesse ChromeStatus.com para consultar as listas de descontinuações planejadas, suspensões atuais e remoções anteriores.
Descontinuações
Nesta versão do Chrome, descontinuamos um recurso.
O uso de window.defaultStatus e window.defaultstatus foi descontinuado e removido.
Essas são APIs não padrão que não são implementadas por todos os navegadores e não afetam o comportamento do navegador. Isso a limpa e remove um possível sinal de impressão digital.
Eles eram usados originalmente para modificar/controlar o texto da "barra de status" na parte inferior das janelas do navegador. No entanto, eles nunca tiveram efeito real na barra de status do Chrome e não são atributos padronizados. O Gecko não oferece suporte a esses atributos desde a versão 23. O WebKit ainda oferece suporte a esses atributos. O atributo window.status relacionado é padronizado, mas também nunca deve ter impacto na barra de status da janela.
Remoções
Esta versão do Chrome remove quatro recursos.
Remover ImageDecoderInit.premultiplyAlpha
O recurso não tem efeitos observáveis nos casos de uso principais, mas pode restringir as implementações de maneiras abaixo do ideal. Consulte este problema para ver uma descrição mais detalhada. De acordo com o consenso dos editores de especificações do WebCodecs e a falta de uso (0,000000339% a 0,00000687% dos carregamentos de página por contador de uso na versão M106).
Remover navigateEvent.restoreScroll()
restoreScroll() está sendo substituído por navigateEvent.scroll(). O scroll() funciona de maneira idêntica, exceto por permitir que o desenvolvedor controle o tempo de rolagem para navegações não transversais. Como scroll() funciona quando a rolagem não é uma restauração, o nome e a mudança de comportamento mudam.
Remover navigateEvent.transitionWhile()
O transitionWhile() está sendo substituído por navigateEvent.intercept() devido a falhas de design informadas pelos desenvolvedores. O método intercept() se comporta de maneira quase idêntica ao transitionwhile(). No entanto, em vez de usar um parâmetro Promise obrigatório, ele usa uma função de gerenciador opcional que retorna uma Promise. Isso permite que o navegador controle quando o gerenciador é executado, o que é mais tarde e mais intuitivo do que para transitionWhile().
O googIPv6 do WebRTC mediaConstraint foi removido.
"googIPv6: false" pode ser usado para desativar o suporte a IPv6 no WebRTC, como no exemplo a seguir.
new RTCPeerConnection({}, {mandatory:{googIPv6:false}});
O IPv6 está ativado por padrão há muitos anos e, por isso, não era possível desativá-lo. Essa é uma API legada que não existe na especificação.