New line always added to textarea and other elements for single line/delimited HTML blocks

[maximilianschmitt]

Hi, in Marko 4.2.1 a newline is inserted and my cursor jumps to the end of the textarea on every input if I try to bind its value to the state:

custom-input.marko

class {
  onChange(e) {
    this.emit('change', e.target.value)
  }
}

div
  textarea key='input' on-input('onChange') value=input.value -- ${input.value}
  p
    strong -- ${input.value}

If I remove the strong tag that outputs input.value it works fine. If I use an input instead of the textarea it works fine as well. If I remove the ${input.value} from the textarea's body it works as well but then the initial input.value isn't shown.

The code is server-rendered so I'm guessing that this has to do with serialisation maybe?

Full code: https://github.com/maximilianschmitt/lasso-test

Thanks for your help!

[gilbert]

The value attribute is not valid for a <textarea> tag – I suggest removing that.

[maximilianschmitt]

Thanks for your feedback @mindeavor. I'm removing value but this does not fix the issue unfortunately.

[patrick-steele-idem]

I haven't had a chance to verify, but it appears that the \n in the concise line is being preserved by the parser and added to the textarea body for every render. A temporary workaround would be to use the HTML syntax for the <textarea> tag:

div
  <textarea key='input' on-input('onChange')>${input.value}</textarea>

We'll investigate a fix in Marko. Thanks for reporting the problem.

[maximilianschmitt]

Hey @patrick-steele-idem! Thank you for your help. I can verify that your proposed workaround of using the HTML syntax works. :)