Preparando-se para a atualização do Discourse para Ember 5

O Discourse em breve atualizará nossa versão do framework Javascript Ember da versão 3 para a versão 5. A grande maioria do trabalho de preparação está concluída, e muitos sites já estão rodando em Ember 5 (incluindo o Meta!). :ember:

Esta atualização está disponível atrás de uma flag de recurso agora! Esta é a configuração padrão para instalações auto-hospedadas do Discourse a partir de 10 de janeiro. Inicialmente, o suporte ao Ember 3 permanecerá disponível através de uma flag, mas será removido no primeiro trimestre de 2024.

Em nossa hospedagem gerenciada discourse.org, faremos uma implementação gradual da flag nos próximos meses:

:discourse: Nível de hospedagem discourse.org Data de Upgrade
Básico 2023-12-07 :white_check_mark:
Grátis 2023-12-12 :white_check_mark:
Pro 2024-01-15 :white_check_mark:
Business 2024-01-22 :white_check_mark:
Enterprise (caso a caso)

:eyes: O que isso significa para mim e meu site?

Se você está rodando o Discourse sem temas, plugins ou componentes de tema extras… você está pronto! Não precisa fazer nada, ou se preocupar com isso.

Da mesma forma, se você usa apenas temas/plugins oficiais, nós cuidamos de você! Garantiremos que todos os nossos temas, componentes de tema e plugins oficiais estejam preparados e prontos para a atualização.

Para aqueles que usam personalizações de terceiros, seus desenvolvedores devem fazer as alterações necessárias para que você possa continuar a usá-los sem problemas durante esta transição.

No entanto, se você tem temas, componentes de tema ou plugins personalizados que criou ou encomendou para seus sites, este post é para você! Abordaremos como identificar e resolver quaisquer problemas antes da atualização.

:face_with_monocle: Identificando problemas

Todos os problemas de atualização relacionados ao ember-5 podem ser identificados antes da atualização verificando o uso de APIs obsoletas. Nas versões recentes do Discourse (a partir do Discourse 3.2.0.beta4-dev), essas depreciações críticas acionarão um banner de aviso para administradores:

Você pode encontrar mais informações sobre depreciações acionadas no console do desenvolvedor do navegador. Geralmente, é uma boa prática resolver todas as depreciações que você vê. Mas para esta atualização de versão do Ember, as principais a serem resolvidas são:

Ao imprimir depreciações no console, o Discourse tenta identificar o tema/plugin relevante.

Para desenvolvedores e provedores de hospedagem, disponibilizamos algumas ferramentas para identificar depreciações em massa:

  • Ao executar testes QUnit, um relatório é impresso no final com uma lista de todas as depreciações não resolvidas. No GitHub actions, uma versão em markdown disso é adicionada à página de resumo do workflow.

  • Para provedores de hospedagem, temos o plugin discourse-deprecation-collector que incrementa contadores prometheus sempre que depreciações são atingidas em produção.

:technologist: Resolvendo depreciações

Geralmente, a mensagem do console incluirá uma descrição do problema e as etapas necessárias para resolvê-lo. Em alguns casos, eles fornecerão links para recursos externos como o site Ember deprecations ou o Discourse Meta.

Se algo não estiver claro, sinta-se à vontade para postar abaixo ou em um tópico dedicado de Dev e faremos o nosso melhor para ajudar.

:rocket: Testando no Ember 5

Para testar no Ember 5 em um ambiente de desenvolvimento local, você pode iniciar nosso helper ember-cli com a variável de ambiente EMBER_VERSION. Por exemplo:

EMBER_VERSION=5 bin/ember-cli -u

Para confirmar que as coisas estão funcionando como esperado, verifique a versão do Ember que o Discourse imprime no console do navegador.

Em produção, você pode conseguir o mesmo adicionando EMBER_VERSION: 5 à seção env: do seu arquivo app.yml.

42 curtidas

Parabéns equipe, isso deve ter dado MUITO trabalho! :sweat_smile:

11 curtidas

David, presumo que isso seja totalmente reversível com uma reversão desse atributo e uma reconstrução?

5 curtidas

Sim, totalmente reversível :+1:

3 curtidas

Bom trabalho, pessoal. Como encontro uma lista de temas/componentes oficialmente suportados? Consegui descobrir que 3 ou 4 dos meus componentes de plugin são oficiais. (A tag “oficial” está listada no tópico)

Mas para o 4º, só consegui encontrar este URL: GitHub - discourse/discourse-full-width-component: Make Discourse occupy the full browser width

Como posso saber se é oficial / não vai quebrar a atualização?

Editar: parece que posso filtrar aqui: Topics tagged official

Em seguida, procure um tema específico na lista. Anteriormente, tentei pesquisar no canto superior direito dos fóruns.

Quando pesquiso a lista de tópicos, ela não é listada, mas vejo funcionários como contribuidores do GitHub:

4 curtidas

