chore: Style lint implementation (#105)

* Style lint implementation * remove style script * no lint on tests * Removed .eslintignore & pointed to .gitignore * Removed .stylintrc * Removed .template-lintrc.js * lint-staged fix * Added lints & cleanups * Removed scripts & depenedencies * bare string check & ignored test dummy files Co-authored-by: Shibu Lijack <[email protected]>
freshworks · Feb 7, 2020 · 79ed2f5 · 79ed2f5
1 parent 1f3bc9b
commit 79ed2f5
Show file tree

Hide file tree

Showing 69 changed files with 561 additions and 1,050 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,3 +1,6 @@
+// eslint-disable-next-line node/no-extraneous-require
+const ESLINT_PLUGIN_NODE = require('eslint-plugin-node');
+
 module.exports = {
   root: true,
   parser: 'babel-eslint',
@@ -38,15 +41,18 @@ module.exports = {
         'tests/dummy/app/**'
       ],
       parserOptions: {
-        sourceType: 'script'
+        sourceType: 'script',
+        "ecmaFeatures": {
+          "legacyDecorators": true
+        }
       },
       env: {
         browser: false,
         node: true
       },
       plugins: ['node'],
       // eslint-disable-next-line node/no-extraneous-require
-      rules: Object.assign({}, require('eslint-plugin-node').configs.recommended.rules, {
+      rules: Object.assign({}, ESLINT_PLUGIN_NODE.configs.recommended.rules, {
         'comma-dangle': ['error', 'never'],
         'ember/new-module-imports': 'off',
         'ember/order-in-components': 2,

diff --git a/.template-lintrc.js b/.template-lintrc.js
@@ -5,7 +5,10 @@ module.exports = {
   extends: 'recommended',
 
   rules: {
-    'no-bare-strings': false,
+    'no-bare-strings': true,
     'quotes': 'double'
-  }
+  },
+  ignore: [
+    '**/tests/dummy/**'
+  ]
 };
diff --git a/package.json b/package.json
@@ -10,7 +10,10 @@
     "start": "yarn workspace nucleus start",
     "test": "lerna run test --no-private --stream --concurrency 1",
     "build": "lerna run build --parallel --no-private",
-    "lint": "lerna run lint:hbs --parallel && lerna run lint:js --parallel",
+    "lint:js": "eslint . --fix --ignore-path .gitignore",
+    "lint:style": "stylelint **/*.scss",
+    "lint:hbs": "ember-template-lint .",
+    "lint": "yarn lint:js && yarn lint:style && yarn lint:hbs",
     "lint-staged": "lint-staged",
     "lerna:version": "lerna version prerelease --preid beta",
     "lerna:publish": "lerna publish --canary --yes --dist-tag beta",
@@ -19,16 +22,26 @@
     "try:legacy": "ember try:one ember-lts-2.18"
   },
   "devDependencies": {
+    "babel-eslint": "^10.0.3",
     "ember-cli": "~3.11.0",
+    "ember-cli-eslint": "^5.1.0",
+    "ember-cli-stylelint": "^3.0.2",
     "ember-source-channel-url": "^2.0.0",
+    "ember-template-lint": "^1.13.2",
     "ember-try": "^1.1.0",
+    "eslint-plugin-ember": "^7.7.2",
+    "eslint-plugin-node": "^11.0.0",
     "lerna": "^3.20.2",
     "lint-staged": "^10.0.7",
-    "pre-commit": "^1.2.2"
+    "pre-commit": "^1.2.2",
+    "stylelint": "^13.0.0",
+    "stylelint-config-standard": "^19.0.0",
+    "stylelint-order": "^4.0.0"
   },
   "lint-staged": {
-    "*.js": "lerna run lint:js",
-    "*.hbs": "lerna run lint:hbs"
+    "*.js": "eslint . --fix --ignore-path .gitignore",
+    "*.hbs": "ember-template-lint .",
+    "*.scss": "stylelint **/*.scss"
   },
   "pre-commit": [
     "lint-staged"

diff --git a/packages/@nucleus/config/environment.js b/packages/@nucleus/config/environment.js
@@ -1,3 +1,4 @@
+/* eslint-env node */
 module.exports = function(/* environment, appConfig */) {
   return { };
 };
diff --git a/packages/@nucleus/ember-cli-build.js b/packages/@nucleus/ember-cli-build.js
@@ -44,14 +44,7 @@ module.exports = function(defaults) {
   );
 
   let app = new EmberAddon(defaults, {
-    stylelint: {
-      linterConfig:{
-        syntax: 'scss'
-      },
-      includePaths: [
-        'app/styles'
-      ]
-    },
+    hinting: false,
     'ember-cli-addon-docs': {
       projects: {
         main: tree

diff --git a/packages/@nucleus/package.json b/packages/@nucleus/package.json
@@ -36,7 +36,6 @@
   },
   "devDependencies": {
     "@ember/optional-features": "^1.0.0",
-    "babel-eslint": "^10.0.3",
     "broccoli-asset-rev": "^3.0.0",
     "broccoli-funnel": "^2.0.1",
     "broccoli-merge-trees": "^3.0.0",
@@ -51,13 +50,10 @@
     "ember-cli-deploy-build": "^1.1.1",
     "ember-cli-deploy-git": "^1.3.3",
     "ember-cli-deploy-git-ci": "^1.0.1",
-    "ember-cli-eslint": "^5.1.0",
     "ember-cli-flash": "^1.7.2",
     "ember-cli-inject-live-reload": "^2.0.1",
     "ember-cli-sass": "^10.0.0",
     "ember-cli-sri": "^2.1.1",
-    "ember-cli-stylelint": "^2.2.0",
-    "ember-cli-template-lint": "^1.0.0-beta.3",
     "ember-cli-uglify": "^3.0.0",
     "ember-disable-prototype-extensions": "^1.1.3",
     "ember-export-application-global": "^2.0.0",
@@ -69,14 +65,9 @@
     "ember-sinon-qunit": "^3.4.0",
     "ember-source": "~3.13.0",
     "ember-test-selectors": "^2.1.0",
-    "eslint-plugin-ember": "^7.1.0",
-    "eslint-plugin-node": "^10.0.0",
     "loader.js": "^4.7.0",
     "qunit-dom": "^0.9.0",
-    "sass": "^1.23.0",
-    "stylelint": "^9.10.1",
-    "stylelint-config-standard": "^18.2.0",
-    "stylelint-order": "^2.1.0"
+    "sass": "^1.23.0"
   },
   "engines": {
     "node": "8.* || >= 10.*"

diff --git a/packages/@nucleus/tests/dummy/app/templates/components/dummy-comp/demo-2-helper.hbs b/packages/@nucleus/tests/dummy/app/templates/components/dummy-comp/demo-2-helper.hbs
@@ -1,5 +1,5 @@
 {{!-- BEGIN-SNIPPET nucleus-banner-2-helper.hbs --}}
 <div class="banner-custom">
-  This is a <a class="docs-link" onclick={{action 'onCustomClick'}}>custom</a> component with custom <b>markup</b>.
+  This is a <a class="docs-link" href="#" onclick={{action "onCustomClick"}}>custom</a> component with custom <b>markup</b>.
 </div>
 {{!-- END-SNIPPET --}}
diff --git a/packages/@nucleus/tests/dummy/app/templates/components/nucleus-banner/demo-1.hbs b/packages/@nucleus/tests/dummy/app/templates/components/nucleus-banner/demo-1.hbs
@@ -13,5 +13,5 @@
       Warning
     </button>
   {{/demo.example}}
-  {{demo.snippet 'nucleus-banner.js'}}
+  {{demo.snippet "nucleus-banner.js"}}
 {{/docs-demo}}
diff --git a/packages/@nucleus/tests/dummy/app/templates/components/nucleus-banner/demo-2.hbs b/packages/@nucleus/tests/dummy/app/templates/components/nucleus-banner/demo-2.hbs
@@ -4,7 +4,7 @@
       Custom component
     </button>
   {{/demo.example}}
-  {{demo.snippet 'nucleus-banner-2.js' label="component.js"}}
-  {{demo.snippet 'nucleus-banner-2-helper.hbs' label="dummy-comp/demo-2-helper.hbs"}}
-  {{demo.snippet 'nucleus-banner-2-helper.js' label="dummy-comp/demo-2-helper.js"}}
+  {{demo.snippet "nucleus-banner-2.js" label="component.js"}}
+  {{demo.snippet "nucleus-banner-2-helper.hbs" label="dummy-comp/demo-2-helper.hbs"}}
+  {{demo.snippet "nucleus-banner-2-helper.js" label="dummy-comp/demo-2-helper.js"}}
 {{/docs-demo}}
diff --git a/packages/@nucleus/tests/dummy/app/templates/components/nucleus-icon/demo-1.hbs b/packages/@nucleus/tests/dummy/app/templates/components/nucleus-icon/demo-1.hbs
@@ -3,19 +3,21 @@
     <table>
       <thead>
         <tr>
+          {{!-- template-lint-disable no-inline-styles  --}}
           <th style="width: 50%">Icon</th>
           <th>Name</th>
         </tr>
       </thead>
       <tbody>
         {{#each icons as |icon|}}
           <tr>
+            {{!-- template-lint-disable no-inline-styles  --}}
             <td style="text-align: center">{{nucleus-icon name=icon}}</td>
             <td>{{icon}}</td>
           </tr>
         {{/each}}
       </tbody>
     </table>
-    
+
   {{/demo.example}}
 {{/docs-demo}}
diff --git a/packages/@nucleus/tests/dummy/app/templates/components/nucleus-inline-banner/demo-2.hbs b/packages/@nucleus/tests/dummy/app/templates/components/nucleus-inline-banner/demo-2.hbs
@@ -1,7 +1,7 @@
 {{#docs-demo as |demo|}}
   {{#demo.example name="nucleus-inline-banner-2.hbs"}}
     {{#nucleus-inline-banner type="success" as |banner|}}
-      <div>Some custom content. <a class="docs-link" onclick={{action banner.close}}>Click here to close.</a></div>
+      <div>Some custom content. <a class="docs-link" href="#" onclick={{action banner.close}}>Click here to close.</a></div>
     {{/nucleus-inline-banner}}
   {{/demo.example}}
   {{demo.snippet "nucleus-inline-banner-2.hbs"}}

diff --git a/packages/@nucleus/tests/dummy/config/environment.js b/packages/@nucleus/tests/dummy/config/environment.js
@@ -1,5 +1,6 @@
 'use strict';
 
+/* eslint-env node */
 module.exports = function(environment) {
   let ENV = {
     modulePrefix: 'dummy',

diff --git a/packages/@nucleus/tests/dummy/config/targets.js b/packages/@nucleus/tests/dummy/config/targets.js
@@ -1,5 +1,6 @@
 'use strict';
 
+/* eslint-env node */
 const browsers = [
   'last 1 Chrome versions',
   'last 1 Firefox versions',

diff --git a/packages/banner/.eslintignore b/packages/banner/.eslintignore
diff --git a/packages/banner/.eslintrc.js b/packages/banner/.eslintrc.js
diff --git a/packages/banner/.template-lintrc.js b/packages/banner/.template-lintrc.js
diff --git a/packages/banner/config/environment.js b/packages/banner/config/environment.js
@@ -1,5 +1,6 @@
 'use strict';
 
+/* eslint-env node */
 module.exports = function(environment) {
   let ENV = {
     modulePrefix: 'nucleus',

diff --git a/packages/banner/ember-cli-build.js b/packages/banner/ember-cli-build.js
@@ -6,15 +6,7 @@ const EmberAddon = require('ember-cli/lib/broccoli/ember-addon');
 module.exports = function(defaults) {
   let app = new EmberAddon(defaults,
     {
-      hinting: false,
-      stylelint: {
-        linterConfig:{
-          syntax: 'scss'
-        },
-        includePaths: [
-          'app/styles'
-        ]
-      }
+      hinting: false
     }
   );
 

diff --git a/packages/banner/package.json b/packages/banner/package.json
@@ -14,8 +14,6 @@
   },
   "scripts": {
     "build": "ember build",
-    "lint:hbs": "ember-template-lint .",
-    "lint:js": "eslint . --fix",
     "start": "ember serve -p 4003",
     "deploy": "ember deploy production",
     "test": "ember backstop-remote & COVERAGE=TRUE ember test --test-port=1512",
@@ -37,7 +35,6 @@
   },
   "devDependencies": {
     "@ember/optional-features": "^1.0.0",
-    "babel-eslint": "^10.0.3",
     "broccoli-asset-rev": "^3.0.0",
     "broccoli-funnel": "^2.0.2",
     "broccoli-merge-trees": "^3.0.2",
@@ -51,11 +48,9 @@
     "ember-cli-deploy-build": "^1.1.1",
     "ember-cli-deploy-git": "^1.3.3",
     "ember-cli-deploy-git-ci": "^1.0.1",
-    "ember-cli-eslint": "^5.1.0",
     "ember-cli-flash": "^1.7.2",
     "ember-cli-inject-live-reload": "^2.0.1",
     "ember-cli-sri": "^2.1.1",
-    "ember-cli-stylelint": "^2.2.0",
     "ember-cli-uglify": "^3.0.0",
     "ember-disable-prototype-extensions": "^1.1.3",
     "ember-export-application-global": "^2.0.0",
@@ -66,16 +61,10 @@
     "ember-sinon": "^4.0.0",
     "ember-sinon-qunit": "^3.4.0",
     "ember-source": "~3.13.0",
-    "ember-template-lint": "^1.13.2",
     "ember-test-selectors": "^2.1.0",
-    "eslint-plugin-ember": "^7.1.0",
-    "eslint-plugin-node": "^10.0.0",
     "loader.js": "^4.7.0",
     "qunit-dom": "^0.9.0",
-    "sass": "^1.23.0",
-    "stylelint": "^9.10.1",
-    "stylelint-config-standard": "^18.2.0",
-    "stylelint-order": "^2.1.0"
+    "sass": "^1.23.0"
   },
   "engines": {
     "node": "8.* || >= 10.*"

diff --git a/packages/banner/tests/dummy/config/environment.js b/packages/banner/tests/dummy/config/environment.js
@@ -1,5 +1,6 @@
 'use strict';
 
+/* eslint-env node */
 module.exports = function(environment) {
   let ENV = {
     modulePrefix: 'dummy',

diff --git a/packages/banner/tests/dummy/config/targets.js b/packages/banner/tests/dummy/config/targets.js
@@ -1,5 +1,6 @@
 'use strict';
 
+/* eslint-env node */
 const browsers = [
   'last 1 Chrome versions',
   'last 1 Firefox versions',