1936120 - Enable eslint-plugin-lit

Status: NEW

(Developer Infrastructure :: Lint and Formatting, task)

Description

[Mark Kennedy [:mark]]

We've got some expectations around the styling of Lit syntax. So, to save some time from asking in every patch review, it would be worth enforcing certain style expectations when writing Lit elements. We can do this really easily with eslint-plugin-lit.

We already have ESLint installed on the project, so we'd only need to install/enable the package and add the rules we care about.

For example, one thing that comes up in patch reviews is to remove the surrounding quotes when declaring properties and attributes in Lit templates. Adding the quoted-expressions rule would ensure that this is done before any patch can be approved, without having a reviewer suggesting it in each review.

Comment 1

[Mark Banner (:standard8)]

I think enabling extra rules for Lit is totally reasonable, though I'd defer to the reusable components team to suggest what rules are wanted.

There's details about adding new rules and plugins for ESLint here. I've already checked the licenses - they are all MIT, so we're alright there.

Comment 2

[Mark Kennedy [:mark]]

Attachment: Bug 1936120 - Install eslint-plugin-lit and configuration r=#recomp-reviewers

• Installs eslint-plugin-lit

• Adds configuration

Comment 3

[Mark Kennedy [:mark]]

Attachment: Bug 1936120 - Enforce no quotes around Lit expressions r=#recomp-reviewers

• Enables lit/quoted-expressions rule to enforce that no surrounding
  quotes when expressions are bound to attributes and properties in Lit templates.
  See https://github.com/43081j/eslint-plugin-lit/blob/f71ea1741e0bdbb84ee461f6ca44c33385a6a584/docs/rules/quoted-expressions.md

• Updates all violations to adhere to lit/quoted-expressions rule