Como um guia muito geral, se o URL começar com github.com/discourse/, nós cuidaremos disso. No caso do discourse-full-width-component, não vejo motivo para preocupação - ele deve funcionar bem com o Ember 5.

6 curtidas

Existe uma maneira de saber se um site hospedado no Discourse em que sou administrador está rodando o Ember 5?

Dei uma olhada na página de administração e não vi nenhuma indicação disso. O site em que sou administrador é

5 curtidas

No momento, o Ember 5 está rodando no Meta e em nosso nível básico de hospedagem.

Nas versões recentes do Discourse, imprimimos as informações da versão atual no console. Portanto, você pode abrir o console de ferramentas do desenvolvedor e verificar a primeira linha:

10 curtidas

Você tem acesso às ferramentas de desenvolvedor em todos os sites da internet! No Windows/Linux no Chrome, você pode pressionar a tecla F12. Para Mac, está em . . . algum menu.

8 curtidas

Obrigado.

Eu estava pensando que significava o console do Discourse ao qual se tem acesso se você instalar o site no prompt de comando do sistema operacional.


Passos

  1. Abra o navegador de Internet (Chrome para este exemplo)
  2. Navegue até o site do Discourse (https://swi-prolog.discourse.group/ para este exemplo)
  3. Pressione F12
  4. Se a aba Console no topo não estiver ativa, selecione a aba Console.
  5. A primeira linha deve indicar a versão do Ember.

4 curtidas

E se alguém estiver tentando fazer coisas no iPad, o console pode ser encontrado (apenas no Safari) por meio de um aplicativo:

https://apps.apple.com/app/id1064318327

Ah, não está mais disponível. Que pena.

5 curtidas

Adorei essa adição. Ótimo trabalho nisso, David e equipe ModernJS. :rocket:

heh. você pode rodar o Chrome no MacOS e as ferramentas do desenvolvedor são as mesmas. É o iOS e as telas sensíveis ao toque que tornam difícil/quase impossível de usar (ou seja, o iPad no modo desktop tem um inspetor web, mas não é ideal).

5 curtidas

Pressionando F12? Eu pensei que sabia que isso não funcionava.

5 curtidas

optioncommandJ

5 curtidas

Não sei como isso é mais difícil de lembrar do que F12. Ambos são praticamente indescobríveis, no entanto. E talvez procurar em um menu, como eu sugeri, não ajudaria.

6 curtidas

option command J deve ser fácil de lembrar para você :laughing:

5 curtidas

Meu preferido é sempre [clique com o botão direito] [inspecionar elemento] - acho que isso é consistente para todos os navegadores/sistemas operacionais

6 curtidas

Certo!

Ah. Isso é fácil e sempre funciona. Bom. E me poupa um monte de cliques, já que é isso que você quer fazer com tanta frequência. Claro, parece que eu sequestrei este Announcements. Desculpe.

7 curtidas

Sei que isso vai me custar algum tempo de desenvolvimento :grimacing: (nova barra lateral, remoção de selos de categoria… é bem frequente - ter um tema personalizado é caro!).

Existe alguma maneira de atualizar para o Ember 5 no meu fórum sem quebrar tudo em produção? Estou no Plano Business hospedado.

  • Obrigado pelas informações e pelas mensagens de deprecação, de qualquer forma. Mas ao corrigir a deprecação, tenho que codificar meu tema tanto para Ember 3 quanto para Ember 5?
  • Temos a opção de atualizar ou não? Ou vocês são os únicos a decidir?

Algum tipo de ambiente “preprod” ou “teste” seria bom, eu acho.

6 curtidas

Olá Damien :wave:.

O Discourse e o Ember só depreciam coisas quando há uma alternativa disponível para uso imediato. Portanto, se houver alguma alteração que você precise fazer, ela poderá ser feita imediatamente e funcionará com o Ember 3.

Essa é a abordagem que estamos adotando no core do Discourse e em todos os nossos temas e plugins oficiais. Não estamos criando código separado para Ember 3 / Ember 5.

Receio que não seja opcional. Manter as dependências do core do Discourse atualizadas é essencial para nós em termos de segurança, desempenho e recursos. Os recursos que o Ember 5 oferece se tornarão essenciais para futuras melhorias no próprio Discourse.

Essa é uma boa pergunta! Estamos trabalhando muito no momento para tornar essa transição o mais tranquila possível e estamos desenvolvendo várias melhorias nas ferramentas.

Uma dessas melhorias foi implementada há algumas horas e deve ajudá-lo aqui.

Se você acessar /safe-mode em seu fórum, agora haverá uma caixa de seleção para “Fazer com que as depreciações de Javascript gerem um erro”.

Isso permitirá que você veja com segurança como seu site funciona com todas as depreciações pendentes convertidas em erros.

Tecnicamente, isso não é exatamente o mesmo que “Testar o Ember 5 no fórum”. Mas é uma boa maneira de simular as próximas alterações que quebram a compatibilidade sem a necessidade de um ambiente de staging totalmente separado.

8 curtidas