[Failing Test] {{on}} modifier removes valueless attributes

[kturney]

Noticed today that using the {{on}} modifier on an element with the required attribute removed the attribute.

e.g.
template: <input type='text' required {{on 'input' this.onInput}} >
resulted in
DOM: <input type='text' >

However, adding a value to the attribute caused it to remain.

e.g.
template: <input type='text' required='true' {{on 'input' this.onInput}} >
resulted in DOM
DOM: <input type='text' required >

While adding a failing test for required, I also added checks for other boolean attributes.
autofocus, required, and disabled are all removed, while readonly is preserved.

I believe the problem is with the {{on}} modifier because
template: <input type='text' required >
results in
DOM: <input type='text' required >.

I looked through the {{on}} modifier source and nothing jumped out at me, so maybe it isn't directly an {{on}} problem though?

Side Note:
I made the disabled element a button to show that it is not only input that is affected.

[pzuraq]

This appears to occur with any modifier except {{action}}, which leads me to believe this is a VM issue.

[chancancode]

We can fix it with an AST transform until we finish the upgrade, which can also be backported to LTS

[rwjblue]

VM upgrade is finished...

[kturney]

seems the same as #18712

[rwjblue]

Can you confirm that this is not about boolean attributes, but is actually about valueless attributes (which are often boolean, 😸)?

[kturney]

Would adding a video element with a controls attribute to the test confirm this? I didn't realize there was a distinction.

[rwjblue]

@kturney ya, any attribute would do, even something like <button data-foo {{on 'click' this.wahtever}}>Click Me!</button>. If that works or not will point towards different types of fixes needed...

[kturney]

@rwjblue I added a video element with a controls attribute to the test.

[kategengler]

Is this still relevant?