mozilla

Revision 96836 of Firefox 4 para desenvolvedores

  • Slug da revisão: Firefox_4_para_desenvolvedores
  • Título da revisão: Firefox 4 para desenvolvedores
  • ID da revisão: 96836
  • Criado:
  • Autor: Verruckt
  • É revisão atual? Não
  • Comentário one or more formatting changes

Conteúdo da revisão

{{ draft() }}

O Firefox 4, o qual entrou em beta no mês de junho de 2010, melhora a performance, adiciona maior suporte ao HTML5 e outras tecnologias web envolvidas e, além disso, melhora a segurança. Este artigo proporciona informações iniciais sobre o lançamento que virá e quais funcionalidades estão disponíveis, tanto para desenvolvedores web, quanto para desenvolvedores de complementos e desenvolvedores da plataforma Gecko.

Muitas destas funcionalidades já podem ser testadas na versão Firefox 4 beta, ou, se estiver se sentindo aventureiro, em nightly trunk builds.

Observação: Este artigo é um trabalho em progresso, assim como todos os artigos linkados nesta página. Muitos nomes de artigos são espaços reservadis e alguns tópicos provavelmente serão quebrados em múltiplos artigos.

Funcionalidades para desenvolvedores web

O Gecko agora usa o analisador HTML5 (parser HTML5), que corrige bugs, melhora a interoperabilidade e melhora a performance. Ele também permite conteúdos de SVG e MathML embutidos diretamente na marcação HTML.

HTML

Conheça o parser HTML5
Uma olhada no que o analisador HTML5 (parser HTML5) significa para você e como incorporar SVG e MathML ao seu conteúdo.
Forms no HTML5
Uma olhada às melhorias aos web forms no HTML5. Entre estas mudanças foram adicionados tipos de entrada no elemento {{ HTMLElement("input") }} e validação de dados, dentre outros.
Seções HTML5
O Gecko agora suporta os novos elementos HTML5 relacionados a seções em um um documento: {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }} e {{ HTMLElement("footer") }}.
Outros elementos HTML5
O Gecko agora suporta os seguintes elementos do HTML5: {{ HTMLElement("mark") }}, {{ HTMLElement("figure") }} e  {{ HTMLElement("figcaption") }}.
WebSockets
Um guia para usar a nova API de WebSockets para comunicação em tempo real entre uma aplicação web e um servidor.

Modificações HTML diversas

  • Os elementos {{ HTMLElement("textarea") }} são agora redimensionáveis por padrão; você pode usar a propriedade {{ cssxref("resize") }} do CSS para desabilitar isto.
  • canvas.getContext e canvas.toDataURL não adicionam mais exceções quando chamados com argumentos não reconhecidos.
  • O elemento <canvas> agora suporta o método específico da Mozilla mozGetAsFile(), o qual permite a obtenção de um arquivo baseado na memória contendo uma imagem dos conteúdos do canvas. Veja HTMLCanvasElement para detalhes.
  • canvas2dcontext.globalCompositeOperation, canvas2dcontext.lineCap e canvas2dcontext.lineJoin não adicionam mais exceções quando configurados para valores desconhecidos.
  • canvas2dcontext.globalCompositeOperation não adiciona mais exceções quando configurado para um valor desconhecido e não suporta mais o valor não padrão darker.
  • O suporte para o elemento obsoleto {{ HTMLElement("spacer") }}, o qual não existe em nenhum outro navegador, foi removido.
  • O Gecko agora suporte a chamada click() em elementos <input> para abrir o seletor de arquivos. Veja o exemplo no artigo Using files from web applications.

CSS

Transições CSS (CSS transitions)
O suporte à novas transições CSS está disponível no Firefox 4.
Valores calculados em CSS
Foi adicionado o suporte para {{ cssxref("-moz-calc") }}. Isto permite especificar valores {{ xref_csslength() }} como expressões matemáticas.
Seletor de agrupamento
Suporte a {{ cssxref(":-moz-any") }} para agrupar seletores e fatorizar combinadores.
Suporte a sub-retângulo em imagens de fundo
A função {{ cssxref("-moz-image-rect") }} torna possível o uso de subretângulos de imagens como uma {{ cssxref("background-image") }} (imagem de plano de fundo).
Propriedades de toque CSS
O suporte para propriedades de toque foi adicionado. Detalhes e nomes de artigos reais, virão depois.
Using arbitrary elements as CSS backgrounds
Você pode usar a função {{ cssxref("-moz-element") }} do CSS e a função {{ domxref("document.mozSetImageElement()") }} do DOM para usar elementos HTML arbitrários como planos de fundos.
Privacidade e o seletor :visited
Mudanças foram feitas ao tipo de informação que pode ser obtida sobre o estilo dos links visitados usando seletores CSS. Isto pode afetas algumas aplicações web.

Novas propriedades do CSS

Propriedade Descrição
{{ cssxref("-moz-font-feature-settings") }} Permite características avançadas de customização em fontes OpenType.
{{ cssxref("-moz-tab-size") }} Especifica a largura em caracteres de espaço, de um caracter tab (U+0009) na renderização de texto.
{{ cssxref("resize") }} Permite o controle das dimensões nas quais um elemento pode ser redimensionado.

Novas pseudo-classes do CSS

Pseudo-classe Descrição
{{ cssxref(":-moz-handler-crashed") }} Usado para estilizar elementos cujos plugins tenham quebrado.
{{ cssxref(":-moz-placeholder") }} Aplicado ao espaço reservado de texto nos campos de formulário.
{{ cssxref(":-moz-submit-invalid") }} Aplicado ao botão de submeter em formulários quando um ou mais dos campos do formulário não é validado.
{{ cssxref(":-moz-window-inactive") }} Aplicado a elementos em janelas inativas.
{{ cssxref(":invalid") }} Aplicado automaticamente para os campos {{ HTMLElement("input") }} quando suas constantes são inválidas.
{{ cssxref(":optional") }} Aplicado automaticamente para os campos {{ HTMLElement("input") }} que não especifiquem o atributo required.
{{ cssxref(":required") }} Aplicado automaticamente para os campos {{ HTMLElement("input") }} que especifiquem o atributo required.
{{ cssxref(":valid") }} Aplicado automaticamente para os campos {{ HTMLElement("input") }} quando suas constantes são validadas com sucesso.

Novos pseudo-seletores do CSS

Pseudo-seletor Descrição
{{ cssxref(":-moz-focusring") }} Permite especificar a aparência de um elemento quando o Gecko acredita que ele deve ter uma indicação de foco renderizada.

Novas funções do CSS

Função Descrição
{{ cssxref(":-moz-any") }} Permite agrupar seletores e fatorizar combinações.
{{ cssxref("-moz-calc") }} Permite a especificação de valores {{ xref_csslength() }} como expressões matemáticas.
{{ cssxref("-moz-element") }} Permite o uso de um elemento arbitrário como imagem de fundo para {{ cssxref("background-image") }} e {{ cssxref("background") }}.
{{ cssxref("-moz-image-rect") }} Permite o uso de um sub-retângulo de uma imagem como um {{ cssxref("background-image") }} ou {{ cssxref("background") }}.

Propriedades do CSS renomeadas

Old Name New Name Notes
-moz-background-size {{ cssxref("background-size") }} O nome -moz-background-size não é mais suportado.
-moz-border-radius {{ cssxref("border-radius") }} O antigo nome é suportado por tempo limitado para permitir a atualização de seus sites. Mudanças de renderização também foram feitas para conseguir a compatibilidade com a última versão.
-moz-box-shadow {{ cssxref("box-shadow") }}  

Modificações CSS diversas

  • A propriedade {{ cssxref("text-shadow") }} agora permite raio de desfoque de até 300px, por razões de sanidade e performance.
  • A propriedade {{ cssxref("overflow") }} não se aplica mais para elementos do grupo "table" (<thead>, <tbody> e <tfoot>).
  • A propriedade {{ cssxref("-moz-appearance") }} agora suporta o valor -moz-win-borderless-glass, que aplica uma aparência Aero Glass a um elemento.
  • A funcionalidade de mídia -moz-device-pixel-ratio foi adicionada, permitindo o uso de pixels do dispositivo pela taxa de pixels CSS a ser usada em Consultas de Mídia.
  • A maneira com que o Gecko lida com o CSS units foi revisada para melhorar a compatibilidade com outros navegadores e para traduzir comprimentos absolutos mais acuradamente na contagem de pixels da tela baseado na DPI do dispositivo.

