Lit Playground link. Code snippet is there and omitted here to shorten this post.
The @focus
listener’s purpose is to check that specific radio input whenever the target element is focused (clicked or tabbed, etc). The first time I click it it works as expected. However, if I then click (check) another radio input (which works fine) and then click the manual input again, rendering result becomes unmatched with the state. Why? Why does the second and the subsequent operations not behave like the first?
To reproduce, click the manual date <input>
, then click the first radio <input>
, then click the date <input>
again. I expect the last radio to be checked but it is still the first that is checked.