No momento, você está visualizando JavaScript quebrando no WordPress 5.5: Mudanças no jQuery

JavaScript quebrando no WordPress 5.5: Mudanças no jQuery

  • Last modified: 5 de agosto de 2024
  • Reading time: 10 mins

Se você atualizou sua instalação do WordPress para a versão 5.5 e viu o código JavaScript do seu site se quebrar em mil pedaços, leia este post e veja o vídeo para entender o que está acontecendo. E não, as mudanças ainda não acabaram.

Como (talvez) corrigir o problema

Como seu sei que você está com pressa, já vou dizer logo a solução (temporária): o plugin Enable jQuery Migrate Helper. Instale-o, ative-o e peça à sua divindade favorita para funcionar.

O plugin também resolve um problema com as traduções de strings em arquivos JavaScript, conforme descrito neste ticket.

O jQuery do WordPress

A versão do jQuery que é distribuída junto com o WP hoje em dia é muito, mas muito antiga. Atualmente o core usa o jQuery 1.12.4, lançado em 20/05/2016. Embora a equipe de segurança tenha se esforçado para manipular o código da biblioteca e mantê-la segura, todo código baseado nesta versão também acaba defasado, criando um efeito em cascata.

Ainda lá em 2016, foi criado um ticket para que se atualizasse o jQuery do core para a versão 3.x, mas a mudança só começou a acontecer este ano (mais uma coisa para a conta de 2020). Já naquela época se sabia que o jQuery só manteria a branch 3.x, mas infelizmente os voluntários não conseguiram levar a questão para a frente.

O jQuery Migrate

Já há bastante tempo, o jQuery possui uma biblioteca auxiliar para tentar manter a compatibilidade de códigos antigos com versões mais atuais do jQuery. O nome desta biblioteca é jQuery Migrate. Assim, se o seu código funciona com o jQuery 1.6, mas você quer atualizar para o jQuery 1.9, você pode fazer isso e instalar o Migrate para não quebrar nada.

Teoricamente, o jQuery Migrate é sempre uma solução temporária. O código incompatível deveria ser reescrito e o jQuery Migrate ser retirado da jogada. Se você está no mundo da programação há tempo suficiente, já dá para imaginar que não é assim que funciona.

Plano de atualização do jQuery do WordPress

No fim de junho deste ano, foi publicado um post no blog do Make explicando o plano de atualização do jQuery no WP. Lá, o autor comenta os passos sugeridos pela própria equipe do jQuery e que serão seguidos pela equipe do WordPress. Este artigo da WP Tavern também aborda o assunto.

Para resumir, fiz essa tabela com as versões do WP e as mudanças implementadas ou sugeridas. Inclui aqui o jQuery UI, porque essa biblioteca também vai ser atualizada.

WordPressjQueryjQuery MigratejQuery UI
5.41.12.4 (05/2016)1.4.1 (05/2016)1.11.4 (03/2015)
5.51.12.41.11.4
5.63.5.1 (05/2020)3.3.0 (01/2018)1.12.1 (09/2016)
5.73.5.11.12.1
As mudanças nas versões do WP 5.6 e 5.7 são, obviamente, planejamentos e podem mudar.

Como testar meu site antes de atualizar?

Para ajudar nos testes, a equipe do WordPress criou um plugin onde é possível alterar estas versões, o Test jQuery Updates. Este plugin pode ajudar tanto donos de sites quanto autores de plugins e temas a identificar futuros problemas antes de atualizar o WordPress.

Lembre-se sempre de que no longo (ou longuíssimo) prazo, a intenção do WordPress é se livrar completamente do jQuery.

Por que usamos jQuery

Para entender um pouco melhor todo esse problema que estamos enfrentando hoje, vale a pena relembrar um pouquinho da história da internet, principalmente do JavaScript.

Há muito tempo atrás, precisamente em 2006, quando a guerra dos navegadores já era entre o Firefox e o Internet Explorer, escrever um JavaScript que rodasse bem em todo lugar era difícil. Surgiu então o jQuery, que resolvia tudo isso para nós: você fazia um código compatível com o jQuery e ele se encarregava de ser compatível entre os navegadores.

Com o tempo, o jQuery foi se tornando o padrão de JavaScript na internet (muitos iniciantes confundiam JS com jQuery, de tão popular que a biblioteca era). Passado mais tempo ainda, o próprio JavaScript amadureceu, os navegadores passaram a usar um padrão e o motivo essencial para usar o jQuery foi praticamente reduzido a zero.

Quem ainda usa o jQuery

No que se relaciona a JS, hoje temos então três grupos de programadores:

  1. Os que se acostumaram a resolver tudo com jQuery e não perceberam como as coisas evoluíram fora dele;
  2. Os que usavam jQuery, mas aprenderam esse JS mais “moderno” e portanto navegam entre os dois mundos e
  3. Os que começaram um pouco depois e nem precisaram se preocupar com a compatibilidade entre os navegadores. Para esses, o jQuery passou a ser só um peso a mais a ser carregado no front end dos sites.

Em 2020, a visão do terceiro grupo é a mais correta: não precisamos mais do jQuery e, quase sempre, estamos carregado uma biblioteca inteira para resolver problemas que o próprio JS sozinho já resolve.

Vanilla JS ou “JS puro” e como se livrar do jQuery

Calma, vanilla JS não é uma nova biblioteca JavaScript. Pelo contrário, vanilla JS é exatamente não precisar de nenhuma biblioteca, mas usar o JavaScript puro.

A intenção final é se livrar do jQuery completamente. O problema é que boa parte do código JS do Painel do WordPress depende do jQuery, então tudo vai precisar ser reescrito. É óbvio que isso não vai acontecer de um dia para o outro.

A dica de ouro aqui é: não use jQuery se você não precisa. Seu código vai funcionar por mais tempo e com menos dependências. Existe muito material legal na internet para ajudar na migração, como, por exemplo, o site You Might Not Need jQuery ou este Gist aqui. Se você olhar com cuidado, as perguntas no Stack Overflow normalmente já são respondidas com JS puro.

Por exemplo, para encontrar elementos:

  • jQuery: $('.meu #incrivel seletor');
  • JS puro: document.querySelectorAll('.meu #incrivel seletor');

Se este post foi útil para você, não se esqueça de compartilhá-lo nas suas redes sociais, assinar o canal no YouTube e a newsletter aqui embaixo!