Textarea renders with text "null" when value is null (in Edge)

[abaksha-sc]

Textarea with passed value as null renders with text "null". See the following snippet and compare Chrome and Edge: https://codepen.io/anon/pen/eoaBjj

Expected behavior: render empty textarea

Reproduces on Edge 18.17763

[WebReflection]

I think this is similar to the other bug, and related to domtagger.

I will keep this open until both are fixed.

[WebReflection]

FYI this works in Edge too:

hyperHTML.bind(document.body)`
<textarea rows="3">${value}</textarea>
`;

basically this is a stupid issue in Edge that won't likely ever get fixed.

the bugs boils down to this:

document.body.appendChild(
  document.createElement('textarea')
).value = null;

where even removing the attribute after won't clean the textrea.

I'll think about a solution, but you have at least a workaround

[abaksha-sc]

@WebReflection , I used this, but we need to listen event oninput and in this case another bug of IE found 🙂

When hyperHTML sets value through textContent, IE triggers event oninput. This is a problem for us. IE bug repro: https://jsbin.com/yuqequgudo/1/edit?html,js,output

P.S. We fixed it just through check if value is empty:

hyperHTML.bind(document.body)`
<textarea rows="3" value="${value || ''}"/>
`;

[WebReflection]

Yes, that's another obvious workaround but it fails shortly if you have number 0 or boolean false as value. If that never happens though, you're good to go, otherwise I'd go for value == null ? '' : value ( the eqeq is not a typo, it drops only null and undefined but nothing else )

[WebReflection]

I believe v2.27.0 should've fixed it, please feel free to re-open this bug if that's not the case, thanks.

[abaksha-sc]

@WebReflection , works fine! Thanks