Notas de versão da plataforma Web do Microsoft Edge 150 (julho de 2026)

A seguir estão os novos recursos e atualizações da plataforma da Web no Microsoft Edge 150, que será lançado em 2 de julho de 2026.

Para se manter atualizado e obter os recursos mais recentes da plataforma Web, baixe um canal de visualização do Microsoft Edge (Beta, Dev ou Canary); vá para Torne-se um Microsoft Edge Insider.

Conteúdo detalhado:

Microsoft Edge DevTools

Veja as novidades no DevTools (Microsoft Edge 150).

WebView2

Consulte o SDK de lançamento 1.0.4078.44, para Runtime 150 (7 de julho de 2026) em Notas de versão para o SDK do WebView2.

Recursos CSS

Os novos recursos de CSS (folhas de estilos em cascata) a seguir estão incluídos no Microsoft Edge.

AccentColor e AccentColorText cores do sistema

As AccentColor cores do sistema e AccentColorText agora podem ser usadas como valores de cor CSS para acessar a cor de destaque do sistema especificada no dispositivo do usuário.

Veja também:

Permitir parâmetro de arredondamento opcional para polygon()

Permite um parâmetro opcional round na polygon() função de forma CSS. Você pode especificar um valor de comprimento para arredondar cantos de polígonos, sem calcular manualmente as curvas de Bézier.

Por exemplo, para criar um triângulo arredondado: polygon(round 50px, 50% 0%, 0% 100%, 100% 100%)

Veja também:

Zoom animável

A propriedade CSS zoom pode ser animada e interpola como um <number>. Você pode fazer a transição e animar o zoom para dimensionar suavemente os elementos e seu layout, complementando o dimensionamento baseado em transformação existente.

Veja também:

Modificadores de solicitação de URL CSS

As seguintes funções CSS podem ser usadas com a função CSS url() para controlar o comportamento de busca do recurso referenciado:

  • cross-origin()
  • integrity()
  • referrer-policy()

Por exemplo, background-image: url("image.png" cross-origin(anonymous)) busca a imagem usando o modo anônimo CORS.

Isso oferece controle refinado sobre o acesso entre origens, a integridade de sub-recursos e a política de referência para recursos carregados com CSS, incluindo:

  • Imagens.
  • Fontes.
  • Referências SVG.
  • Folhas de estilo importadas.

Veja também:

Propriedade CSS text-fit

A propriedade CSS text-fit dimensiona o tamanho da fonte de um nó de texto para caber perfeitamente na largura da caixa que a contém.

Essa propriedade permite que você garanta que os títulos ou o conteúdo dinâmico preencham o espaço horizontal disponível, sem cálculos manuais de tamanho de fonte ou soluções alternativas complexas de JavaScript.

Essa propriedade fornece uma solução robusta e nativa de CSS para tipografia responsiva que mantém o alinhamento visual em diferentes tamanhos de tela e comprimentos de texto variados.

Veja também:

CSS background-clip: border-area

A propriedade CSS background-clip: border-area recorta o plano de fundo de um elemento para a área pintada por seus traços de borda, levando border-width em consideração and border-style , enquanto ignora a transparência de border-color.

Isso permite bordas de gradiente sem border-image.

Veja também:

Função CSS image(<color>)

A função CSS permite gerar facilmente uma imagem em cores sólidas image() a partir de qualquer cor.

Por exemplo, para criar uma imagem de fundo vermelha sólida, use background: image(red);.

Veja também:

CSS com valores de light-dark() imagem

A função CSS agora aceita valores de light-dark() imagem (url(), image-set(), none).

Isso possibilita alternar automaticamente entre imagens com base no esquema de cores preferido do usuário.

Você pode usar a light-dark() função com valores de imagem nas seguintes propriedades:

  • background-image
  • list-style-image
  • border-image-source
  • cursor
  • content

Veja também:

Consultas de contêiner separadas por vírgula

A @container regra agora dá suporte a várias consultas de contêiner, separadas por vírgulas. A @container regra se aplicará se pelo menos uma das consultas corresponder.

Isso possibilita consultas de fallback para recursos que não têm suporte em todos os navegadores.

Exemplo:

@container --name1 not-supported(--foo: bar), --name2 (width > 600px) {}

Veja também:

Expor áreas não imprimíveis via CSS

