Posts Tagged 'javascript'

Nunca use o método Date.getYear() do Javascript

Post movido para: http://blog.guilhermegarnier.com/2010/01/29/nunca-use-o-metodo-date-getyear-do-javascript/

Até a década de 1990, era muito comum escrevermos datas com apenas 2 dígitos representando o ano (ex: 1996 -> 96). Como todos já sabem, esta prática levou ao famoso bug do milênio, pois, desta forma, o ano 2000 tornava-se 0 (ou 100, dependendo do caso), gerando uma série de problemas, especialmente em códigos que calculavam um período entre duas datas. Felizmente, hoje em dia não temos mais esta preocupação. Ou temos?

Outro dia fui testar um sistema em diversos browsers, e ao realizar o teste no Opera, verifiquei que o componente inputCalendar do Tomahawk abria no ano de 3910. Testei no Firefox, Google Chrome e Internet Explorer 6, 7 e 8, e todos eles funcionavam corretamente. Resolvi olhar o código fonte do componente, e descobri que ele verificava o ano atual usando o método getYear da classe Date. Este método é fonte de diversos problemas e gambiarras em códigos Javascript que manipulam datas. O motivo é que diferentes browsers interpretam o método de maneiras diferentes. De acordo com a especificação ECMA-262, a função getYear deveria retornar o ano atual menos 1900. Nas versões mais recentes, o Firefox e o Google Chrome seguem esta especificação, retornando 110 para o ano de 2010. Já o Opera e o IE retornam 2010, contrariando a especificação e gerando os problemas já conhecidos. É muito comum encontrarmos códigos que verificam qual é o browser (com comentários condicionais ou verificações por Javascript) e, quando não for o IE, somando 1900 ao valor retornado pelo getYear. Esta verdadeira gambiarra não resolve completamente, pois, como já citado, o Opera se comporta da mesma forma que o IE.

A solução ideal para este problema é substituir o método getYear por getFullYear. Este método retorna o ano completo, com 4 dígitos, em todos os browsers, eliminando qualquer necessidade de verificação de browser. Esta recomendação, inclusive, faz parte da especificação ECMA-262, na página 242:

The getFullYear method is preferred for nearly all purposes, because it avoids the “year 2000 problem.”

Após corrigir este bug do Tomahawk, abri uma issue no Jira do projeto, anexando um patch para corrigir o problema.

Outras Referências:

Anúncios

Extensões do Firefox recomendadas para desenvolvedores web

Post movido para: http://blog.guilhermegarnier.com/2009/01/06/extensoes-do-firefox-recomendadas-para-desenvolvedores-web/

