Dependency

#1441

• Explore, document and make a new issue to implement linters which can be installed locally #2651
• after the spelling issues are done we can re-review this.
• Figure out which js files use liquid (and the least liquid in any file)
• Refactor a js file that uses liquid into two separate files
• Roll out plan for implementation

Overview

We need to implement a linter for our javascript code to standardize and maintain the code properly.

Action Items

• Create a list of possible bare minimum esLint settings that we can turn on
  • During one of the developer meetings, discuss the possible settings with the team and finalize a list of settings to implement
  • You may reference and use the list from this comment
• Implement a GitHub action that triggers on pull request or on push to the gh-pages branch
  • The action should lint javascript files. The recommended tool for linting is Super Linter
  • Create the action as part of your local fork of the repository
  • Run the action on js files that should end in a success, and ensure that the action actually succeeds
  • Run the action on js files that should end in a failure, and ensure that the action fails properly based on the correct settings
  • Demo your prototype to the team and/or the technical lead to get approval
  • After approval, create a PR for review
  • Ensure that the linter does not trigger or break on liquid syntax
• For merge team: Release dependency on Create a wiki page for linters used by the HfLA website team #3230
  • Update action items in the dependency issue if needed.
  • If all dependencies in Create a wiki page for linters used by the HfLA website team #3230 have been resolved, remove the dependency label, move it to the new issue approval column and add a ready for milestone label.

Resources/Instructions

• A GitHub action for linting the scss files is already implemented, You may use that as reference when implementing this action for Javascript files.
  • lint-scss.yml
  • Issue for implementing scss lint: Implement SCSS lint #1441
  • PR for implementing scss lint: Setting up GitHub Action for CSS and future linting #1957
• Recommended tool for linting: Super Linter
• Super Linter article

Additional resources:

• Events that trigger workflows
• Workflow syntax for GitHub Actions
• GitHub GraphQL