Use a propriedade CSS page-margin-safety para evitar tentar imprimir em áreas não imprimíveis de uma folha de papel.

Uma impressora geralmente tem uma pequena área em cada uma das quatro bordas de uma folha de papel que a impressora não é capaz de marcar de forma confiável, geralmente devido ao mecanismo de manuseio de papel da impressora.

Espera-se que as margens padrão da página sejam maiores do que essas áreas de borda do papel, mas se você definir margens em seu aplicativo e quiser adicionar @page caixas de margem (como cabeçalhos e rodapés personalizados), a page-margin-safety propriedade fornecerá uma maneira de detectar onde é seguro imprimir.

Veja também:

named-feature() função para CSS @supports

A named-feature() função permite que as regras CSS consultem um pequeno conjunto de recursos nomeados específicos que não são possíveis de testar usando outros @supports mecanismos, mas que são valiosos @supports para testar.

Veja também:

overscroll-behavior: chain

A overscroll-behavior propriedade CSS agora dá suporte ao chain valor.

Essa propriedade afeta dois efeitos independentes:

  • Propagação de rolagem.
  • Efeito de borda local (como alongamento de rolagem).

Anteriormente, overscroll-behavior tinha três valores:

  • none: Sem propagação, sem efeito local.
  • auto: Propagação, efeito local.
  • contain: Sem propagação, efeito local.

Esse recurso adiciona um novo valor para completar o conjunto:

  • chain: Propagação, sem efeito local.

Veja também:

flex-wrap:balance

flex-wrap:balance permite distribuir conteúdo entre cada , flex-linepara que o layout pareça mais equilibrado.

Isso é semelhante ao text-wrap:balance.

Veja também:

Recursos HTML

Os novos recursos HTML a seguir estão incluídos no Microsoft Edge.

focusgroup de atributo

O atributo HTML focusgroup padroniza a navegação do teclado para widgets compostos, como barras de ferramentas, guias, menus e grupos de rádio.

O focusgroup atributo manipula automaticamente o seguinte, sem exigir código JavaScript personalizado:

  • O comportamento do tabindex móvel .
  • Navegação pelas teclas de direção.
  • Memória de foco; Restaura o último elemento focado ao inserir novamente o grupo de foco.

Exemplo:

<div focusgroup="toolbar wrap" aria-label="Formatting">
  <button>Bold</button>
  <button>Italic</button>
  <button>Underline</button>
</div>

Veja também:

popover="hint" Alterações no comportamento do atributo

O comportamento dos elementos com o atributo foi alterado para melhorar as interações com os popover="hint" elementos: abrir um popover="hint" elemento não fechará mais inadvertidamente elementos não relacionadospopover="auto".popover="auto"

Anteriormente, as interações entre esses dois tipos de elementos popover podiam ser complexas em algumas situações, como aninhar elementos dentro popover="hint" de popover="auto" elementos.

popover="hint" Os elementos agora são ocultos apenas quando seu elemento ancestral popover="auto" está oculto ou quando um novo não relacionado popover="auto" é aberto.

Além disso, agora você pode aninhar com segurança um popover="auto" elemento dentro de um popover="hint" elemento. O elemento aninhado popover="auto" se comportará como um popover="hint" elemento. Isso permite casos de uso, como colocar um elemento personalizável <select> dentro de um popover="hint" elemento.

Veja também:

Atualizando todos os <selectedcontent> elementos em uma forma personalizável <select>

Quando vários <selectedcontent> elementos são definidos em um elemento personalizável <select> , todos eles agora são mantidos atualizados com a opção selecionada atual, em vez de apenas a primeira na ordem DOM.

Veja também:

Streaming de HTML fora de ordem

Use o <template for> elemento HTML e os <?start> intervalos de instrução de processamento para <?end> atualizar partes existentes do documento sem precisar usar JavaScript.

Esse recurso faz parte de uma iniciativa maior para adicionar suporte interno para atualizações do mesmo documento na Web.

Veja também:

APIs da Web

Os novos recursos da API Web a seguir estão incluídos no Microsoft Edge.

Desabilitar filtros SVG em plug-ins e iframes entre origens

Os filtros SVG não são mais aplicados ao seguinte:

  • Iframes de origem cruzada ou restritos (como iframes em área restrita).
  • Plugins incorporados (como PDFs).

