Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Uncaught Error: Component's "only-when-overflow" property should be a function, but got [boolean] instead #4085

Open
1 task done
Unluckynerd opened this issue Aug 2, 2023 · 7 comments · May be fixed by #4121
Open
1 task done

Comments

@Unluckynerd
Copy link

Unluckynerd commented Aug 2, 2023

  • Check if updating to the latest Preact version resolves the issue

Describe the bug

I'm using a custom web component called my-tooltip and there's a boolean attribute called only-when-overflow.When using the only-when-overflow attribute i'm getting the below error.

Uncaught Error: Component's "only-when-overflow" property should be a function, but got [boolean] instead
<my-tooltip only-when-overflow="true" for="a1a1">..</my-tooltip>

To Reproduce

We usually use a attribute which starts with on to handle events eg: onClick, onKeyPress which requires function. Here I'm using a boolean attribute which starts with on and the error thrown

@JoviDeCroock
Copy link
Member

JoviDeCroock commented Aug 2, 2023

Gotcha, this is caused by our function check here instead we could check whether the third character is an uppercase-letter by doing name[3] === name[3].toUpperCase() or check whether either the old or new value is a function 😅

@marvinhagemeister
Copy link
Member

@JoviDeCroock Wondering if we could limit the warning only to native HTML elements. Like check only do the check if the element name doesn't have a - character in the name.

@JoviDeCroock
Copy link
Member

@marvinhagemeister
Copy link
Member

Ohh I mistakenly thought it would only affect the debug check. Doing .indexOf everytime could be a bit expensive. The uppercase check won't be reliable enough either as Preact also allows lowercase events despite those not being included in the typings I think.

I'm not sure what the best path forward is. It's really unfortunate that custom elements don't seem to give you a way to check what properties they expose.

@JoviDeCroock
Copy link
Member

@Unluckynerd

This comment was marked as off-topic.

@kalai51

This comment was marked as off-topic.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants