Stencil: <input list=*> not parsing correctly

Created on 31 May 2019 · 5Comments · Source: ionic-team/stencil

Stencil version:

 @stencil/[email protected]

I'm submitting a:

[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://stencil-worldwide.herokuapp.com/ or https://forum.ionicframework.com/

Current behavior:
<input> list attribute not parsing correctly when inside a Stencil component.

Steps to reproduce:

Create a new component library proyect with npm init stencil.
Replace MyComponent render() with

render() {
    return (
      <div>
        <input list="list" />
        <datalist id="list">
          <option value="1" />
          <option value="2" />
          <option value="3" />
        </datalist>
      </div>
    );
  }

Rendered code will be

Note that list="list" is gone from rendered code.

Other information:

Have tried with both:

shadow: true
shadow: false

If used inside index.html like this

<body>
  <input list="list" />
  <datalist id="list">
    <option value="1" />
    <option value="2" />
    <option value="3" />
  </datalist>
</body>

Behaviour works as expected