Add city-list example tests to sky

sky/examples/city-list/city-list.sky

 <!--
 // Copyright 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 -->
 <import src="../../framework/sky-element/sky-element.sky" as="SkyElement" />
 <import src="city-data-service.sky" as="CityDataService" />
 <import src="city-sequence.sky" as="CitySequence" />
 
-<template>  
+<template>
   <style>
     div {
       font-size: 16px;
       color: #FFF;
       background-color: #333;
       padding: 4px 4px 4px 12px;
     }
   </style>
   <div>{{ state }}</div>
 </template>
@@ skipping 130 matching lines @@
 </template>
 <script>
 
 (function(global) {
     "use strict";
 
     var LOAD_LENGTH = 20;
     var LOAD_BUFFER_PRE = LOAD_LENGTH * 4;
     var LOAD_BUFFER_POST = LOAD_LENGTH * 4;
 
-    function Loader() {
+    function Loader(cityList) {
+      this.cityList = cityList;
       this.loadingData = false;
       this.data = null;
       this.zeroIndex = 0;
       this.loadIndex = 0;
     }
 
     Loader.prototype.localIndex = function(externalIndex) {
       return externalIndex + this.zeroIndex;
     }
 
     Loader.prototype.externalIndex = function(localIndex) {
       return localIndex - this.zeroIndex;
     }
 
     Loader.prototype.getItems = function() {
       return this.data ? this.data.items : [];
     }
 
-    Loader.prototype.maybeLoadMoreData = function(dataloadedCallback,
-                                                  firstVisible) {
+    Loader.prototype.maybeLoadMoreData =
+        function(dataloadedCallback, firstVisible) {
       if (this.loadingData)
         return;
 
       if (firstVisible) {
         this.loadIndex = this.externalIndex(
             this.data.items.indexOf(firstVisible));
       }
 
       var localIndex = this.localIndex(this.loadIndex);
       var loadedPre = 0;
       var loadedPost = 0;
 
       if (this.data) {
         loadedPre = localIndex;
         loadedPost = this.data.items.length - loadedPre;
       }
 
       var loadTime;
-      if (loadedPre >= LOAD_BUFFER_PRE && loadedPost >= LOAD_BUFFER_POST) {
+      if (loadedPre >= LOAD_BUFFER_PRE &&
+          loadedPost >= LOAD_BUFFER_POST) {
+
+        var cityList = this.cityList;
+        setTimeout(function() {
+           cityList.dispatchEvent(new Event('load'));
+        });
+
         if (window.startLoad) {
           loadTime = new Date().getTime() - window.startLoad;
           console.log('Load: ' + loadTime + 'ms');
           window.startLoad = undefined;
         }
         return;
       }
 
       this.loadingData = true;
 
@@ skipping 319 matching lines @@
       name: 'city-list',
       loader: null,
       scroller: null,
       tiler: null,
       date: null,
       month: null,
       views: null,
 
       attached: function() {
         this.views = {};
-        this.loader = new Loader();
+        this.loader = new Loader(this);
         this.scroller = new Scroller();
         this.tiler = new Tiler(
             this.shadowRoot.getElementById('contentarea'), this.views, {
           stateHeader: 27,
           letterHeader: 18,
           cityItem: 30
         });
 
         this.dataLoaded = this.dataLoaded.bind(this);
-        this.shadowRoot.getElementById('scroller')
-            .addEventListener('scroll', this.handleScroll.bind(this));
+        this.scrollerElement = this.shadowRoot.getElementById('scroller');
+        this.scrollerElement.addEventListener('scroll',
+            this.handleScroll.bind(this));
 
         var self = this;
-        requestAnimationFrame(function() {
+        setTimeout(function() {
           self.domReady();
           self.loader.maybeLoadMoreData(self.dataLoaded);
         });
       },
 
       domReady: function() {
         this.scroller.setup(this.shadowRoot.getElementById('scroller'),
             this.shadowRoot.getElementById('scrollarea'),
             this.shadowRoot.getElementById('contentarea'));
         var scrollFrame = this.scroller.getCurrentFrame();
@@ skipping 19 matching lines @@
           return;
 
         this.updateView(this.loader.getItems(), true);
       }
     });
 
 })(this);
 
 </script>