Isso evita possíveis problemas de segurança decorrentes do processamento de conteúdo entre origens por meio de efeitos de filtro SVG.

Veja também:

MediaStreamTrackProcessor Contadores de quadros

Os discardedFrames atributos and totalFrames agora estão disponíveis na MediaStreamTrackProcessor interface.

Esses contadores permitem que você monitore a integridade do pipeline de processamento de mídia rastreando:

  • O número de quadros recebidos.
  • O número de quadros que foram descartados devido a restrições de recursos do sistema.

Veja também:

Origem opaca para data: URLs

Os Trabalhadores dedicados e os Trabalhadores compartilhados criados a partir de data: URLs agora recebem uma origem opaca exclusiva, em vez de herdar a origem do criador.

Isso alinha o Edge com o HTML Standard e melhora a segurança isolando esses trabalhadores do estado de mesma origem, como BroadcastChannel, localStorage, e IndexedDB.

Para preservar os limites de isolamento, esses trabalhos permanecem na mesma partição de armazenamento que seu criador (por exemplo, por site de nível superior ou nonce).

Veja também:

Migração de origem do PWA

A Migração de Origem do Aplicativo Web permite que um PWA (Aplicativo Web Progressivo) migre para uma nova origem, preservando a confiança, o estado de instalação e as permissões aplicáveis.

Isso ajuda as equipes a mover aplicativos com segurança entre domínios sem forçar os usuários a reinstalar.

Veja também:

Seja notificado quando os scrollBy métodos and scrollTo forem concluídos

Métodos de rolagem programática, como scrollBy e scrollTo, agora retornam um Promise objeto que é resolvido quando a rolagem é concluída. Use essa promessa para executar o código após a conclusão de uma rolagem suave, sem depender de um temporizador ou sondagem de evento de rolagem.

Veja também:

Web Speech API: qualidade de reconhecimento no dispositivo

A SpeechRecognition interface agora dá suporte à quality propriedade.

A quality propriedade permite que você especifique a funcionalidade semântica necessária para o reconhecimento que usa processLocally: true, também conhecido como reconhecimento no dispositivo.

Os valores com suporte da propriedade são mapeados para aumentar a complexidade da tarefa e os quality requisitos de hardware:

  • command
  • dictation
  • conversation

Usando a propriedade, você pode determinar se o dispositivo pode lidar com seu caso de uso usando o quality reconhecimento no dispositivo ou se você deve recorrer a um serviço de reconhecimento de nuvem.

Veja também:

WebGPU: Imediato

O WebGPU agora oferece suporte a imediatos.

Esse recurso adiciona um immediate espaço de endereço no WGSL e setImmediateData() métodos em codificadores de passagem de renderização, passagem de computação e pacote de renderização. Você pode usar essas APIs para passar valores pequenos e atualizados com frequência para sombreadores sem criar buffers de GPU ou grupos de associação.

Isso é útil para dados por desenho, como índices de objetos, índices de materiais e valores de transformação.

Veja também:

Avaliações de origem

A seguir estão as avaliações de origem para novas APIs experimentais que estão disponíveis no Microsoft Edge.

As avaliações de origem permitem que você experimente APIs experimentais em seu próprio site ativo por tempo limitado. Para saber mais sobre avaliações de origem, consulte Usar avaliações de origem no Microsoft Edge.

Para obter a lista completa de avaliações de origem disponíveis, consulte Avaliações de origem do Microsoft Edge.

