Open nmattia opened 9 months ago
It looks like lit-analyzer disallows setting ?disabled to an async directive. It will throw no-invalid-directive-binding:
lit-analyzer
?disabled
no-invalid-directive-binding
The 'asyncReplace' directive can only be used within a text binding. 56: ?disabled=${asyncReplace(shouldDisable)} no-invalid-directive-binding
In practice lit (and lit-html) do not seem to have an issue with this, as shown by this playground example:
lit
lit-html
import {html, LitElement} from 'lit'; import {customElement} from 'lit/decorators.js'; import {asyncReplace} from 'lit/directives/async-replace.js'; async function *toggle() { let value = false; while (true) { yield value; value = !value; await new Promise(resolve => setTimeout(resolve, 1000)); } } @customElement('toggle-button') export class Toggle extends LitElement { render() { return html`<button ?disabled=${asyncReplace(toggle())}>click me</button>`; } }
This is a great issue. I can definitely investigate this!
It looks like
lit-analyzer
disallows setting?disabled
to an async directive. It will throwno-invalid-directive-binding
:In practice
lit
(andlit-html
) do not seem to have an issue with this, as shown by this playground example: