howto-components icon indicating copy to clipboard operation
howto-components copied to clipboard

_upgradeProperty doesn't work

Open Konrud opened this issue 4 years ago • 0 comments

I've tried to implement custom elements myself, your articles on the subject were very helpful. What I've found strange is that _upgradeProperty doesn't work as expected.

 _upgradeProperty(prop) {
      if (this.hasOwnProperty(prop)) {
        let value = this[prop];
        delete this[prop];
        this[prop] = value;
      }
    }

It turns out that, all custom properties that we create in our class are considered to be properties of the __proto__ rather than element's own properties, that's why if (this.hasOwnProperty(prop)) condition never gets satisfied and thus function can be considered useless. Trying to set our custom properties on the this.__proto__ fires the following error Uncaught TypeError: Illegal invocation

You can see it in my custom component's live demo Just head to the example page, open up dev tools, and set debugger in the _upgradeProperty method.

Konrud avatar Jan 15 '21 13:01 Konrud