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

Regression: boolean attributes are no longer removed if value is false if attr name contains a dash #3790

Open
1 task done
rejhgadellaa opened this issue Nov 10, 2022 · 4 comments

Comments

@rejhgadellaa
Copy link

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

Describe the bug

Preact 10.11.1 introduced the following change:

Fix falsy data attributes not working
https://github.com/preactjs/preact/releases/tag/10.11.1

Related issue #3717 and PR #3720

To Reproduce

With preact 10.11.0, the following snippet:

<div data-has-toolbar={hasToolbar} />

would result in either a <div /> with or without the attribute:

<div data-has-toolbar="true" />
<div />

but starting in 10.11.1, it results in:

<div data-has-toolbar="true" />
<div data-has-toolbar="false" />

Expected behavior

I was relying on the old behaviour for style rules so, at least in my use-case, this change could be considered a regression. The following CSS selector now always applies:

div[data-has-toolbar] { /* ... */ }

where previously it would only apply if the prop's value was true.

The old behaviour feels more like HTML spec for boolean attributes/properties, but I'm not sure this applies to data- attributes?

For example, I think element.dataset.hasToolbar will always return a string where boolean properties-derived-from-attributes like element.required and -.disabled will actually return a boolean in javascript.

I can also see how it's worthwhile following React's behaviour here. They've actually recently fixed an issue and adopted Preact's behaviour for boolean attributes without dashes: facebook/react#9230

@krskrs
Copy link

krskrs commented Nov 10, 2022

Hi,
in my case it wasn't a regression, but a fix, as it was causing issues with React MUI which don't occur in react.

@rejhgadellaa
Copy link
Author

@krskrs yeah I can see how this fixes compat with React but at the same time introduces issues for projects that rely on the old behaviour. My main reason for opening this ticket is to point that out and to make sure the team is aware that they didn't just fix a bug (unless the old behaviour truly was unintentional - the fix may still break sites but at least then those sites just relied on the effects of the bug, not actual intended behaviour)

@rburgst
Copy link

rburgst commented Jan 18, 2023

see #3717

@JoviDeCroock
Copy link
Member

@rejhgadellaa We are aware of this and I want to apologise for it, I did not account for this breaking behavior but thinking about it both unit tests and manual dom lookups could have suffered because of it.

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

No branches or pull requests

4 participants