Modificações CSS diversas

  • -moz-border-radius foi renomeado para {{ cssxref("border-radius") }}.
    • -moz-border-radius é suportado como um apelido para um período de transição
    • A manipulação de valores percentuais foi alterada para ficar compatível com a última especificação
    • Cantos arredondados agora arredondam também conteúdo e imagens (a menos que seja especificado {{ cssxref("overflow") }}:visible)
  • A propriedade -moz-box-shadow foi renomeada para {{ cssxref("box-shadow") }}.
  • A propriedade {{ cssxref("text-shadow") }} agora permite raio de desfoque de até 300px, por razões de sanidade e performance.
  • A pseudoclasse {{ cssxref(":-moz-window-inactive") }} foi implementada.
  • A propriedade {{ cssxref("-moz-tab-size") }} permite a especificação da largura de um caracter de tab (U+0009) em caracteres de espaço, quando na renderização de texto.
  • A propriedade {{ cssxref("resize") }} do CSS3 foi implementada.
  • A propriedade -moz-background-size foi renomeada para seu nome final {{ cssxref("background-size") }}; -moz-background-size não é mais suportada.
  • A propriedade {{ cssxref("overflow") }} não se aplica mais para elementos do grupo "table" (<thead>, <tbody> e <tfoot>).
  • O pseudoseletor {{ cssxref(":-moz-focusring") }} permite a especificação da aparência de um elemento quando o Gecko acredita que o elemento deve ter uma indicação de foco renderizada.
  • A função {{ cssxref("-moz-element") }} do CSS permite o uso de um elemento arbitrário como imagem de fundo para {{ cssxref("background-image") }} e {{ cssxref("background") }}.
  • A propriedade {{ cssxref("-moz-appearance") }} agora suporta o valor -moz-win-borderless-glass, que aplica uma aparência Aero Glass a um elemento.
  • As pseudoclasses {{ cssxref(":valid") }} e {{ cssxref(":invalid") }} são agora automaticamente aplicadas para campos de validação {{ HTMLElement("input") }}.
  • A pseudoclasse {{ cssxref(":-moz-submit-invalid") }} é aplicada ao botão de submeter em campos de formulários quando um ou mais campos não são validados.
  • A pseudoclasse {{ cssxref(":required") }} é agora automaticamente aplicada aos campos {{ HTMLElement("input") }} que especificam o atributo requerido; a pseudoclasse {{ cssxref(":optional") }} é aplicada a todos os outros campos.
  • A pseudoclasse {{ cssxref(":-moz-placeholder") }} foi adicionada para permitir a estilização de campos de texto em formulários.
  • A pseudoclasse {{ cssxref(":-moz-handler-crashed") }} foi adicionada; ela estiliza elementos cujos plugins tenham quebrado.
  • A funcionalidade de mídia -moz-device-pixel-ratio foi adicionada, permitindo o uso de pixels do dispositivo pela taxa de pixels CSS a ser usada em Consultas de Mídia.
  • A nova propriedade -moz-font-feature-settings permite que você customize características avançadas das fontes, de fontes OpenType.
  • A maneira com que o Gecko lida com o CSS units foi revisada para melhorar a compatibilidade com outros navegadores e para traduzir comprimentos absolutos mais acuradamente na contagem de pixels da tela baseado na DPI do dispositivo.

Gráficos e vídeo

WebGL
O padrão de desenvolvimento WebGL é agora suportado pelo Firefox.
Otimização da performance gráfica
Dicas e truques para conseguir a melhor performance gráfica e de vídeo no Firefox 4.
Suporte a vídeos WebM
O novo formato aberto de vídeo WebM é suportado pelo Gecko 2.0; o suporte está incluído em nightlies desde 9 de junho.
Animação SVG com SMIL
O suporte a animações SMIL do SVG está agora disponível.
Usando SVG como imagens e como fundos de tela CSS
Você pode agora usar o SVG com o elemento {{ htmlelement("img") }}, assim como com a propriedade background-image do CSS.
Suporte ao atributo de mídia buffered
O atributo buffered nos elementos {{ HTMLElement("video") }} e {{ HTMLElement("audio") }} é agora suportado, permitindo a determinação de quais faixas de um arquivo de mídia foram carregadas. A interface {{ domxref("TimeRanges") }} do DOM foi implementada para suportar isto.
Atributo de mídia preload
O atributo preload da especificação do HTML5 foi implementado, substituindo o atributo anteriormente implementado (e não mais suportado) autobuffer. Isto afeta os elementos {{ HTMLElement("video") }} e {{ HTMLElement("audio") }}, assim como a interface {{ interface("nsIDOMHTMLMediaElement") }}.
Codec de vídeo Raw
O suporte ao formato de vídeo OggYUV raw foi implementado para uso com o elemento {{ HTMLElement("video") }}.

DOM

Obtenção de limites de retângulos para ranges
O objeto range agora possui os métodos getClientRects() e getBoundingClientRect(). Veja {{ bug("396392") }}.
Captura de eventos de mouse em elementos arbitrários
O suporte para as APIs setCapture() e releaseCapture() originadas do Internet Explorer foram adicionadas. Veja {{ bug("503943") }}.
Manipulação do histórico do navegador
O objeto de histórico de documento existente, disponível através do objeto {{ domxref("window.history") }} agora suporta os novos métodos pushState() e replaceState() do HTML5.
Animações usando o MozBeforePaint
Um novo evento foi adicionado, o qual combinado com o método {{ domxref("window.mozRequestAnimationFrame()") }} e a propriedade {{ domxref("window.mozAnimationStartTime") }}, proporciona uma maneira de criar animações sincronizadas uma com a outra.
Eventos de toque e multi-toque
Foi adicionado suporte ao evetos de toque e multi-toque.

Modificações DOM diversas

  • O "envoltório" de um elemento {{ HTMLElement("textarea") }} agora pode ser controlado a partir do DOM, através do atributo wrap do DOM. {{ bug("41464") }}
  • Os objetos {{ domxref("file") }} do DOM agora oferecem a propriedade url.
  • Suporte para FormData para XMLHttpRequest.
  • A propriedade {{ domxref("element.isContentEditable") }} foi implementada.
  • Adicionada a propriedade mozSourceNode ao objeto DragTransfer.
  • Adicionado o método selection.modify() ao objeto {{ domxref("Selection") }}; ele permite a fácil alteração da seleção de texto atual ou da posição do cursor em uma janela do navegador.
  • O suporte para o objeto window.directories e para a característica directories de {{ domxref("window.open") }}, qua não são suportadas em nenhum outro navegador, foi  removido. Ao invés dela, use personalbar. {{ Bug("474058") }}
  • A propriedade {{ domxref("event.mozInputSource") }} foi adicionada aos eventos de interface de usuário do DOM; esta propriedade não-padrão permite a determinação do tipo de dispositivo que gerou um evento.
  • O evento {{ domxref("document.onreadystatechange") }} foi implementado.
  • O método {{ domxref("document.createElement") }} não aceita mais a tag nome entre < e > no modo quirk.
  • A propriedade {{ domxref("window.mozPaintCount") }} foi adicionada; ela permite a determinação de quantas vezes um documento foi pintado. Isto pode ser útil no teste de performance de suas aplicações web.
  • O token de língua foi removido de {{ domxref("window.navigator.appVersion") }} e {{ domxref("window.navigator.userAgent") }}. Ao invés deles, use o {{ domxref("window.navigator.language") }} ou o Accept-Language header.  {{ Bug("572656") }}
  • O objeto XMLHttpRequest agora expõe a resposta como um array digitado em JavaScript, assim como uma string, usando a propriedade mozResponseArrayBuffer específica do Gecko.
  • Eventos de mouse agora incluem uma propriedade mozPressure indicando a quantidade de pressão em dispositivos de entrada sensíveis a pressão, suportados.
  • Os métodos window.createBlobURL() e window.revokeBlobURL() permitem a criação de URLs blob a qual referencia arquivos locais.
  • O método DOMImplementation.createHTMLDocument() permite a criação de novos documentos HTML.

Segurança

Política de Segurança de Conteúdo (CSP)
A Política de Segurança de Conteúdo (Content Security Policy - CSP) é uma proposta da Mozilla desenvolvida para ajudar web designers e administradores de servidores a especificar como o conteúdo em seus sites interage. A meta é ajudar a detectar e abrandar ataques, incluindo cross-site scripting e ataques de injeção de dados.
Segurança de Transporte do HTTP Estrito (HTTP Strict Transport Security)
A Segurança de Transporte de HTTP Estrito é uma característica que permite a um website dizer ao navegador que ele deve ser comunicado somente usando HTTPS, ao invés de HTTP.
O cabeçalho de resposta (The X-FRAME-OPTIONS response header)
O cabeçalho de resposta HTTP, X-FRAME-OPTIONS, introduzido no Internet Explorer 8 é agora suportado pelo Firefox. Isto permite a sites indicar quando suas páginas devem ou não ser usadas em quadros (frames), e, em caso afirmativo, se deve ou não restringir isto à mesma origem.
Mudanças na string de Agente de Usuário (User Agent string) changes
Como um meio para reduzir a quantidade de dados entropia descartada em requisições HTTP (reduce the amount of data and entropy sent out in HTTP requests), a força da criptografia e tokens de linguagem foram removidos pela string do agente de usuário.

JavaScript

Para uma visão geral das mudanças implementadas em JavaScript 1.8.5, veja Novidades no JavaScript 1.8.5. O JavaScript no Firefox 4 terá aderência adicional ao padrão ECMAScript 5.

Ferramentas para desenvolvedores

Usando o Web Console
A ferramenta Web Console é um depurador útil para ajudar desenvolvedores web, assim como, desenvolvedores de extensões.

{{ gecko_callout_heading("2.0") }}

O Console de Erros está inicialmente desabilitado por padrão no Firefox 4. Você pode reabilitá-lo mudando a preferência devtools.errorconsole.enabled para true e reiniciando seu navegador.

Mudanças para desenvolvedores Mozilla e de complementos

Para dicas úteis sobre a atualização de extensões existentes para o Firefox 4, veja Atualizando extensões para o Firefox 4. Existem muitas mudanças de chaves que quebram a compatibilidade com complementos existentes, então certifique-se de ler este artigo.

