Tenho JavaScript no meu tema (já sou famoso? ;)) que modifica o DOM adicionando elementos via api.decorateCooked(…. Ele insere vários elementos HTML no head.
Também tenho o componente de tema DiscoTOC instalado.
No entanto, adicionar o habitual <div data-theme-toc="true"></div> que o DiscoTOC detecta e expande não gera uma tabela de conteúdo que inclua os elementos que inseri dinamicamente.
Estou pensando que isso pode ser tão simples quanto a ordem de execução… se o DiscoTOC procurar antes do meu JavaScript adicionar mais elementos…
O que determina a ordem de execução quando vários trechos de código JavaScript do tema chamam api.cooked(?
Estou inserindo dentro da postagem, sim. É por isso que suspeito da ordem de execução.
Alguma parte do código determina a ordem de execução… esse é o ponto de alavanca para eu conseguir meu componente antes do TOC. Por exemplo, se for alfabético por nome do componente (ou seja, conforme exibido na lista de componentes na área de administração), posso tentar nomear meu componente de acordo, etc.
Dito isso, você pode definir a ordem dos inicializadores para casos de uso avançados. Posso colocar o DiscoTOC em um inicializador nomeado para que você possa executar seu código antes do DiscoTOC, mas preciso saber o que você está tentando fazer primeiro para dar uma resposta clara.
Suas modificações aqui são baseadas em uma requisição HTTP/AJAX, correto?
Sim, AJAX, mas usando uma chamada síncrona. (Sempre amei o oximoro de AJAX síncrono :^)
Estou sentindo que meu próximo passo é criar um componente adequado — por enquanto, é apenas um j/s colado no Cabeçalho do meu Tema. Depois, posso tentar mexer com um ID cuidadosamente escolhido. “_foo” ou “0-foo” pode ser tudo de que eu preciso.
pelo que me lembro, os Componentes de Tema são avaliados depois dos plugins.
E posso estar enganado, mas eles são carregados em ordem alfabética, então colocar um x- na frente do nome já me ajudou no passado a garantir que um Componente de Tema específico fosse avaliado por último.
Respostas de outros usuários acima sugerem que o nome do componente não afeta a ordem de execução. Acabei de renomeá-los para aa-mycomponent e x-last-DiscoTOC e não funcionou. [DiscoTOC não inclui cabeçalhos adicionados dinamicamente ao DOM — sim, dentro do corpo da postagem]
hmmmmmmm… talvez o que está errado seja mais do que apenas a ordem. Acabei de inspecionar… e as coisas no DOM que eu pensava serem títulos HTML… são na verdade tags DIV com class=\"d-toc-ignore\"
Hora de investigar mais a fundo. Onde foram parar meus títulos?
Bem, eu acho que você poderia provar isso de qualquer maneira tentando um exemplo muito básico.
Crie dois componentes simples, substituindo ou conectando a mesma coisa, talvez um modelo simples com uma pequena diferença, chame um por um nome que comece mais tarde no alfabeto, observe qual acaba substituindo o tema.
Está muito claramente ordenado por nome no código aqui no modelo:
O nome não afeta a ordem de execução. @merefield a linha que você vinculou afeta como eles são exibidos na interface do administrador, mas não é usada para a execução real.
Esta é a linha relevante para a ordem de execução:
Portanto, eles são executados em ordem crescente de ‘id’ no banco de dados.
A única garantia que é portátil entre instâncias do Discourse é que o código do tema é sempre executado antes do código do componente do tema.
Como @Johani mencionou acima, se você precisar executar código após o carregamento de outro componente, a melhor opção provavelmente seria usar um inicializador Ember, que suporta ordenação. Infelizmente, isso não será possível imediatamente neste caso, pois parece que o DiscoTOC não está usando inicializadores Ember. Atualizar o DiscoTOC para usar javascript de vários arquivos (e, portanto, inicializadores Ember) certamente seria pr-welcome
