Como executar código após a renderização da página

Quero remover os parênteses de span.category-topics--posts-count (renderizado por GitHub - discourse/discourse-right-sidebar-blocks). Estou tentando esta chamada api.onPageChange(), mas ela não está obtendo nenhum countSpans, acho que porque está sendo executada antes que o outro componente de tema os coloque na página.

O que posso fazer? :crying_cat:


  api.onPageChange(() => {
    console.log("página alterada");

    const countSpans = document.querySelectorAll(
      "span.category-topics--posts-count"
    );
    console.log("spans", countSpans);
    countSpans.forEach((span) => {
      const currentText = span.textContent.trim();
      const newText = currentText.replace(/[()]/g, "");
      span.textContent = newText;
      const number = parseInt(newText);
      if (isNaN(number)) {
        span.style.padding = "0px";
      } else if (number < 10) {
        span.style.padding = "0px";
      } else {
        span.style.padding = "0px 3px";
      }
    });
  });
});
2 curtidas

Eu não acredito que isso vá funcionar.

Você deve fazer essas coisas via CSS ou dentro do loop de execução do Ember.

O que impede você de fazer um fork daquele componente e personalizá-lo ao seu gosto com um nome diferente, carregando um componente de Tema separado e, então, adicionando-o pelo nome no RSB?

2 curtidas

Preguiça, na maioria das vezes. E quando comecei, seria apenas um pouco de CSS que provavelmente seria estático e eles não precisariam manter o fork, mas sim, agora é obviamente bobagem não fazer um fork.

Obrigado

4 curtidas

Este tópico foi automaticamente fechado 30 dias após a última resposta. Novas respostas não são mais permitidas.