Módulos de codificação JavaScript

Services.jsm
O módulo de código Services.jsm fornece "getters" que tornam mais fácil a obtenção de referências a serviços comumente usados, como o serviço de preferências ou o mediador de janelas, entre outros.
JS-ctypes API
A API JS-ctypes torna possível chamar funções de fora da biblioteca compatível com C, sem precisar usar o XPCOM.
Gerenciador de Complementos
O Gerenciador de Complementos fornece informações sobre complementos instalados, suporte à gerência dos mesmos e fornece maneiras para instalar e remover complementos.
Carregando módulos de código a partir de URL chrome: (en)
Você pode agora carregar módulos JavaScript usando URL chrome:, mesmo dentro de arquivos JAR.
DownloadLastDir.jsm
O módulo de código DownloadLastDir.jsm fornece a variável global, a qual contém uma string que pode ser usada para aprender o caminho do diretório no qual ocorreu o último download. Este módulo lida com questões relacionadas a privacidade de navegação do usuário.

Mudanças diversas aos módulos de código

  • O módulo de código NetUtil.jsm agora oferece o método readInputStreamToString(), o qual permite a leitura de bytes arbitrários de uma "stream" em uma string, mesmo se a "stream" incluir zeros.

Mudanças no DOM

{{ domxref("ChromeWorker") }}
Um novo tipo de worker para código privilegiado; ele permite o uso de coisas como js-ctypes de workers em extensões e código de aplicações.
Eventos de toque
Suporte para eventos de toque (não padrões) foi adicionado; isto permite detectar o movimento de múltiplos dedos movendo-se em uma tela ao mesmo tempo.

XUL

Mudanças no elemento tabbrowser

Várias mudanças foram feitas ao elemento {{ XULElem("tabbrowser") }} que causam impactos nas extensões que interagem com as abas.

  • Os eventos de TabClose/TabSelect/TabOpen (Fechar aba/Selecionar aba/Abrir aba) não levam mais ao elemento {{ XULElem("tabbrowser") }} (gBrowser). Eventos listeners (ouvintes) para estes eventos devem ser adicionados ao gBrowser.tabContainer ao invés de diretamente ao gBrowser.
  • O menu de contexto das abas não mais um filho anônimo do {{ XULElem("tabbrowser") }}. Ele pode portanto ser sobreposto diretamente com XUL overlays. Ele também pode ser acessado mais diretamente com JS via gBrowser.tabContextMenu. Veja esta postagem no blog (en) para mais detalhes.
  • A nova propriedade {{ XULProp("visibleTabs") }} foi adicionada para permitir pegar um array das abas visíveis correntemente; isto permite determinar quais abas estão visíveis no conjuto de abas atual. Isto é usado pelo Firefox Panorama, por exemplo.
  • Adicionado o novo método {{ XULMeth2("showOnlyTheseTabs") }}; isto é usado pelo Firefox Panorama.
  • Adicionado o novo método {{ XULMeth2("getIcon") }}, o qual permite pegar o favicon de uma aba sem ter chamar o elemento {{ XULElem("browser") }}.
  • Adicionada a nova propriedade {{ XULProp("tabbrowser.tabs") }}, a qual permite facilmente pegar uma lista das abas em um elemento {{ XULElem("tabbrowser") }}.
  • Os novos métodos {{ XULMeth2("pinTab") }} e {{ XULMeth2("unpinTab") }} permitem que você prenda e desprenda abas (isto é, trocá-las entre serem abas de app ou abas normais).

Suporte remoto ao XUL removido

XUL remoto não é mais suportado; isto afeta os documentos XUL servidos através de HTTP; além disso, não é mais possível carregar documentos XUL usando URLs file://. Há, entretanto, um recurso de whitelist que pode ser usado para permitir domínios específicos a carregarem o XUL remotamente. O Remote XUL Manager extension permite o gerenciamento desta whitelist.

Mudanças diversas no XUL

  • O atributo {{ xulattr("readonly") }} agora funciona corretamente para campos.
  • O elemento {{ xulelem("resizer") }} agora permite o uso do atributo {{ xulattr("element") }} para especificar um elemento a ser redimencionado, ao invés de redimencionar a janela.
  • O atributo "active" não é mais configurado como ativo em janelas XUL. Ao invés disso, você pode usar a nova pseudoclasse {{ cssxref(":-moz-window-inactive") }} para definir diferentes estilos para as os fundos das janelas.
  • O atributo {{ xulattr("emptytext") }} está agora obsoleto; ao invés dele, você deve usar o {{ xulattr("placeholder") }}.
  • O elemento {{ xulelem("popup") }} não é mais suportado; ao invés dele, você deve usar o {{ xulelem("menupopup") }}.
  • O elemento {{ xulelem("window") }} agora oferece um atributo {{ xulattr("accelerated") }}; quando verdadeiro, é permitido ao gerenciador de camadas por hardware, acelerar a janela.
  • O elemento {{ xulelem("stack") }} agora suporta os atributosl {{ xulattr("bottom") }} e {{ xulattr("right") }}.
  • O atributo {{ xulattr("alternatingbackground") }} para elementos {{ xulelem("tree") }} não é mais suportado; ao invés dele, você pode usar a pseudoclasse {{ cssxref(":-moz-tree-row") }}.
  • O botão de exibição da barra de ferramentas dos favoritos com anonid chevronPopup não é mais anônimo; ele possui um id de PlacesChevron.
  • O elemento {{ xulelem("tabs") }} agora possui a propriedade {{ xulprop("tabbox") }}, substituindo a antiga propriedade _tabbox, a qual está obsoleta (e nunca foi documentada).
  • Elementos XUL {{ xulelem("window") }} agora possuem o atributo {{ xulattr("drawintitlebar") }}; se ele for true, a área de conteúdo da janela inclui a barra de títulos, permitindo desenhar na barra de títulos.
  • Os novos elementos TabPinned e TabUnpinned estão disponíveis, permitindo que você detecte quando abas são prendidas e desprendidas (en).
  • Os elementos {{ xulelem("tab") }} agora possuem um atributo {{ xulattr("pinned") }}, permitindo que você determine quando uma aba está ou não correntemente presa.

Armazenamento

Mudanças diversas na API storage (de armazenamento)

  • A interface {{ interface("mozIStorageBindingParamsArray") }} possui agora um atributo length (comprimento) que indica o número de objetos {{ interface("mozIStorageBindingParams") }} no array.
  • O {{ ifandmethod("mozIStorageStatement", "bindParameters") }} agora retorna um erro se a {{ interface("mozIStorageBindingParamsArray") }} especificada estiver vazia.
  • Adicionado o método {{ ifmethod("mozIStorageConnection", "clone") }}, o qual permite a clonagem de uma conexão de um banco de dados existente.
  • Adicionado o método  {{ ifmethod("mozIStorageConnection", "asyncClose") }}, o qual permite fechar ua conexão assíncronamente; você especifica um callback para ser notificado quando a operação de fechamento estiver completa.
  • Adicionado o método {{ ifmethod("mozIStorageConnection", "setGrowthIncrement") }}, o qual permite a especificação da quantidade a qual o arquivo de banco de dados cresce com o tempo, para ajudar o SQLite a reduzir a fragmentação.
  • O erro SQLITE_CONSTRAINT é agora reportado como NS_ERROR_STORAGE_CONSTRAINT ao invés de como NS_ERROR_FAILURE.

XPCOM

Em adição à mudanças específicas referenciadas abaixo, é importante notar que não existem mais interfaces estáticas. Todas as interfaces são dinâmicas, independente do que a documentação pode dizer. Atualizaremos a documentação com o tempo.

Mudanças no XPCOM no Gecko 2.0
Detalhes sobre as mudanças para o XPCOM que causam algum impacto na compatibilidade do Firefox 4.
Components.utils.getGlobalForObject()
Este novo método retorna o objeto global com o qual um objeto é associado; ele substitui um caso de uso comum do agora removido __parent__.

Places

  • Os resultados de consultas no Places podem agora ser vistos por múltiplos observadores eas consultas podem ser executadas assíncronamente. Isto significa que há algumas mudanças nas interfaces {{ interface("nsINavHistoryResult") }}, {{ interface("nsINavHistoryQueryOptions") }}, e {{ interface("nsINavHistoryContainerResultNode") }}. Mais significantemente, a interface {{ interface("nsINavHistoryResultViewer") }} foi renomeada para {{ interface("nsINavHistoryResultObserver") }}.
  • Algumas novas notificações foram adicionadas para permitir que o navegador controle os processos de desligamento do serviço Places com mais segurança. Destas, a maioria é somente para uso interno, mas o conhecimento da notificação places-connection-closed está disponível quando o serviço Places completa seu processo de desligamento.

Mudanças na interface

  • As interfaces {{ interface("nsIDocShell") }} e {{ interface("nsIWebBrowser") }} agora possuem um novo atributo isActive, o qual é usado para permitir a otimização de caminhos de código para documentos que não estão visíveis correntemente.
  • O método {{ interface("nsIMemory") }} isLowMemory() foi considerado obsoleto. Ao invés disso, você deve usar notificações "memory-pressure" para ligar com situações de pouca memória.

Gerenciamento de memória

