FYI: textarea behavior is very funky if you try to put HTML inside it rather than using the 'value' attribute
irskep opened this issue · comments
I tried doing this:
import { reactive, html } from 'https://esm.sh/@arrow-js/core';
const data = reactive({value: "123"})
html`
<textarea>${() => data.value}</textarea>
`(document.body);
As you may already know, it doesn't work:
However, the workaround (use the value
attribute) isn't documented in a way that would have pointed me at the correct behavior. I pieced it together from the changelog and an unrelated GitHub issue.
These are the delimiters placed inside the html string by the t
function to help find the places stuff needs to be bound to in the DOM. Since the <textarea>
element looks like an element that takes children, but actually only takes text, the usual way to strip these comments out of the generated DOM don't work I think. This could probably be fixed (or a warning could be introduced) in the fragment
function. Of course I've only just begun reading through the code as an outsider 😅
Hmm, good point....this could use a bit of additional work.