Introduction
On the time of this writing, this characteristic is offered in ember-template-lint@3.0.0-beta.3.
The brand new todo characteristic within the ember-template-lint addon gives a brand new choice to the present states for linting guidelines.
With this new performance, linting points will be transformed right into a todo and builders can strategically plan the work to resolve points in current code. A todo will be set to mechanically turn out to be a warning, then an error with using a supporting characteristic referred to as decay days.
Beforehand, operating the lint:hbs script (default in an Ember app) would trigger ember-template-lint to run on the entire .hbs recordsdata, and return a consequence that included variety of warnings and variety of errors discovered.
Now, nonetheless, we now have a brand new possibility—we are able to additionally embrace variety of todos. First, replace the lint:hbs script within the package deal.json file to make use of the --include-todo flag (we need to be reminded that we now have todos!):
"lint:hbs": "ember-template-lint . --include-todo",
Subsequent, run the command yarn lint:hbs once more:
Notice: ember-template-lint additionally takes a --quiet flag, which will not print any warnings or todos—solely errors.
Together with the power to create todos out of at present failing guidelines, some choices will be set to resolve the variety of days earlier than the todo turns right into a warning after which into an error.
Why, although?
This new characteristic is meant to assist apps at a big scale. It may be tough to replace a dependency like ember-template-lint when it features a new rule, resulting from plenty of elements concerned. Taking in a brand new model of the linter can imply communication and coordination in regards to the new rule(s). The bigger your app is and the extra builders you’ve, the extra work this may be. For world corporations that use Ember, there may even be a committee whose sole focus is to make choices about linting guidelines!
Whereas the pending characteristic gave us some of the specified performance, it did not make sure that groups would have help to repair current points. Points may keep “pending” eternally. The todo characteristic replaces the pending characteristic in order that, after we introduce new linting guidelines, groups can remind each other to dedicate time to repair points.
Maybe a visualization would even be helpful:
All new code is instantly supported by new linting guidelines; current code can have a timeline to offer a repair.
We will even take a step additional and customise the variety of days to repair on a rule-by-rule foundation. Tremendous helpful!
Step 1: Strategize
You will need to take into consideration the way you need to strategy the entire linting guidelines. Would you like all guidelines to be handled the identical method, or do you need to apply decay days by rule? The linter offers you choices for each.
All guidelines (generic setting)
It is potential that you do not care what the error is; all todos ought to have 15 days earlier than they flip right into a warning, and 30 days earlier than they flip into an error. To do that, add this to the package deal.json file:
{
"lintTodo": {
"decayDays": {
"warn": 15,
"error": 30
}
}
}
The default values will differ from staff to staff. In essence, the values needs to be cheap for groups to methodically work on previous points, however not too giant that the problems might be forgotten. It ought to really feel like a bit little bit of a stretch, however not anxious.
As soon as the generic settings are within the package deal.json file, run yarn ember-template-lint . --update-todo (or, yarn lint:hbs --update-todo) and any linting problem that’s discovered could have a todo created for it.
Growing specificity by rule
It is also potential that you just’d need to specify {that a} explicit rule must be repair with extra immediacy. In that case, you’d need to run that rule by itself. Let’s use the no-nested-interactive rule for example:
yarn ember-template-lint app/ --no-config-path --no-inline-config --rule 'no-nested-interactive:error' --update-todo --todo-days-to-warn=7 --todo-days-to-error=14
Let’s break down what this command does:
yarn ember-template-lint app/: “run the linter on the app folder”--no-config-path: “ignore the.template-lintrc.jsfile”--no-inline-config: “additionally, ignore cases the place the rule has been supressed inline”--rule 'no-nested-interactive:error': “particularly, solely run theno-nested-interactiverule and throw an error if it finds these points”--update-todo: “create a todo if this problem is discovered”--todo-days-to-warn=7: “within the created todo, mechanically change the todo to a warning after 7 days”--todo-days-to-error=14: “within the created todo, mechanically change the warning to an error after 14 days”
Zoey says…accessibility!
If your organization has determined to make extra inclusive merchandise, chances are you’ll need to set the decay days primarily based on the rule itself.
Usually, accessibility (a11y) bugs are divided up into classes primarily based on impression to the consumer: blocker, important, main and minor (outcomes might differ).
Wanting on the documentation for every the a11y-related guidelines in ember-template-lint, you may then decide the rule’s class, and decide the variety of days to warn/error accordingly.
For extra concepts about how this might work, ping the #topic-a11y channel within the Ember Discord neighborhood chat.
Step 2: Plan For Accountability
After operating the linter and creating the entire todos, a .lint-todo folder will seem within the root listing of the venture. That is the place you may discover the specifics about which file is failing which rule so that you could repair the problems.
In the event you run the linter after a problem is fastened, the linter will let you know that a problem has been resolved. To take away the resolved todo, use the --fix flag:
yarn lint:hbs --fix
Notice: utilizing --fix will even repair any gadgets which can be mechanically fixable, which can trigger an undesirable consequence. For instance, the require-button-type rule might add a default sort="button" to the <button> parts, however might not mechanically respect the prettier or beautify configuration of the venture.
The .lint-todo folder ought to get checked in to the venture’s model management system, and groups ought to do a periodic evaluation to make sure that they’re fixing the todos and never altering the due dates. Have knowledgeable settlement with the opposite members of your staff, and keep dedicated to fixing these todos.
Step 3: Get pleasure from Improved Code!
By benefiting from the brand new todo characteristic, dev groups are setting themselves up for achievement and better high quality code. When you have any questions on this new characteristic, take a look at the #e-template-lint channel within the Ember Discord neighborhood chat, or file a problem on the venture’s repo.