Alocação de memória infalível
A Mozilla, agora proporciona alocadores de memória infalíveis que são garantem que não haverá um retorno null. Você deve ler este artigo para aprender como eles trabalham e como solicitar explicitamente a alocação de memória falível versus invalível.

Outras mudanças

Removido o suporte ao Gopher
O protocolo Gopher não é mais suportado nativamente. O suporte continuado está disponível pela extensão OverbiteFF.
Plugin padrão removido
O plugin padrão foi removido. A pasta de aplicações plugin também foi removida por padrão, entretanto o suporte para a instalação de plugins através desta pasta ainda existe. Veja bug 533891.
Gerenciador de Extensões substituido pelo Gerenciador de Complementos
O nsIExtensionManager foi substituido pelo AddonManager.
Mudanças nos gestos
A rolagem com três dedos para cima ou para baixo em trackpads foi alterada para, por padrão, abrir e fechar a visão do Firefox Panorama (criado como TabCandy). Para voltar aos comando anteriores de rolagem para cima e para baixo, abra about:config e configure browser.gesture.swipe.down para cmd_scrollBottom e browser.gesture.swipe.up para cmd_scrollTop.

Veja também

{{ languages( { "en":  "en/Firefox_4_for_developers", "de": "de/Firefox_4_für_Entwickler", "ja": "ja/Firefox_4_for_developers", "zh-tw": "zh_tw/Firefox_4_for_developers"} ) }}

Fonte da revisão

