Merge pull request #8 from Hackception/am/update

Am/update
Hackception · Feb 17, 2017 · 95eb303 · 95eb303
2 parents 28ece22 + 4fe73e0
commit 95eb303
Show file tree

Hide file tree

Showing 15 changed files with 87 additions and 37 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,24 @@
+{
+  "extends": ["eslint:recommended", "google"],
+  "env": {
+    "browser": true,
+    "es6": true,
+    "node": true
+  },
+  "plugins": [
+    "chai-expect",
+    "html"
+  ],
+  "rules": {
+    "no-var": "off",
+    "new-cap": ["error", { "capIsNewExceptions": ["Polymer"] }],
+    "max-len": [1, 120, 2, { "ignoreComments": true }],
+    "comma-dangle": 0
+  },
+  "globals": {
+    "Polymer": true,
+    "AppBehaviors": true,
+    "AppConfigs": true,
+    "expect": true
+  }
+}
diff --git a/.travis.yml b/.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
diff --git a/README.md b/README.md
@@ -26,7 +26,8 @@ The PRPL pattern, in a nutshell:
 
 ##### Prerequisites
 
-Install [polymer-cli](https://github.com/Polymer/polymer-cli):
+First, install [Polymer CLI](https://github.com/Polymer/polymer-cli) using
+[npm](https://www.npmjs.com) (we assume you have pre-installed [node.js](https://nodejs.org)).
 
     npm install -g polymer-cli
 
@@ -43,7 +44,6 @@ routing for the app:
 
     polymer serve --open
 
-
 ### Build
 
 This command performs HTML, CSS, and JS minification on the application
@@ -72,9 +72,8 @@ generated using fragment bundling:
 
 ### Run tests
 
-This command will run
-[Web Component Tester](https://github.com/Polymer/web-component-tester) against the
-browsers currently installed on your machine.
+This command will run [Web Component Tester](https://github.com/Polymer/web-component-tester)
+against the browsers currently installed on your machine:
 
     polymer test
 
@@ -88,8 +87,8 @@ Read More here [daffl/launchpad](https://github.com/daffl/launchpad#environment-
 ### Adding a new view
 
 You can extend the app by adding more views that will be demand-loaded
-e.g. based on the route, or to progressively render non-critical sections
-of the application.  Each new demand-loaded fragment should be added to the
-list of `fragments` in the included `polymer.json` file.  This will ensure
-those components and their dependencies are added to the list of pre-cached
-components (and will have bundles created in the fallback `bundled` build).
+e.g. based on the route, or to progressively render non-critical sections of the
+application. Each new demand-loaded fragment should be added to the list of
+`fragments` in the included `polymer.json` file. This will ensure those
+components and their dependencies are added to the list of pre-cached components
+and will be included in the `bundled` build.
diff --git a/index.html b/index.html
@@ -14,6 +14,7 @@
   <head>
     <base href="/">
     <meta charset="utf-8">
+    <meta name="generator" content="Polymer Starter Kit">
     <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes">
 
     <title>My App</title>
@@ -114,12 +115,14 @@
       // Setup Polymer options
       window.Polymer = {
         dom: 'shadow',
-        lazyRegister: 'max',
-        useNativeCSSProperties: true
+        lazyRegister: 'max'
       };
 
       // Load webcomponentsjs polyfill if browser does not support native Web Components
       (() => {
+        /**
+         * Handles the initial loading of imports.
+         */
         function onload() {
           // For native Imports, manually fire WebComponentsReady so user code
           // can use the same code path for native and polyfill'd imports.
@@ -159,7 +162,6 @@
       document.addEventListener('DOMContentLoaded', () => {
         if (window._satellite) window._satellite.pageBottom();
       });
-
     </script>
   </body>
 

diff --git a/package.json b/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "polymer-starter-kit",
+  "license": "BSD-3-Clause",
+  "devDependencies": {
+    "eslint": "^3.12.0",
+    "eslint-config-google": "^0.7.1",
+    "eslint-plugin-chai-expect": "^1.1.1",
+    "eslint-plugin-html": "^1.7.0"
+  },
+  "scripts": {
+    "lint": "eslint . --ext js,html --ignore-path .gitignore",
+    "test": "npm run lint && polymer test"
+  }
+}
diff --git a/service-worker.js b/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.'
+);
diff --git a/src/behaviors/app-localize-behavior.html b/src/behaviors/app-localize-behavior.html
@@ -12,6 +12,8 @@
 <link rel="import" href="../../bower_components/app-localize-behavior/app-localize-behavior.html">
 
 <script>
+  // Ensure the namespace exists
+  window.AppBehaviors = window.AppBehaviors || {};
 
   // Define the behavior
   window.AppBehaviors.AppLocalizeBehavior = [Polymer.AppLocalizeBehavior, {

diff --git a/src/config/app-config-endpoints.html b/src/config/app-config-endpoints.html
@@ -9,6 +9,9 @@
     }
   };
 
+  /**
+   * Resolves the base url for API rest calls by appending an apiSuffix as needed.
+   */
   function resolveApiBaseUrl() {
     const config = AppEndpoints.apiBase;
     let {protocol, port = ''} = window.location;

diff --git a/src/my-app.html b/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>
@@ -79,7 +74,6 @@
     <app-breakpoints
       app="{{app}}"
     ></app-breakpoints>
-
   </template>
 
   <script>

diff --git a/src/pages/my-page-view1/my-page-view1.html b/src/pages/my-page-view1/my-page-view1.html
@@ -10,6 +10,7 @@
 
 <link rel="import" href="../../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../theme/shared-styles.html">
+<link rel="import" href="../../behaviors/app-localize-behavior.html">
 
 <dom-module id="my-page-view1">
   <template>
@@ -68,10 +69,9 @@ <h1>View One</h1>
         event.stopPropagation();
         this._isLocalesLoaded = true;
         // TODO: Resolve slow localize data binding in Firefox
-        //this.style.display = 'block';
+        // this.style.display = 'block';
         this.set('app.pageTitle', this.localize('home'));
       }
-
     });
   </script>
 </dom-module>
diff --git a/src/theme/shared-styles.html b/src/theme/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>

diff --git a/sw-precache-config.js b/sw-precache-config.js
@@ -7,12 +7,15 @@
  * 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/babel-polyfill/babel-polyfill.js'
+    '/bower_components/babel-polyfill/babel-polyfill.js',
   ],
-  navigateFallback: 'index.html'
+  navigateFallback: 'index.html',
 };
diff --git a/test/.eslintrc.json b/test/.eslintrc.json
@@ -0,0 +1,10 @@
+{
+  "env": {
+    "mocha": true
+  },
+  "globals": {
+    "assert": false,
+    "fixture": false,
+    "WCT": false
+  }
+}
diff --git a/test/index.html b/test/index.html
@@ -21,8 +21,8 @@
   <body>
     <script>
       WCT.loadSuites([
-        'my-view1.html?dom=shady',
-        'my-view1.html?dom=shadow'
+        'my-page-view1.html',
+        'my-page-view1.html?dom=shadow'
       ]);
     </script>
   </body>

diff --git a/test/my-view1.html → test/my-page-view1.html b/test/my-view1.html → test/my-page-view1.html
@@ -18,14 +18,15 @@
 
     <script src="../bower_components/webcomponentsjs/webcomponents-lite.js"></script>
     <script src="../bower_components/web-component-tester/browser.js"></script>
+    <link rel="import" href="../../bower_components/polymer/polymer.html">
 
     <!-- Import the element to test -->
-    <link rel="import" href="../src/my-view1.html">
+    <link rel="import" href="../src/pages/my-page-view1/my-page-view1.html">
   </head>
   <body>
     <test-fixture id="basic">
       <template>
-        <my-view1></my-view1>
+        <my-page-view1></my-page-view1>
       </template>
     </test-fixture>
 
@@ -38,7 +39,7 @@
         });
 
         it('Number in circle should be 1', () => {
-          const circle = Polymer.dom(element.root).querySelector('.circle');
+          const circle = element.$$('.circle');
           expect(circle.textContent).to.equal('1');
         });
       });