Closed pinguxx closed 1 year ago
Not sure if this helps, but if I pull out the "onclick" and declare it as a function first and then call the function there's a different error. Hope you get your issue fixed.
import HyperHTMLElement from 'hyperhtml-element/esm';
//describe the element
function onclick(e) {
this.setState({
awesome: !this.state.awesome
});
};
class CustomElement extends HyperHTMLElement {
static get observedAttributes() {return ['attr1']; }
static get booleanAttributes() { return ['active']; }
created() {
this.attachShadow({mode: 'open'});
this.render();
}
attributeChangedCallback(name, oldValue, newValue) {
console.log(`attr ${name} changed to ${newValue}`);
this.render();
}
render() {
this.html`
<ul>
<li>My hyper content: ${this.attr1}</li>
<li>active: ${this.active}</li>
<li onclick=${this}>current awesome state ${this.state.awesome}
<ul>`;
}
get defaultState() {
return {
awesome: false
}
}
onclick(e);
}
// Define the element
CustomElement.define('custom-element');
const els = document.querySelectorAll('custom-element');
els[0].setAttribute('attr1', 'new');
els[1].removeAttribute('active');
The problem is not the code, it works regularly or even in codepen https://codepen.io/pinguxx/pen/KxqgWG?editors=0010 Not sure why the compiler in stackblitz is complaining about the onclick function
Apologies that we were unable to address this issue in a timely manner!
Given that we have millions of free users this has been a challenge, and we are working to improve over time. As part of an effort to focus on driving the most recent issues to resolution, this issue is being closed.
If this issue is still meaningful, please comment with an update and re-open the issue for troubleshooting! Thanks for your continued loyalty to the StackBlitz platform over the years!
This should be valid https://stackblitz.com/edit/intermediate-ce-06-3jugid?file=index.js Not sure why i get the illegal invocation, onclick its just a regular function inside the class, any pointers on what should i do?