Quase todo usuário de Firefox que tem um blog já postou uma lista de extensões recomendadas. Chegou a minha vez! Sei que muitas aqui já são velhas conhecidas da maioria, mas acho interessante ressaltar a importância. Hoje em dia é difícil imaginar o desenvolvimento web sem o auxílio do Firefox. Segue abaixo a lista de extensões que eu recomendo:

  • Firebug
    Como não poderia deixar de ser, o primeiro da lista, e totalmente indispensável, é o Firebug. Seria até exagero chamá-lo de extensão, pois o Firebug é uma verdadeira plataforma para debug de aplicações web. Com ele é possível, além de inspecionar visualmente o código HTML, seja diretamente pelo código, seja selecionando o componente visual associado a ele, é possível modificar o código, alterando, excluindo ou incluindo tags, e o resultado aparece em tempo real. O mesmo pode ser feito com os códigos Javascript e CSS da página. Há também um console para debug; é possível utilizar o comando console.log(“texto”) no seu código Javascript, e durante a execução, o texto será exibido no console do Firebug. Também é possível visualizar o resultado de todas as requisições, incluindo arquivos carregados (imagens, arquivos CSS, Javascript e Flash) e chamadas assíncronas (Ajax), exibindo o cabeçalho da requisição, o resultado, o tamanho do arquivo e o tempo de resposta. Esta extensão é tão poderosa que há extensões para ela, como o YSlow, do Yahoo, que exibe estatísticas de desempenho da página.

    Como o Firebug é só para Firefox, foi lançada uma versão Lite que também funciona com IE, Opera e Safari. Nunca testei esta versão, porém acredito que seja uma boa alternativa para debugar problemas que aconteçam num destes browsers mas não no Firefox. Nesse mesmo link é disponibilizada uma versão do Firebug Lite como bookmarklet. Basta arrastar o link para a barra de bookmarks do Firefox para poder utilizá-lo sem precisar instalar o Firebug.

  • Web Developer
    Esta extensão é uma das mais úteis no desenvolvimento web. Entre as opções disponíveis, ela permite visualizar o CSS da página, cookies, bloquear imagens e muitas outras funções.
  • Poster
    O Poster é uma extensão simples, porém muito útil para testar Web Services. Ele exibe uma janela com opções para digitar a URL de destino, o tipo de requisição (GET, POST, PUT ou DELETE), o body e os parâmetros. Feita a requisição, é possível visualizar a resposta recebida.
  • JavaScript Debugger
    Extensão muito poderosa, que exibe uma janela listando todos os arquivos Javascript da página atual. Pode-se definir breakpoints no código e executá-lo passo a passo, verificar e alterar valores de variáveis e tudo o que se espera de uma ferramenta de debug.

    Javascript Debugger

    Javascript Debugger

  • Greasemonkey
    Uma das extensões mais conhecidas, permite criar scripts usando Javascript para modificar o comportamento de sites específicos. O site Userscripts.org possui centenas de scripts pré-definidos para vários sites conhecidos. Com o Greasemonkey, você pode até mesmo ajudar a Vivo a adicionar suporte a HTML no Firefox.
  • Greasefire
    Extensão que adiciona ao Greasemonkey uma funcionalidade de busca automática de scripts para o domínio atual no Userscripts.org. Ao clicar no ícone do Greasemonkey, aparece uma nova opção no menu, que, ao ser selecionada, exibe em uma nova janela a lista de scripts encontrados.
  • CSSViewer
    O CSSViewer exibe todas as propriedades CSS dos elementos da página atual num div flutuante, conforme o cursor do mouse é movido pela tela.
  • X-Ray
    Mais uma extensão simples e útil. O X-Ray permite visualizar o código fonte de uma página sobre a própria. Desta forma, as tags HTML se misturam aos elementos da página, permitindo visualizar exatamente onde se localiza cada elemento do fonte, apesar de a visualização ficar um pouco confusa.
  • Live HTTP Headers
    Exibe numa janela os cabeçalhos HTTP de cada requisição, auxiliando na verificação de erros de rede. As informações dos cabeçalhos também podem ser exibidas numa barra lateral, e as URLs das requisições que serão analisadas podem ser definidas como expressões regulares.

    Live HTTP Headers

    Live HTTP Headers

  • Aardvark
    Esta extensão permite excluir elementos da página com um clique. É muito útil para acessar sites muito poluídos, com excesso de elementos na tela, ou quando há algum elemento sobrepondo outro, no caso de erros de visualização de sites que não foram testados no Firefox. Também pode ser utilizado para remover elementos desnecessários antes de imprimir uma página.
  • MeasureIt
    Exibe uma régua para contagem de pixels de um elemento. Útil para ajustes finos no design.
  • JSView
    Exibe um ícone no rodapé do Firefox. Ao clicar nele, é possível visualizar automaticamente todos os arquivos CSS e Javascript da página atual. Pouco útil caso você já utilize o Firebug.
  • ErrorZilla Mod
    Quando uma página estiver inacessível, esta extensão exibirá uma tela alternativa de erro, com opções para consultar esta página no Google Cache, tentar ping e trace, entre outras opções.

    ErrorZilla Mod

    ErrorZilla Mod

  • CheckBoxMate
    Permite marcar vários checkboxes de uma vez, através de drag & drop. Esta extensão não tem qualquer relação com desenvolvimento web, mas resolvi incluir na lista pois acredito que pode ser útil, por exemplo, quando se deseja selecionar vários emails no seu webmail.
  • Stylish
    Praticamente um Greasemonkey para CSS. Permite criar folhas de estilo para URLs específicas e pesquisar no Userstyles.org por estilos pré-definidos para o domínio atual.
  • ColorZilla
    Permite descobrir o código RGB da cor do elemento atual, fazer zoom de até 1000% na página (para facilitar a seleção de um elemento específico) e selecionar cores numa paleta, entre outras opções.
  • PDF Download
    Converte páginas Web para PDF, além de permitir selecionar a ação desejada ao clicar em um arquivo PDF (download, abrir com o programa padrão, abrir no browser).

Além de muitas extensões úteis, existem outras nem tanto. A extensão mais inútil para Firefox, na minha opinião, é o Fast Close Tabs: você acha irritante ter que clicar no X à direita de uma aba para fechá-la? Com esta extensão, você pode fechá-la clicando no X da própria janela do Firefox!

Finalizando, um site que acho muito interessante é o Firefox Facts, que traz muitas dicas sobre o Firefox, principalmente sugestões de novas extensões e temas.


@guilhermgarnier

Erro: o Twitter não respondeu. Por favor, aguarde alguns minutos e atualize esta página.

Estatísticas

  • 58,442 hits
Linux Counter