elm / virtual-dom

The foundation of HTML and SVG in Elm.
https://package.elm-lang.org/packages/elm/virtual-dom/latest
BSD 3-Clause "New" or "Revised" License
209 stars 80 forks source link

`checked` property not forcefully re-applied when it didn't change #117

Closed zwilias closed 6 years ago

zwilias commented 7 years ago

SSCCE: https://ellie-app.com/fkx4NH5Z3a1/0

When a view is re-rendered after an event, and a checkbox's checked property does not change, it will not be re-applied. We currently do forcefully reapply the value property, presumably for the same reason.

It is surprising that this is special-cased for value, but not checked.

For reference, this is worked around for value in 2 places:

Note: this can be worked around with Keyed by bumping a counter so Elm doesn't reuse the DOM-node. It's a weird workaround, given that it works intuitively for input [ value ... ].

process-bot commented 7 years ago

Thanks for the issue! Make sure it satisfies this checklist. My human colleagues will appreciate it!

Here is what to expect next, and if anyone wants to comment, keep these things in mind.

gyzerok commented 7 years ago

Here is a bit bigger example of how it happens in my real world app: https://ellie-app.com/pdtdmyRtDa1/1

Reproduce:

  1. Check 2
  2. Click button
aforemny commented 6 years ago

I have hit the same problem with a <select>'s selectedIndex property.

kjarnet commented 6 years ago

Thanks for the Keyed workaround, and to @aforemny for describing the problem with Html.selects, which let me find this issue!

Recently coming to Elm from React, I expected Html.select to work like a React "controlled component", as Html.input does, and, when it didn't, struggled a lot (including trying preventDefault, as @aforemny also mentions) before finding this issue and workaround. So +1 from me for fixing this in virtual-dom - both for Html.checkbox, and for Html.select!

evancz commented 6 years ago

Thank you for the report @zwilias! LMK if the fix looks correct to you.