# reopenWidget throws error

**URL:** https://meta.discourse.org/t/reopenwidget-throws-error/254718
**Category:** Development
**Created:** [February 10, 2023, 1:17am UTC](https://meta.discourse.org/t/reopenwidget-throws-error/254718 "2023-02-10T01:17:17Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![asc](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/asc/32/288324_2.png) [@asc](https://meta.discourse.org/u/asc)
#### Post date: [February 10, 2023, 1:17am UTC](https://meta.discourse.org/t/reopenwidget-throws-error/254718/1 "2023-02-10T01:17:17Z")

</div>

I’m trying to understand reopenWidget() from the [Beginner’s Guide to Developing Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-developing-discourse-themes/93648#heading--4-c-6) and when I try to make a theme component with the example home-logo snippet, I get `Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'offsetHeight')` and it breaks the page layout. Has something changed with how to use reopenWidget or am I missing something?

---

<div class="post-metadata">

### Author: ![fzngagan](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/fzngagan/32/259349_2.png) [@fzngagan](https://meta.discourse.org/u/fzngagan)
#### Post date: [February 10, 2023, 10:59am UTC](https://meta.discourse.org/t/reopenwidget-throws-error/254718/2 "2023-02-10T10:59:05Z")

</div>

Do you mind sharing the piece of code you’re having issues with?

---

<div class="post-metadata">

### Author: ![asc](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/asc/32/288324_2.png) [@asc](https://meta.discourse.org/u/asc)
#### Post date: [February 10, 2023, 1:07pm UTC](https://meta.discourse.org/t/reopenwidget-throws-error/254718/3 "2023-02-10T13:07:14Z")

</div>

It’s just this:

```js
<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>

```

Which I copied straight from the [Beginner’s Guide](https://meta.discourse.org/t/beginners-guide-to-developing-discourse-themes/93648#heading--4-c-6) example under reopenWidget without changing anything, into a new theme component with nothing else in it. (And double checked that I put the code into Header).

I have a few other theme components installed, but nothing that touches home-logo. I’m on basic hosting here if that makes a difference. I thought it might be because I didn’t have a dark logo uploaded, but it still happens even with a dark logo uploaded.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [February 10, 2023, 1:44pm UTC](https://meta.discourse.org/t/reopenwidget-throws-error/254718/4 "2023-02-10T13:44:12Z")

</div>

Unfortunately things move fast around here.

The basic problem is probably that you’ve copied the code in the guide, rather than following the instructions.

This is a compare of the code you just shared with the _current_ source code:

 ![image](https://global.discourse-cdn.com/meta/original/4X/9/a/4/9a45369cf849c8e2fa5884d805c89a86d24962c8.png)

ie very different! (and therefore likely to break!)

What you need to do (as per the instructions) is go to the source code and copy the current code and change that to suit your needs.

In other words, the code in the guide is out of date, if not the instructions, which are still valid.

---

<div class="post-metadata">

### Author: ![asc](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/asc/32/288324_2.png) [@asc](https://meta.discourse.org/u/asc)
#### Post date: [February 10, 2023, 3:25pm UTC](https://meta.discourse.org/t/reopenwidget-throws-error/254718/5 "2023-02-10T15:25:34Z")

</div>

Got it, thank you! This is my first time working with Discourse or Ember so I’m still getting a handle on it. I had tried doing reopenWidget with another function copied from current source and couldn’t get it to work, but I will fiddle some more.
