Issue with polyfills

[fredyagomez]

@treshugart I am facing the issue described here using skatejs/web-components https://github.com/webcomponents/webcomponentsjs/issues/777

I think this same issue was discussed/fixed in cloudyDOM https://github.com/skatejs/cloudydom/pull/6

Is this change already pushed to skatejs/web-components or how do we get this fix implemented?

[fredyagomez]

@treshugart I guess my library was outdated.

[treshugart]

Hey @fredyagomez, thanks for responding and closing. Sorry I didn't respond earlier. So much work has gone into the webcomponentsjs polyfills since starting this repo, I want to start recommending people use that and the loader they've written there: https://github.com/webcomponents/webcomponentsjs.

[fredyagomez]

@treshugart thanks. When doing to migration, I start getting this error "Failed to construct 'HTMLElement': Please use the 'new' operator" I saw an issue before referring to a shim that was included in skatejs/webcomponent but can't recall this.

Also, maybe I have wrong link to documentation, but prop does not work the same. Where can I declare props and the respective defaults? if you have the link for the documentation for 5.x I can take a look there.

static get props() {
    return {
      variable: prop.boolean({
        attribute: true,
        default: false
      })
  }
}

[treshugart]

Try using props.boolean (not a function anymore). attribute defaults to { source: true } (one-way binding). The default is already false.

If you need to mix in stuff:

{ ...props.boolean, ...{ attribute: true } }

You must also now assign a prop. Getters behave oddly and require ordered initialisation which adds to the weirdness. Setters are much easier to implement and reason about.

class MyComponent extends withComponent(withPreact)) {
  static props = {
    variable: props.boolean
  };
}

// or
MyComponent.props = {};

See the new README in the 5.x branch. The code example there uses the new APIs.