Discussion: Add syntactic sugar for boolean attribute bindings to Template Engine.

[theengineear]

Authors can already leverage a boolean updater to accomplish a boolean attribute binding. Adding syntactic sugar may potentially be a more ergonomic solution.

Why we might add it:

• It may be expected behavior at this point (as it exists in other templating engines)
• We have leveraged this syntactic sugar in the past, so there’s some precedent for us.

Why we might not add it:

• It’s redundant — you can already achieve this behavior.
• It adds complexity / size to the base element.
• It adds an additional runtime check — this may or may not be a performance drawback.
• Conceptually, it blurs the lines between “what to do” and “how to do it”. We may not want to cross that line.

Proposal

Users would be able to declare something like the following to bind an attribute as a boolean (see the ? in there?):

static template(html) {
  return ({ trueOrFalse }) => {
    return html`<div ?data-true="${trueOrFalse}">Hi There.</div>`;
  };
}

Currently

…for comparison, this is how you would do this currently.

static template(html, { boolean }) {
  return ({ trueOrFalse }) => {
    return html`<div data-true="${boolean(trueOrFalse)}">Hi There.</div>`;
  };
}

Note that the what to do (i.e., bind an attribute) is nicely separated from the how to do it (i.e., in a boolean fashion).

[theengineear]

I’m on the fence for this one. At a minimum, I’d like to start without support for the ? sugar. One of the main goals of x-element is to stay minimal — this functionality is strictly not necessary.

Additionally, I think that using boolean is more favorable since it exposes users to what’s really going on and will better-prepare them for leveraging things like defining a custom updater later.

[theengineear]

@klebba — Based on our conversation, we've decided to go with the ? syntax and not expose the a boolean updater.