reopenWidget lança erro

Dev
1

Estou tentando entender reopenWidget() do Guia para Iniciantes no Desenvolvimento de Temas do Discourse e, quando tento criar um componente de tema com o trecho de exemplo home-logo, recebo Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'offsetHeight') e isso quebra o layout da página. Algo mudou na forma de usar reopenWidget ou estou perdendo alguma coisa?

1 curtida
2

Você se importaria de compartilhar o trecho de código com o qual está tendo problemas?

2 curtidas
3

É apenas isto:

<script type="text/discourse-plugin" version="0.8.13">
api.reopenWidget("home-logo", {
  logo() {
    const { siteSettings } = this,
      { iconNode } = require("discourse/helpers/fa-icon-node"),
      h = require("virtual-dom").h,
      altLogo = settings.Alternative_logo_url,
      altLogoSmall = settings.Alternative_small_logo_url,
      mobileView = this.site.mobileView,
      mobileLogoUrl = siteSettings.mobile_logo_url || "",
      showMobileLogo = mobileView && mobileLogoUrl.length > 0;
    (logoUrl = altLogo || ""),
    (title = siteSettings.title);
    if (!mobileView && this.attrs.minimized) {
      const logoSmallUrl = altLogoSmall || "";
      if (logoSmallUrl.length) {
        return h("img#site-logo.logo-small", {
          key: "logo-small",
          attributes: { src: logoSmallUrl, width: 33, height: 33, alt: title }
        });
      } else {
        return iconNode("home");
      }
    } else if (showMobileLogo) {
      return h("img#site-logo.logo-big", {
        key: "logo-mobile",
        attributes: { src: mobileLogoUrl, alt: title }
      });
    } else if (logoUrl.length) {
      return h("img#site-logo.logo-big", {
        key: "logo-big",
        attributes: { src: logoUrl, alt: title }
      });
    } else {
      return h("h1#site-text-logo.text-logo", { key: "logo-text" }, title);
    }
  }
});
</script>

Que copiei diretamente do exemplo do Guia para Iniciantes em reopenWidget sem alterar nada, para um novo componente de tema sem mais nada nele. (E verifiquei duas vezes que coloquei o código no Cabeçalho).

Tenho alguns outros componentes de tema instalados, mas nada que toque em home-logo. Estou em hospedagem básica aqui, se isso fizer diferença. Pensei que pudesse ser porque eu não tinha um logotipo escuro carregado, mas ainda acontece mesmo com um logotipo escuro carregado.

1 curtida
4

Infelizmente as coisas mudam rápido por aqui.

O problema básico é provavelmente que você copiou o código do guia, em vez de seguir as instruções.

Esta é uma comparação do código que você acabou de compartilhar com o código-fonte atual:

image
image1786×953 145 KB

ou seja, muito diferente! (e, portanto, propenso a quebrar!)

O que você precisa fazer (conforme as instruções) é ir ao código-fonte e copiar o código atual e alterá-lo para atender às suas necessidades.

Em outras palavras, o código no guia está desatualizado, se não as instruções, que ainda são válidas.

2 curtidas
5

Entendi, obrigado! Esta é a minha primeira vez trabalhando com Discourse ou Ember, então ainda estou me familiarizando. Eu tentei fazer o reopenWidget com outra função copiada da fonte atual e não consegui fazer funcionar, mas vou mexer mais um pouco.