<p>{{ draft() }}</p>
<p>O Firefox 4, o qual entrou em beta no mês de junho de 2010, melhora a performance, adiciona maior suporte ao HTML5 e outras tecnologias web envolvidas e, além disso, melhora a segurança. Este artigo proporciona informações iniciais sobre o lançamento que virá e quais funcionalidades estão disponíveis, tanto para desenvolvedores web, quanto para desenvolvedores de complementos e desenvolvedores da plataforma Gecko.</p>
<p>Muitas destas funcionalidades já podem ser testadas na versão <a class=" external" href="http://www.mozilla.com/en-US/firefox/beta/" title="http://www.mozilla.com/en-US/firefox/beta/">Firefox 4 beta</a>, ou, se estiver se sentindo aventureiro, em <a class=" external" href="http://nightly.mozilla.org/" title="http://nightly.mozilla.org/">nightly trunk builds</a>.</p>
<div class="note"><strong>Observação:</strong> Este artigo é um trabalho em progresso, assim como todos os artigos linkados nesta página. Muitos nomes de artigos são espaços reservadis e alguns tópicos provavelmente serão quebrados em múltiplos artigos.</div>
<h2>Funcionalidades para desenvolvedores web</h2>
<p>O Gecko agora usa o analisador <a href="/pt/HTML/HTML5" title="pt/HTML/HTML5">HTML5</a> (parser HTML5), que corrige bugs, melhora a interoperabilidade e melhora a performance. Ele também permite conteúdos de <a href="/en/SVG" title="en/SVG">SVG</a> e <a href="/en/MathML" title="en/MathML">MathML</a> embutidos diretamente na marcação HTML.</p>
<h3>HTML</h3>
<dl> <dt><a href="/pt/HTML/HTML5/Parser_HTML5" title="pt/HTML/HTML5/Parser HTML5">Conheça o parser HTML5</a></dt> <dd>Uma olhada no que o analisador HTML5 (parser HTML5) significa para você e como incorporar SVG e MathML ao seu conteúdo.</dd> <dt><a href="/pt/HTML/HTML5/Forms_no_HTML5" title="pt/HTML/HTML5/Forms no HTML5">Forms no HTML5</a></dt> <dd>Uma olhada às melhorias aos web forms no HTML5. Entre estas mudanças foram adicionados tipos de entrada no elemento {{ HTMLElement("input") }} e validação de dados, dentre outros.</dd> <dt><a href="/pt/Seções_e_perfil_de_um_documento_HTML5" title="pt/Seções e perfil de um documento HTML5">Seções HTML5</a></dt> <dd>O Gecko agora suporta os novos elementos HTML5 relacionados a seções em um um documento: {{ HTMLElement("article") }}, {{ HTMLElement("section") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("aside") }}, {{ HTMLElement("hgroup") }}, {{ HTMLElement("header") }} e {{ HTMLElement("footer") }}.</dd> <dt>Outros elementos HTML5</dt> <dd>O Gecko agora suporta os seguintes elementos do HTML5: {{ HTMLElement("mark") }}, {{ HTMLElement("figure") }} e  {{ HTMLElement("figcaption") }}.</dd> <dt>WebSockets</dt> <dd>Um guia para usar a nova API de WebSockets para comunicação em tempo real entre uma aplicação web e um servidor.</dd>
</dl>
<h4>Modificações HTML diversas</h4>
<ul> <li>Os elementos {{ HTMLElement("textarea") }} são agora redimensionáveis por padrão; você pode usar a propriedade {{ cssxref("resize") }} do CSS para desabilitar isto.</li> <li><code>canvas.getContext</code> e <code>canvas.toDataURL</code> não adicionam mais exceções quando chamados com argumentos não reconhecidos.</li> <li>O elemento <code><a href="../../../../en/HTML/Element/canvas" rel="custom nofollow">&lt;canvas&gt;</a></code> agora suporta o método específico da Mozilla <code>mozGetAsFile()</code>, o qual permite a obtenção de um arquivo baseado na memória contendo uma imagem dos conteúdos do canvas. Veja <code><a href="../../../../en/DOM/HTMLCanvasElement" rel="custom nofollow">HTMLCanvasElement</a></code> para detalhes.</li> <li><code>canvas2dcontext.globalCompositeOperation</code>, <code>canvas2dcontext.lineCap</code> e <code>canvas2dcontext.lineJoin</code> não adicionam mais exceções quando configurados para valores desconhecidos.</li> <li><code>canvas2dcontext.globalCompositeOperation</code> não adiciona mais exceções quando configurado para um valor desconhecido e não suporta mais o valor não padrão <code>darker</code>.</li> <li>O suporte para o elemento obsoleto {{ HTMLElement("spacer") }}, o qual não existe em nenhum outro navegador, foi removido.</li> <li>O Gecko agora suporte a chamada <code>click()</code> em elementos <code><a href="../../../../en/HTML/Element/input" rel="custom nofollow">&lt;input&gt;</a></code> para abrir o seletor de arquivos. Veja o <a href="/en/Using_files_from_web_applications#Hiding_the_file_input_element" title="en/Using files from web applications#Hiding the file input element"><ins>exemplo</ins></a> no artigo <a href="/en/Using_files_from_web_applications" title="en/Using files from web applications"><ins>Using files from web applications</ins></a>.</li>
</ul>
<h3>CSS</h3>
<dl> <dt><a href="/pt/CSS/Transições_CSS" title="pt/CSS/Transições CSS">Transições CSS</a> (CSS transitions)</dt> <dd>O suporte à novas transições CSS está disponível no Firefox 4.</dd> <dt>Valores calculados em CSS</dt> <dd>Foi adicionado o suporte para <code><span style="font-family: Verdana,Tahoma,sans-serif;">{{ cssxref("-moz-calc") }}. Isto permite especificar valores {{ xref_csslength() }} como expressões matemáticas.</span></code></dd> <dt>Seletor de agrupamento</dt> <dd>Suporte a {{ cssxref(":-moz-any") }} para agrupar seletores e fatorizar combinadores.</dd> <dt>Suporte a sub-retângulo em imagens de fundo</dt> <dd>A função {{ cssxref("-moz-image-rect") }} torna possível o uso de subretângulos de imagens como uma {{ cssxref("background-image") }} (imagem de plano de fundo).</dd> <dt>Propriedades de toque CSS</dt> <dd>O suporte para propriedades de toque foi adicionado. Detalhes e nomes de artigos reais, virão depois.</dd> <dt><a href="/en/CSS/-moz-element" title="en/CSS/-moz-element">Using arbitrary elements as CSS backgrounds</a></dt> <dd>Você pode usar a função {{ cssxref("-moz-element") }} do CSS e a função {{ domxref("document.mozSetImageElement()") }} do DOM para usar elementos HTML arbitrários como planos de fundos.</dd> <dt><a href="/pt/CSSPrivacidade_e_o_seletor_:visited" title="pt/CSSPrivacidade e o seletor :visited">Privacidade e o seletor :visited</a></dt> <dd>Mudanças foram feitas ao tipo de informação que pode ser obtida sobre o estilo dos links visitados usando seletores CSS. Isto pode afetas algumas aplicações web.</dd>
</dl>
<h4>Novas propriedades do CSS</h4>
<table class="standard-table"> <tbody> <tr> <td class="header">Propriedade</td> <td class="header">Descrição</td> </tr> <tr> <td>{{ cssxref("-moz-font-feature-settings") }}</td> <td>Permite características avançadas de customização em fontes OpenType.</td> </tr> <tr> <td>{{ cssxref("-moz-tab-size") }}</td> <td>Especifica a largura em caracteres de espaço, de um caracter tab (U+0009) na renderização de texto.</td> </tr> <tr> <td>{{ cssxref("resize") }}</td> <td>Permite o controle das dimensões nas quais um elemento pode ser redimensionado.</td> </tr> </tbody>
</table>
<h4>Novas pseudo-classes do CSS</h4>
<table class="standard-table"> <tbody> <tr> <td class="header">Pseudo-classe</td> <td class="header">Descrição</td> </tr> <tr> <td>{{ cssxref(":-moz-handler-crashed") }}</td> <td>Usado para estilizar elementos cujos plugins tenham quebrado.</td> </tr> <tr> <td>{{ cssxref(":-moz-placeholder") }}</td> <td>Aplicado ao espaço reservado de texto nos campos de formulário.</td> </tr> <tr> <td>{{ cssxref(":-moz-submit-invalid") }}</td> <td>Aplicado ao botão de submeter em formulários quando um ou mais dos campos do formulário não é validado.</td> </tr> <tr> <td>{{ cssxref(":-moz-window-inactive") }}</td> <td>Aplicado a elementos em janelas inativas.</td> </tr> <tr> <td>{{ cssxref(":invalid") }}</td> <td>Aplicado automaticamente para os campos {{ HTMLElement("input") }} quando suas constantes são inválidas.</td> </tr> <tr> <td>{{ cssxref(":optional") }}</td> <td>Aplicado automaticamente para os campos {{ HTMLElement("input") }} que não especifiquem o atributo <code>required</code>.</td> </tr> <tr> <td>{{ cssxref(":required") }}</td> <td>Aplicado automaticamente para os campos {{ HTMLElement("input") }} que especifiquem o atributo <code>required</code>.</td> </tr> <tr> <td>{{ cssxref(":valid") }}</td> <td>Aplicado automaticamente para os campos {{ HTMLElement("input") }} quando suas constantes são validadas com sucesso.</td> </tr> </tbody>
</table>
<h4>Novos pseudo-seletores do CSS</h4>
<table class="standard-table"> <tbody> <tr> <td class="header">Pseudo-seletor</td> <td class="header">Descrição</td> </tr> <tr> <td>{{ cssxref(":-moz-focusring") }}</td> <td>Permite especificar a aparência de um elemento quando o Gecko acredita que ele deve ter uma indicação de foco renderizada.</td> </tr> </tbody>
</table>
<h4>Novas funções do CSS</h4>
<table class="standard-table"> <tbody> <tr> <td class="header">Função</td> <td class="header">Descrição</td> </tr> <tr> <td>{{ cssxref(":-moz-any") }}</td> <td>Permite agrupar seletores e fatorizar combinações.</td> </tr> <tr> <td>{{ cssxref("-moz-calc") }}</td> <td>Permite a especificação de valores<code><span style="font-family: Verdana,Tahoma,sans-serif;"> {{ xref_csslength() }} como expressões matemáticas.</span></code></td> </tr> <tr> <td>{{ cssxref("-moz-element") }}</td> <td>Permite o uso de um elemento arbitrário como imagem de fundo para {{ cssxref("background-image") }} e {{ cssxref("background") }}.</td> </tr> <tr> <td>{{ cssxref("-moz-image-rect") }}</td> <td>Permite o uso de um sub-retângulo de uma imagem como um {{ cssxref("background-image") }} ou {{ cssxref("background") }}.</td> </tr> </tbody>
</table>
<h4>Propriedades do CSS renomeadas</h4>
<table class="standard-table"> <thead> <tr> <td class="header">Old Name</td> <td class="header">New Name</td> <td class="header">Notes</td> </tr> </thead> <tbody> <tr> <td><code>-moz-background-size</code></td> <td>{{ cssxref("background-size") }}</td> <td>O nome <code>-moz-background-size</code> não é mais suportado.</td> </tr> <tr> <td><code>-moz-border-radius</code></td> <td>{{ cssxref("border-radius") }}</td> <td>O antigo nome é suportado por tempo limitado para permitir a atualização de seus sites. Mudanças de renderização também foram feitas para conseguir a compatibilidade com a última versão.</td> </tr> <tr> <td><code>-moz-box-shadow</code></td> <td>{{ cssxref("box-shadow") }}</td> <td> </td> </tr> </tbody>
</table>
<h4>Modificações CSS diversas</h4>
<ul> <li>A propriedade {{ cssxref("text-shadow") }} agora permite raio de desfoque de até 300px, por razões de sanidade e performance.</li> <li>A propriedade {{ cssxref("overflow") }} não se aplica mais para elementos do grupo "table" (<code>&lt;thead&gt;</code>, <code>&lt;tbody&gt;</code> e <code>&lt;tfoot&gt;</code>).</li> <li>A propriedade {{ cssxref("-moz-appearance") }} agora suporta o valor<code> -moz-win-borderless-glass<span style="font-family: Verdana,Tahoma,sans-serif;">, que aplica uma aparência Aero Glass a um elemento.</span></code></li> <li>A funcionalidade de mídia <code><a href="/En/CSS/Media_queries#-moz-device-pixel-ratio" title="En/CSS/Media queries#-moz-device-pixel-ratio">-moz-device-pixel-ratio</a></code> foi adicionada, permitindo o uso de pixels do dispositivo pela taxa de pixels CSS a ser usada em <a href="/Pt/CSS/Consulta_de_mídia" title="Pt/CSS/Consulta de mídia">Consultas de Mídia</a>.</li> <li>A maneira com que o Gecko lida com o <a href="../../../../en/CSS-2_Quick_Reference/Units" rel="internal">CSS units</a> foi revisada para melhorar a compatibilidade com outros navegadores e para traduzir comprimentos absolutos mais acuradamente na contagem de pixels da tela baseado na DPI do dispositivo.</li>
</ul>
<h4>Modificações CSS diversas</h4>
<ul> <li><code>-moz-border-radius </code>foi renomeado para {{ cssxref("border-radius") }}. <ul> <li><code>-moz-border-radius </code>é suportado como um apelido para um período de transição</li> <li>A manipulação de valores percentuais foi alterada para ficar compatível com a última especificação<code><br> </code></li> <li>Cantos arredondados agora arredondam também conteúdo e imagens (a menos que seja especificado {{ cssxref("overflow") }}<code>:visible</code>)</li> </ul> </li> <li>A propriedade <code>-moz-box-shadow</code> foi renomeada para {{ cssxref("box-shadow") }}.</li> <li>A propriedade {{ cssxref("text-shadow") }} agora permite raio de desfoque de até 300px, por razões de sanidade e performance.</li> <li>A pseudoclasse {{ cssxref(":-moz-window-inactive") }} foi implementada.</li> <li>A propriedade {{ cssxref("-moz-tab-size") }} permite a especificação da largura de um caracter de tab (U+0009) em caracteres de espaço, quando na renderização de texto.</li> <li>A propriedade {{ cssxref("resize") }} do CSS3 foi implementada.</li> <li>A propriedade <code>-moz-background-size </code>foi renomeada para seu nome final {{ cssxref("background-size") }}; <code>-moz-background-size</code> não é mais suportada.</li> <li>A propriedade {{ cssxref("overflow") }} não se aplica mais para elementos do grupo "table" (<code>&lt;thead&gt;</code>, <code>&lt;tbody&gt;</code> e <code>&lt;tfoot&gt;</code>).</li> <li>O pseudoseletor {{ cssxref(":-moz-focusring") }} permite a especificação da aparência de um elemento quando o Gecko acredita que o elemento deve ter uma indicação de foco renderizada.</li> <li>A função {{ cssxref("-moz-element") }} do CSS permite o uso de um elemento arbitrário como imagem de fundo para {{ cssxref("background-image") }} e {{ cssxref("background") }}.</li> <li>A propriedade {{ cssxref("-moz-appearance") }} agora suporta o valor<code> -moz-win-borderless-glass<span style="font-family: Verdana,Tahoma,sans-serif;">, que aplica uma aparência Aero Glass a um elemento.</span></code></li> <li>As pseudoclasses {{ cssxref(":valid") }} e {{ cssxref(":invalid") }} são agora automaticamente aplicadas para campos de validação {{ HTMLElement("input") }}.</li> <li>A pseudoclasse {{ cssxref(":-moz-submit-invalid") }} é aplicada ao botão de submeter em campos de formulários quando um ou mais campos não são validados.</li> <li>A pseudoclasse {{ cssxref(":required") }} é agora automaticamente aplicada aos campos {{ HTMLElement("input") }} que especificam o atributo requerido; a pseudoclasse {{ cssxref(":optional") }} é aplicada a todos os outros campos.</li> <li>A pseudoclasse {{ cssxref(":-moz-placeholder") }} foi adicionada para permitir a estilização de campos de texto em formulários.</li> <li>A pseudoclasse {{ cssxref(":-moz-handler-crashed") }} foi adicionada; ela estiliza elementos cujos plugins tenham quebrado.</li> <li>A funcionalidade de mídia <code><a href="/En/CSS/Media_queries#-moz-device-pixel-ratio" title="En/CSS/Media queries#-moz-device-pixel-ratio">-moz-device-pixel-ratio</a></code> foi adicionada, permitindo o uso de pixels do dispositivo pela taxa de pixels CSS a ser usada em <a href="/Pt/CSS/Consulta_de_mídia" title="Pt/CSS/Consulta de mídia">Consultas de Mídia</a>.</li> <li>A nova propriedade <code><a href="../../../../en/CSS/-moz-font-feature-settings" rel="custom nofollow">-moz-font-feature-settings</a></code> permite que você customize características avançadas das fontes, de fontes OpenType.</li> <li>A maneira com que o Gecko lida com o <a href="../../../../en/CSS-2_Quick_Reference/Units" rel="internal">CSS units</a> foi revisada para melhorar a compatibilidade com outros navegadores e para traduzir comprimentos absolutos mais acuradamente na contagem de pixels da tela baseado na DPI do dispositivo.</li>
</ul>
<h3>Gráficos e vídeo</h3>
<dl> <dt> </dt><dt><a href="/en/WebGL" title="en/WebGL">WebGL</a></dt> <dd>O padrão de desenvolvimento WebGL é agora suportado pelo Firefox.</dd> <dt>Otimização da performance gráfica</dt> <dd>Dicas e truques para conseguir a melhor performance gráfica e de vídeo no Firefox 4.</dd> <dt><a href="/pt/Suporte_a_videos_WebM" title="pt/Suporte a videos WebM">Suporte a vídeos WebM</a></dt> <dd>O novo formato aberto de vídeo <a class=" external" href="http://www.webmproject.org/" title="http://www.webmproject.org/">WebM</a> é suportado pelo Gecko 2.0; o suporte está incluído em nightlies desde 9 de junho.</dd> <dt>Animação SVG com SMIL</dt> <dd>O suporte a animações SMIL do SVG está agora disponível.</dd> <dt>Usando SVG como imagens e como fundos de tela CSS</dt> <dd>Você pode agora usar o SVG com o elemento {{ htmlelement("img") }}, assim como com a propriedade <code><a href="../../../../en/CSS/background-image" rel="custom nofollow">background-image</a></code> do CSS.</dd> <dt>Suporte ao atributo de mídia <code>buffered</code></dt> <dd>O atributo <code>buffered</code> nos elementos {{ HTMLElement("video") }} e {{ HTMLElement("audio") }} é agora suportado, permitindo a determinação de quais faixas de um arquivo de mídia foram carregadas. A interface {{ domxref("TimeRanges") }} do DOM foi implementada para suportar isto.</dd> <dt>Atributo de mídia <code>preload</code></dt> <dd>O atributo <code>preload</code> da especificação do HTML5 foi implementado, substituindo o atributo anteriormente implementado (e não mais suportado) <code>autobuffer</code>. Isto afeta os elementos {{ HTMLElement("video") }} e {{ HTMLElement("audio") }}, assim como a interface {{ interface("nsIDOMHTMLMediaElement") }}.</dd> <dt>Codec de vídeo Raw</dt> <dd>O suporte ao formato de vídeo <a class=" external" href="http://wiki.xiph.org/OggYUV" title="http://wiki.xiph.org/OggYUV">OggYUV</a> raw foi implementado para uso com o elemento {{ HTMLElement("video") }}.</dd>
</dl>
<h3>DOM</h3>
<dl> <dt>Obtenção de limites de retângulos para <em>ranges</em></dt> <dd>O objeto <em>range</em> agora possui os métodos <code>getClientRects()</code> e <code>getBoundingClientRect()</code>. Veja {{ bug("396392") }}.</dd> <dt>Captura de eventos de mouse em elementos arbitrários</dt> <dd>O suporte para as APIs <code>setCapture()</code> e <code>releaseCapture()</code> originadas do Internet Explorer foram adicionadas. Veja {{ bug("503943") }}.</dd> <dt><a href="/pt/DOM/Manipulação_do_histórico_do_navegador" title="pt/DOM/Manipulação do histórico do navegador">Manipulação do histórico do navegador</a></dt> <dd>O objeto de histórico de documento existente, disponível através do objeto {{ domxref("window.history") }} agora suporta os novos métodos <code>pushState()</code> e <code>replaceState()</code> do HTML5.</dd> <dt><a href="/pt/DOM/Animações_usando_o_MozBeforePaint" title="pt/DOM/Animações usando o MozBeforePaint">Animações usando o MozBeforePaint</a></dt> <dd>Um novo evento foi adicionado, o qual combinado com o método {{ domxref("window.mozRequestAnimationFrame()") }} e a propriedade {{ domxref("window.mozAnimationStartTime") }}, proporciona uma maneira de criar animações sincronizadas uma com a outra.</dd> <dt>Eventos de toque e multi-toque</dt> <dd>Foi adicionado suporte ao evetos de toque e multi-toque.</dd>
</dl>
<h4>Modificações DOM diversas</h4>
<ul> <li>O "envoltório" de um elemento {{ HTMLElement("textarea") }} agora pode ser controlado a partir do DOM, através do atributo <code>wrap</code> do DOM. {{ bug("41464") }}</li> <li>Os objetos {{ domxref("file") }} do DOM agora oferecem a propriedade <code>url</code>.</li> <li>Suporte para <a href="/En/XMLHttpRequest/Using_XMLHttpRequest#Using_FormData_objects" title="en/XMLHttpRequest/Using XMLHttpRequest#Using FormData objects">FormData</a> para XMLHttpRequest.</li> <li>A propriedade {{ domxref("element.isContentEditable") }} foi implementada.</li> <li>Adicionada a propriedade <a href="/En/DragDrop/DataTransfer#mozSourceNode" title="En/DragDrop/DataTransfer#mozSourceNode"><code>mozSourceNode</code></a> ao objeto <a href="/En/DragDrop/DataTransfer" title="En/DragDrop/DataTransfer"><code>DragTransfer</code></a>.</li> <li>Adicionado o método <a href="/en/DOM/Selection/modify" title="en/DOM/selection/modify"><code>selection.modify()</code></a> ao objeto {{ domxref("Selection") }}; ele permite a fácil alteração da seleção de texto atual ou da posição do cursor em uma janela do navegador.</li> <li>O suporte para o objeto <code>window.directories</code> e para a característica <code>directories</code> de {{ domxref("window.open") }}, qua não são suportadas em nenhum outro navegador, foi  removido. Ao invés dela, use <code>personalbar</code>. {{ Bug("474058") }}</li> <li>A propriedade {{ domxref("event.mozInputSource") }} foi adicionada aos eventos de interface de usuário do DOM; esta propriedade não-padrão permite a determinação do tipo de dispositivo que gerou um evento.</li> <li>O evento {{ domxref("document.onreadystatechange") }} foi implementado.</li> <li>O método {{ domxref("document.createElement") }} não aceita mais a tag nome entre <code>&lt;</code> e <code>&gt;</code> no modo <em>quirk</em>.</li> <li>A propriedade {{ domxref("window.mozPaintCount") }} foi adicionada; ela permite a determinação de quantas vezes um documento foi pintado. Isto pode ser útil no teste de performance de suas aplicações web.</li> <li>O <em>token</em> de língua foi removido de {{ domxref("window.navigator.appVersion") }} e {{ domxref("window.navigator.userAgent") }}. Ao invés deles, use o {{ domxref("window.navigator.language") }} ou o <a href="/en/Content_negotiation" title="en/Content negotiation">Accept-Language header</a>.  {{ Bug("572656") }}</li> <li>O objeto <a href="/en/XMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a> agora expõe a resposta como um <em>array</em> digitado em JavaScript, assim como uma <em>string</em>, usando a propriedade <code>mozResponseArrayBuffer</code> específica do Gecko.</li> <li><a href="/en/DOM/Event/UIEvent/MouseEvent" title="en/DOM/Event/UIEvent/MouseEvent">Eventos de mouse</a> agora incluem uma propriedade <code>mozPressure</code> indicando a quantidade de pressão em dispositivos de entrada sensíveis a pressão, suportados.</li> <li>Os métodos <code><a href="../../../../en/DOM/window.createBlobURL" rel="custom nofollow">window.createBlobURL()</a></code> e <code><a href="../../../../en/DOM/window.revokeBlobURL" rel="custom nofollow">window.revokeBlobURL()</a></code> permitem a criação de URLs blob a qual referencia arquivos locais.</li> <li>O método <code><a href="../../../../en/DOM/DOMImplementation.createHTMLDocument" rel="custom nofollow">DOMImplementation.createHTMLDocument()</a></code> permite a criação de novos documentos HTML.</li>
</ul>
<h3>Segurança</h3>
<dl> <dt><a href="/en/Security/PSC" title="en/Security/PSC">Política de Segurança de Conteúdo (CSP)</a></dt> <dd>A Política de Segurança de Conteúdo (Content Security Policy - CSP) é uma proposta da Mozilla desenvolvida para ajudar web designers e administradores de servidores a especificar como o conteúdo em seus sites interage. A meta é ajudar a detectar e abrandar ataques, incluindo <em>cross-site scripting</em> e ataques de injeção de dados.</dd> <dt><a href="/en/Security/HTTP_Strict_Transport_Security" title="en/Security/HTTP Strict Transport Security">Segurança de Transporte do HTTP Estrito (HTTP Strict Transport Security)</a></dt> <dd>A Segurança de Transporte de HTTP Estrito é uma característica que permite a um website dizer ao navegador que ele deve ser comunicado somente usando HTTPS, ao invés de HTTP.</dd> <dt><a href="/en/The_X-FRAME-OPTIONS_response_header" title="en/The X-FRAME-OPTIONS response header">O cabeçalho de resposta (The X-FRAME-OPTIONS response header)</a></dt> <dd>O cabeçalho de resposta HTTP, X-FRAME-OPTIONS, introduzido no Internet Explorer 8 é agora suportado pelo Firefox. Isto permite a sites indicar quando suas páginas devem ou não ser usadas em quadros (frames), e, em caso afirmativo, se deve ou não restringir isto à mesma origem.</dd> <dt>Mudanças na <a href="/En/User_Agent_Strings_Reference" title="En/User_Agent_Strings_Reference">string de Agente de Usuário (User Agent string)</a> changes</dt> <dd>Como um meio para reduzir a quantidade de dados entropia descartada em requisições HTTP (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=572650">reduce the amount of data and entropy sent out in HTTP requests</a>), a força da criptografia e tokens de linguagem foram removidos pela string do agente de usuário.</dd>
</dl>
<h3>JavaScript</h3>
<p>Para uma visão geral das mudanças implementadas em JavaScript 1.8.5, veja <a href="/pt/Novidades_no_JavaScript_1.8.5" title="pt/Novidades no JavaScript 1.8.5">Novidades no JavaScript 1.8.5</a>. O JavaScript no Firefox 4 terá aderência adicional ao padrão ECMAScript 5.</p>
<h3>Ferramentas para desenvolvedores</h3>
<dl> <dt><a href="/pt/Usando_o_Web_Console" title="pt/Usando o Web Console">Usando o Web Console</a></dt> <dd>A ferramenta Web Console é um depurador útil para ajudar desenvolvedores web, assim como, desenvolvedores de extensões.</dd>
</dl>
<div class="geckoVersionNote">
<p>{{ gecko_callout_heading("2.0") }}</p>
<p>O Console de Erros está inicialmente desabilitado por padrão no Firefox 4. Você pode reabilitá-lo mudando a preferência <code>devtools.errorconsole.enabled</code> para <code>true</code> e reiniciando seu navegador.</p>
</div><h2>Mudanças para desenvolvedores Mozilla e de complementos</h2>
<p>Para dicas úteis sobre a atualização de extensões existentes para o Firefox 4, veja <a href="/pt/Extensões/Atualizando_extensões_para_o_Firefox_4" title="pt/Extensões/Atualizando extensões para o Firefox 4">Atualizando extensões para o Firefox 4</a>. Existem muitas mudanças de chaves que quebram a compatibilidade com complementos existentes, então certifique-se de ler este artigo.</p>
<h3>Módulos de codificação JavaScript</h3>
<dl> <dt><a href="/en/JavaScript_code_modules/Services.jsm" title="en/JavaScript code modules/Services.jsm">Services.jsm</a></dt> <dd>O módulo de código<code> Services.jsm</code> fornece "getters" que tornam mais fácil a obtenção de referências a serviços comumente usados, como o serviço de preferências ou o mediador de janelas, entre outros.</dd>
</dl>
<dl> <dt><a href="/en/JavaScript_code_modules/ctypes.jsm" title="en/JavaScript code modules/ctypes.jsm">JS-ctypes API</a></dt> <dd>A API JS-ctypes torna possível chamar funções de fora da biblioteca compatível com C, sem precisar usar o XPCOM.</dd> <dt><a href="/pt/Complementos/Gerenciador_de_Complementos" title="pt/Complementos/Gerenciador de Complementos">Gerenciador de Complementos</a></dt> <dd>O Gerenciador de Complementos fornece informações sobre complementos instalados, suporte à gerência dos mesmos e fornece maneiras para instalar e remover complementos.</dd> <dt><a href="/en/JavaScript_code_modules/Using#Locating_the_code_module" title="en/JavaScript code modules/Using JavaScript code modules#Locating the code module">Carregando módulos de código a partir de URL chrome:</a> (en)</dt> <dd>Você pode agora carregar módulos JavaScript usando URL <strong>chrome:</strong>, mesmo dentro de arquivos JAR.</dd> <dt>DownloadLastDir.jsm</dt> <dd>O módulo de código <a href="/en/JavaScript_code_modules/DownloadLastDir.jsm" title="en/JavaScript/Code modules/DownloadLastDir.jsm"><code>DownloadLastDir.jsm</code></a> fornece a variável global, a qual contém uma string que pode ser usada para aprender o caminho do diretório no qual ocorreu o último download. Este módulo lida com questões relacionadas a privacidade de navegação do usuário.</dd>
</dl>
<h4>Mudanças diversas aos módulos de código</h4>
<ul> <li>O módulo de código <code>NetUtil.jsm</code> agora oferece o método <a href="/en/JavaScript_code_modules/NetUtil.jsm#readInputStreamToString%28%29" title="en/JavaScript/Code modules/NetUtil.jsm#readInputStreamToString()"><code>readInputStreamToString()</code></a>, o qual permite a leitura de bytes arbitrários de uma "stream" em uma string, mesmo se a "stream" incluir zeros.</li>
</ul>
<dl> <h3>Mudanças no DOM</h3> <dl> <dt>{{ domxref("ChromeWorker") }}</dt> <dd>Um novo tipo de <em>worker</em> para código privilegiado; ele permite o uso de coisas como <a href="/en/js-ctypes" title="en/js-ctypes">js-ctypes</a> de <em>workers</em> em extensões e código de aplicações.</dd> <dt><a href="/pt/DOM/Eventos_de_toque" title="pt/DOM/Eventos de toque">Eventos de toque</a></dt> <dd>Suporte para eventos de toque (não padrões) foi adicionado; isto permite detectar o movimento de múltiplos dedos movendo-se em uma tela ao mesmo tempo.</dd> </dl> <h3>XUL</h3> <h4>Mudanças no elemento tabbrowser</h4> <p>Várias mudanças foram feitas ao elemento {{ XULElem("tabbrowser") }} que causam impactos nas extensões que interagem com as abas.</p> <ul> <li>Os eventos de TabClose/TabSelect/TabOpen (Fechar aba/Selecionar aba/Abrir aba) não levam mais ao elemento {{ XULElem("tabbrowser") }} (gBrowser). Eventos <em>listeners </em>(ouvintes) para estes eventos devem ser adicionados ao gBrowser.tabContainer ao invés de diretamente ao gBrowser.</li> <li>O menu de contexto das abas não mais um filho anônimo do {{ XULElem("tabbrowser") }}. Ele pode portanto ser sobreposto diretamente com <a href="/en/XUL_Overlays" title="en/XUL Overlays">XUL overlays</a>. Ele também pode ser acessado mais diretamente com JS via gBrowser.tabContextMenu. Veja <a class=" external" href="http://www.gavinsharp.com/blog/2010/03/31/accessingmodifying-the-firefox-tab-context-menu-from-extensions/" title="http://www.gavinsharp.com/blog/2010/03/31/accessingmodifying-the-firefox-tab-context-menu-from-extensions/">esta postagem no blog</a> (en) para mais detalhes.</li> <li>A nova propriedade {{ XULProp("visibleTabs") }} foi adicionada para permitir pegar um <em>array</em> das abas visíveis correntemente; isto permite determinar quais abas estão visíveis no conjuto de abas atual. Isto é usado pelo Firefox Panorama, por exemplo.</li> <li>Adicionado o novo método {{ XULMeth2("showOnlyTheseTabs") }}; isto é usado pelo Firefox Panorama.</li> <li>Adicionado o novo método {{ XULMeth2("getIcon") }}, o qual permite pegar o favicon de uma aba sem ter chamar o elemento {{ XULElem("browser") }}.</li> <li>Adicionada a nova propriedade {{ XULProp("tabbrowser.tabs") }}, a qual permite facilmente pegar uma lista das abas em um elemento {{ XULElem("tabbrowser") }}.</li> <li>Os novos métodos {{ XULMeth2("pinTab") }} e {{ XULMeth2("unpinTab") }} permitem que você prenda e desprenda abas (isto é, trocá-las entre serem abas de app ou abas normais).</li> </ul> <h4>Suporte remoto ao XUL removido</h4> <p>XUL remoto não é mais suportado; isto afeta os documentos XUL servidos através de HTTP; além disso, não é mais possível carregar documentos XUL usando URLs <code>file://</code>. Há, entretanto, um recurso de <em>whitelist</em> que pode ser usado para permitir domínios específicos a carregarem o XUL remotamente. O <a class=" link-https" href="https://addons.mozilla.org/en-US/firefox/addon/235281/" rel="external nofollow" target="_blank" title="https://addons.mozilla.org/en-US/firefox/addon/235281/">Remote XUL Manager extension</a> permite o gerenciamento desta <em>whitelist</em>.</p> <h4>Mudanças diversas no XUL</h4> <ul> <li>O atributo {{ xulattr("readonly") }} agora funciona corretamente para campos.</li> <li>O elemento {{ xulelem("resizer") }} agora permite o uso do atributo {{ xulattr("element") }} para especificar um elemento a ser redimencionado, ao invés de redimencionar a janela.</li> <li>O atributo "active" não é mais configurado como ativo em janelas XUL. Ao invés disso, você pode usar a nova pseudoclasse {{ cssxref(":-moz-window-inactive") }} para definir diferentes estilos para as os fundos das janelas.</li> <li>O atributo {{ xulattr("emptytext") }} está agora obsoleto; ao invés dele, você deve usar o {{ xulattr("placeholder") }}.</li> <li>O elemento {{ xulelem("popup") }} não é mais suportado; ao invés dele, você deve usar o {{ xulelem("menupopup") }}.</li> <li>O elemento {{ xulelem("window") }} agora oferece um atributo {{ xulattr("accelerated") }}; quando verdadeiro, é permitido ao gerenciador de camadas por hardware, acelerar a janela.</li> <li>O elemento {{ xulelem("stack") }} agora suporta os atributosl {{ xulattr("bottom") }} e {{ xulattr("right") }}.</li> <li>O atributo {{ xulattr("alternatingbackground") }} para elementos {{ xulelem("tree") }} não é mais suportado; ao invés dele, você pode usar a pseudoclasse {{ cssxref(":-moz-tree-row") }}.</li> <li>O botão de exibição da barra de ferramentas dos favoritos com <em>anonid chevronPopup</em> não é mais anônimo; ele possui um id de <em>PlacesChevron</em>.</li> <li>O elemento {{ xulelem("tabs") }} agora possui a propriedade {{ xulprop("tabbox") }}, substituindo a antiga propriedade <code>_tabbox</code>, a qual está obsoleta (e nunca foi documentada).</li> <li>Elementos XUL {{ xulelem("window") }} agora possuem o atributo {{ xulattr("drawintitlebar") }}; se ele for <code>true</code>, a área de conteúdo da janela inclui a barra de títulos, permitindo desenhar na barra de títulos.</li> <li>Os novos elementos <code>TabPinned</code> e <code>TabUnpinned</code> estão disponíveis, permitindo que você <a href="/en/Code_snippets/Tabbed_browser#Notification_when_a_tab_is_pinned_or_unpinned" title="https://developer.mozilla.org/en/Code_snippets/Tabbed_browser#Notification_when_a_tab_is_pinned_or_unpinned">detecte quando abas são prendidas e desprendidas</a> (en).</li> <li>Os elementos {{ xulelem("tab") }} agora possuem um atributo {{ xulattr("pinned") }}, permitindo que você determine quando uma aba está ou não correntemente presa.</li> </ul> <h3>Armazenamento</h3> <h4>Mudanças diversas na API storage (de armazenamento)</h4> <ul> <li>A interface {{ interface("mozIStorageBindingParamsArray") }} possui agora um atributo <em>length</em> (comprimento) que indica o número de objetos {{ interface("mozIStorageBindingParams") }} no <em>array</em>.</li> <li>O {{ ifandmethod("mozIStorageStatement", "bindParameters") }} agora retorna um erro se a {{ interface("mozIStorageBindingParamsArray") }} especificada estiver vazia.</li> <li>Adicionado o método {{ ifmethod("mozIStorageConnection", "clone") }}, o qual permite a clonagem de uma conexão de um banco de dados existente.</li> <li>Adicionado o método  {{ ifmethod("mozIStorageConnection", "asyncClose") }}, o qual permite fechar ua conexão assíncronamente; você especifica um <em>callback</em> para ser notificado quando a operação de fechamento estiver completa.</li> <li>Adicionado o método {{ ifmethod("mozIStorageConnection", "setGrowthIncrement") }}, o qual permite a especificação da quantidade a qual o arquivo de banco de dados cresce com o tempo, para ajudar o SQLite a reduzir a fragmentação.</li> <li>O erro <code>SQLITE_CONSTRAINT</code> é agora reportado como <code>NS_ERROR_STORAGE_CONSTRAINT</code> ao invés de como <code>NS_ERROR_FAILURE</code>.</li> </ul> <h3>XPCOM</h3> <p>Em adição à mudanças específicas referenciadas abaixo, é importante notar que não existem mais interfaces estáticas. Todas as interfaces são dinâmicas, independente do que a documentação pode dizer. Atualizaremos a documentação com o tempo.</p> <dl> <dt><a href="/pt/XPCOM/Mudancas_no_XPCOM_no_Gecko_2.0" title="pt/XPCOM/Mudancas no XPCOM no Gecko 2.0">Mudanças no XPCOM no Gecko 2.0</a></dt> <dd>Detalhes sobre as mudanças para o XPCOM que causam algum impacto na compatibilidade do Firefox 4.</dd> <dt><a href="/en/Components.utils.getGlobalForObject" title="en/Components.utils.getGlobalForObject">Components.utils.getGlobalForObject()</a></dt> <dd>Este novo método retorna o objeto global com o qual um objeto é associado; ele substitui um caso de uso comum do agora removido <code>__parent__</code>.</dd> </dl> <h3>Places</h3> <ul> <li>Os resultados de consultas no Places podem agora ser vistos por múltiplos observadores eas consultas podem ser executadas assíncronamente. Isto significa que há algumas mudanças nas interfaces {{ interface("nsINavHistoryResult") }}, {{ interface("nsINavHistoryQueryOptions") }}, e {{ interface("nsINavHistoryContainerResultNode") }}. Mais significantemente, a interface {{ interface("nsINavHistoryResultViewer") }} foi renomeada para {{ interface("nsINavHistoryResultObserver") }}.</li> <li>Algumas <a href="/en/Observer_Notifications#Places" title="en/Observer Notifications#Places">novas notificações</a> foram adicionadas para permitir que o navegador controle os processos de desligamento do serviço Places com mais segurança. Destas, a maioria é somente para uso interno, mas o conhecimento da notificação <code>places-connection-closed</code> está disponível quando o serviço Places completa seu processo de desligamento.</li> </ul> <h3>Mudanças na interface</h3> <ul> <li>As interfaces {{ interface("nsIDocShell") }} e {{ interface("nsIWebBrowser") }} agora possuem um novo atributo <code>isActive</code>, o qual é usado para permitir a otimização de caminhos de código para documentos que não estão visíveis correntemente.</li> <li>O método {{ interface("nsIMemory") }} <a href="/en/XPCOM_Interface_Reference/nsIMemory/isLowMemory" title="en/XPCOM Interface Reference/nsIMemory/isLowMemory"><code>isLowMemory()</code></a> foi considerado obsoleto. Ao invés disso, você deve usar <a href="/en/XPCOM_Interface_Reference/nsIMemory#Low_memory_notifications" title="en/XPCOM Interface Reference/nsIMemory#Low memory notifications">notificações "memory-pressure"</a> para ligar com situações de pouca memória.</li> </ul> <h3>Gerenciamento de memória</h3> <dl> <dt><a href="/en/Infallible_memory_allocation" title="en/Infallible memory allocation">Alocação de memória infalível</a></dt> <dd>A Mozilla, agora proporciona alocadores de memória infalíveis que são garantem que não haverá um retorno <em>null</em>. Você deve ler este artigo para aprender como eles trabalham e como solicitar explicitamente a alocação de memória falível versus invalível.</dd> </dl> <h2>Outras mudanças</h2> <dl> <dt>Removido o suporte ao Gopher</dt> <dd>O protocolo Gopher não é mais suportado nativamente. O suporte continuado está disponível pela extensão <a class=" link-https" href="https://addons.mozilla.org/addon/7685/">OverbiteFF</a>.</dd> <dt>Plugin padrão removido</dt> <dd>O plugin padrão foi removido. A pasta de aplicações plugin também foi removida por padrão, entretanto o suporte para a instalação de plugins através desta pasta ainda existe. Veja <a class=" link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=533891">bug 533891</a>.</dd> <dt>Gerenciador de Extensões substituido pelo Gerenciador de Complementos</dt> <dd>O <a href="/en/XPCOM_Interface_Reference/nsIExtensionManager" title="en/nsIExtensionManager">nsIExtensionManager</a> foi substituido pelo <a href="/en/Addons/Add-on_Manager/AddonManager" title="en/Addons/Add-on_Manager/AddonManager">AddonManager</a>.</dd> <dt>Mudanças nos gestos</dt> <dd>A rolagem com três dedos para cima ou para baixo em <em>trackpads</em> foi alterada para, por padrão, abrir e fechar a visão do Firefox Panorama (criado como TabCandy). Para voltar aos comando anteriores de rolagem para cima e para baixo, abra about:config e configure <code>browser.gesture.swipe.down</code> para <code>cmd_scrollBottom</code> e <code>browser.gesture.swipe.up</code> para <code>cmd_scrollTop</code>.</dd> </dl> <h2>Veja também</h2> <ul> <li><a href="/pt/Firefox_3.6_para_desenvolvedores" title="pt/Firefox 3.6 para desenvolvedores">Firefox 3.6 para desenvolvedores<br> </a></li> <li><a href="/Pt/Firefox_3.5_para_desenvolvedores" title="pt/Firefox 3.5 para desenvolvedores">Firefox 3.5 para desenvolvedores</a></li> <li><a href="/pt/Firefox_3_para_desenvolvedores" title="pt/Firefox 3 para desenvolvedores">Firefox 3 para desenvolvedores</a></li> <li><a href="/pt/Firefox_2_para_desenvolvedores" title="pt/Firefox 2 para desenvolvedores">Firefox 2 para desenvolvedores</a></li> <li><a href="/pt/Firefox_1.5_para_Desenvolvedores" title="pt/Firefox 1.5 para desenvolvedores">Firefox 1.5 para desenvolvedores</a></li> </ul> <p>{{ languages( { "en":  "en/Firefox_4_for_developers", "de": "de/Firefox_4_für_Entwickler", "ja": "ja/Firefox_4_for_developers", "zh-tw": "zh_tw/Firefox_4_for_developers"} ) }}</p></dl>
Reverter para esta revisão