Add ESLint and fixup errors (#951)

* Add ESLint and fixup errors

* Update config to include recommended. Fixup errors

* Add cascading eslintrc

* Run npm test

.eslintrc.json

@@ -0,0 +1,16 @@
+{
+  "extends": ["eslint:recommended", "google"],
+  "env": {
+    "browser": true
+  },
+  "plugins": [
+    "html"
+  ],
+  "rules": {
+    "no-var": "off",
+    "new-cap": ["error", { "capIsNewExceptions": ["Polymer"] }]
+  },
+  "globals": {
+    "Polymer": true
+  }
+}

.travis.yml

@@ -16,4 +16,4 @@ before_script:
   - npm install -g bower polymer-cli
   - bower install
 script:
-  - xvfb-run polymer test
+  - xvfb-run npm test

index.html

@@ -50,10 +50,11 @@
       // Setup Polymer options
       window.Polymer = {
         dom: 'shadow',
-        lazyRegister: true
+        lazyRegister: true,
       };
 
-      // Load webcomponentsjs polyfill if browser does not support native Web Components
+      // Load webcomponentsjs polyfill if browser does not support native
+      // Web Components
       (function() {
         'use strict';
 

package.json

@@ -0,0 +1,13 @@
+{
+  "name": "polymer-starter-kit",
+  "license": "BSD-3-Clause",
+  "devDependencies": {
+    "eslint": "^3.12.0",
+    "eslint-config-google": "^0.7.1",
+    "eslint-plugin-html": "^1.7.0"
+  },
+  "scripts": {
+    "lint": "eslint . --ext js,html; exit 0;",
+    "test": "npm run lint && polymer test"
+  }
+}

service-worker.js

@@ -7,4 +7,9 @@
  * Code distributed by Google as part of the polymer project is also
  * subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
  */
-console.info('Service worker disabled for development, will be generated at build time.');
+
+/* eslint no-console: ["error", { allow: ["info"] }] */
+
+console.info(
+  'Service worker disabled for development, will be generated at build time.'
+);

src/my-app.html

@@ -46,19 +46,14 @@
 
       .drawer-list a {
         display: block;
-
         padding: 0 16px;
-
         text-decoration: none;
-
         color: var(--app-secondary-color);
-
         line-height: 40px;
       }
 
       .drawer-list a.iron-selected {
         color: black;
-
         font-weight: bold;
       }
     </style>
@@ -113,12 +108,12 @@
         page: {
           type: String,
           reflectToAttribute: true,
-          observer: '_pageChanged'
-        }
+          observer: '_pageChanged',
+        },
       },
 
       observers: [
-        '_routePageChanged(routeData.page)'
+        '_routePageChanged(routeData.page)',
       ],
 
       _routePageChanged: function(page) {
@@ -137,7 +132,7 @@
 
       _showPage404: function() {
         this.page = 'view404';
-      }
+      },
     });
   </script>
 </dom-module>

src/my-view1.html

@@ -31,7 +31,7 @@ <h1>View One</h1>
 
   <script>
     Polymer({
-      is: 'my-view1'
+      is: 'my-view1',
     });
   </script>
 </dom-module>

src/my-view2.html

@@ -31,7 +31,7 @@ <h1>View Two</h1>
 
   <script>
     Polymer({
-      is: 'my-view2'
+      is: 'my-view2',
     });
   </script>
 </dom-module>

src/my-view3.html

@@ -31,7 +31,7 @@ <h1>View Three</h1>
 
   <script>
     Polymer({
-      is: 'my-view3'
+      is: 'my-view3',
     });
   </script>
 </dom-module>

src/my-view404.html

@@ -29,7 +29,7 @@
 
   <script>
     Polymer({
-      is: 'my-view404'
+      is: 'my-view404',
     });
   </script>
 </dom-module>

src/shared-styles.html

@@ -17,7 +17,6 @@
       .card {
         margin: 24px;
         padding: 16px;
-
         color: #757575;
         border-radius: 5px;
         background-color: #fff;
@@ -26,25 +25,19 @@
 
       .circle {
         display: inline-block;
-
         width: 64px;
         height: 64px;
-
         text-align: center;
-
         color: #555;
         border-radius: 50%;
         background: #ddd;
-
         font-size: 30px;
         line-height: 64px;
       }
 
       h1 {
         margin: 16px 0;
-
         color: #212121;
-
         font-size: 22px;
       }
     </style>

sw-precache-config.js

@@ -7,11 +7,14 @@
  * Code distributed by Google as part of the polymer project is also
  * subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
  */
+
+/* eslint-env node */
+
 module.exports = {
   staticFileGlobs: [
     '/index.html',
     '/manifest.json',
-    '/bower_components/webcomponentsjs/webcomponents-lite.min.js'
+    '/bower_components/webcomponentsjs/webcomponents-lite.min.js',
   ],
-  navigateFallback: 'index.html'
+  navigateFallback: 'index.html',
 };

test/.eslintrc.json

@@ -0,0 +1,10 @@
+{
+  "env": {
+    "mocha": true
+  },
+  "globals": {
+    "assert": false,
+    "fixture": false,
+    "WCT": false
+  }
+}

test/index.html

@@ -22,7 +22,7 @@
     <script>
       WCT.loadSuites([
         'my-view1.html?dom=shady',
-        'my-view1.html?dom=shadow'
+        'my-view1.html?dom=shadow',
       ]);
     </script>
   </body>

test/my-view1.html

@@ -40,7 +40,7 @@
         test('Number in circle should be 1', function() {
           var circle = Polymer.dom(home.root).querySelector('.circle');
           assert.equal(circle.textContent, '1');
-        })
+        });
       });
     </script>
   </body>