Nome Descrição Registrar
Prompt API Prompts para um modelo de linguagem interno de seu site ou código JavaScript de extensão. Consulte também Prompt API. Registrar
Descritores personalizados WebAssembly Armazena dados associados a tipos de nível de origem com mais eficiência, em objetos descritores personalizados. Registrar
Heurística de navegação suave Expõe heurística de navegação suave para coletar métricas de desempenho em aplicativos de página única. Registrar
WebNN Crie e execute modelos de aprendizado de máquina acelerados por hardware diretamente em seu aplicativo Web. Registrar
Hashes de URL e de avaliação no CSP script-src Introduz hashes de URL e de avaliação para script-src diretivas CSP, substituindo listas de permissão baseadas em nome de host e unsafe-eval. Registrar
API de Instalação da Web Permite que um site instale outro site como um aplicativo Web usando navigator.install(). Registrar
OpaqueRange Permite a criação de intervalos dinâmicos sobre o texto interno <input> e elementos que são atualizados automaticamente à medida que o usuário edita <textarea> . Esses intervalos dão suporte a métodos de geometria, como getBoundingClientRect() e a API CSS Custom Highlight API, que permite casos de uso como pop marcar-ups posicionados por cursor e realce de ortografia embutida diretamente em controles de formulário, sem clonar elementos ou expor a estrutura interna do DOM. Registrar
HTML na tela Permite renderizar HTML na tela com novos métodos de desenho e o paint evento. Registrar
API de Credenciais Digitais - Suporte à Emissão Dispara a emissão de credenciais de usuário de um servidor emissor de credenciais para um aplicativo de carteira digital. Registrar
prerender_until_script Ação da API de Regras de Especulação Uma ação da API Regras de Especulação que pré-renderiza uma página, mas muda para pré-busca quando um script é executado. Registrar
WebAudio Renderização Configurável Quantum Permite especificar um tamanho quântico de renderização personalizado ao criar um AudioContext ou OfflineAudioContext. Registrar
Ativação de pré-renderização por envio de formulário Permite que as regras de pré-renderização na API de regras de especulação sejam ativadas por envios de formulário. Registrar
API de Desempenho de CPU Exibe informações sobre os recursos do dispositivo do usuário, para uso com a API de pressão de computação. Registrar
Listas de conexão permitidas Restringe conexões de um documento ou trabalho a uma lista de permissões de pontos de extremidade distribuída pelo servidor. Registrar
focus-without-user-activation Política de permissões Fornece um controle de inserção sobre o foco programático do conteúdo inserido por meio da focus-without-user-activation política de permissões. Quando a política é negada para um quadro, as chamadas de foco programático (element.focus(), autofocus, window.focus()dialog.showModal(), e foco popover) são bloqueadas, a menos que sejam disparadas pela ativação do usuário ou o foco esteja sendo delegado. Registrar
TextMetrics de tela aprimorados Expande a API TextMetrics Canvas com retângulos de seleção, consultas de caixa delimitadora e operações de cluster de glifos. Registrar
<usermedia> elemento HTML Um elemento HTML controlado pelo navegador para solicitar acesso à câmera ou ao microfone, substituindo as solicitações de permissão baseadas em JavaScript. Registrar
Pré-renderização de iframes entre origens Pré-renderiza iframes entre origens por meio de um cabeçalho de resposta de aceitação, em vez de atrasá-los até a ativação da página. Registrar
Tempo de Contêiner Monitora quando um contêiner DOM anotado é exibido e concluiu sua pintura inicial. Registrar
Separar durações de estilo e layout na API de Quadro de Animação Longa Adiciona styleDuration, forcedStyleDuration, layoutDuratione forcedLayoutDuration propriedades para uma análise mais profunda do desempenho do CSS. Registrar
Solicitar parâmetros de amostragem de API Os topK parâmetros de amostragem and temperature permitem otimizar o comportamento do modelo por sessão do modelo de linguagem. Registrar
<install> elemento HTML Instalar declarativamente outros sites como aplicativos Web usando o <install> elemento. Registrar
Scripts de módulo CSS declarativos Compartilha folhas de estilo declarativas com raízes de sombra, incluindo raízes de sombra declarativas, usando módulos de estilo embutidos. Registrar
Evento de entrada bruta do gamepad Em vez de depender de pesquisas freqüentes por meio navigator.getGamepads()de , as páginas da Web podem escutar gamepadrawinputchanged eventos. Esses eventos são acionados sempre que são detectadas alterações entre quadros de entrada do mesmo dispositivo. Registrar
Evento de preenchimento automático Detecta quando o preenchimento automático do navegador atualiza os controles de formulário, para adaptar a interface do usuário personalizada e a validação. Registrar
Descritores Personalizados WebAssembly V2 Armazena dados associados a tipos de nível de origem com mais eficiência, em objetos descritores personalizados. Registrar
WebMCP Permite que seu site registre ferramentas para que um agente no navegador conclua tarefas em nome de um usuário. Registrar

Observação

Partes desta página são modificações baseadas no trabalho criado e compartilhado por Chromium.org e usadas de acordo com os termos descritos na Licença Creative Commons Atribuição 4.0 Internacional.