Moved visual test to its own file. Update screenshots

vaadin · Oct 11, 2017 · bc0e19d · bc0e19d
1 parent b21fdcf
commit bc0e19d
Show file tree

Hide file tree

Showing 7 changed files with 72 additions and 5 deletions.
diff --git a/demo/icons-basic-demos.html b/demo/icons-basic-demos.html
@@ -87,9 +87,6 @@ <h3>All Icons</h3>
       ready() {
         super.ready();
         this.iconsets = new Polymer.IronMeta({type: 'iconset'}).list.filter(i => i.name == 'vaadin');
-
-        // Checked in gemini before capture callback
-        window.webComponentsAreReady = true;
       }
 
       getIconNames(iconset, search) {

diff --git a/test/visual/icons.html b/test/visual/icons.html
@@ -0,0 +1,70 @@
+<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" />
+  <script src="../../../webcomponentsjs/webcomponents-lite.js"></script>
+
+  <style>
+    body {
+      font-family: sans-serif;
+    }
+  </style>
+</head>
+
+<body>
+  <link rel="import" href="../../polymer/polymer.html">
+  <link rel="import" href="../../vaadin-icons.html">
+  <link rel="import" href="../../../iron-meta/iron-meta.html">
+  <link rel="import" href="../../../vaadin-text-field/vaadin-text-field.html">
+
+
+  <dom-bind id="binder">
+    <template>
+      <style>
+        .iconset-container {
+          width: 800px;
+          font-size: 10px;
+        }
+        .icon-container {
+          display: inline-flex;
+          flex-direction: column;
+          width: 110px;
+          align-items: center;
+          margin-top: 6px;
+        }
+        span {
+          white-space: nowrap;
+          overflow: hidden;
+        }
+      </style>
+      <div class="iconset-container">
+        <dom-repeat items="[[iconsets]]">
+          <template>
+            <dom-repeat id="wrapper" items="[[getIconNames(item)]]">
+              <template is="dom-repeat" >
+                <div class="icon-container">
+                  <iron-icon icon="[[item]]"></iron-icon>
+                  <span>[[item]]</span>
+                </div>
+              </template>
+            </dom-repeat>
+          </template>
+        </dom-repeat>
+      </div>
+    </template>
+  </dom-bind>
+
+  <script>
+    window.addEventListener('WebComponentsReady', function() {
+      const binder = document.getElementById('binder');
+      binder.getIconNames = function(iconset) {
+        return iconset.getIconNames();
+      }
+      binder.iconsets = new Polymer.IronMeta({type: 'iconset'}).list.filter(i => i.name == 'vaadin');
+      window.webComponentsAreReady = true;
+    });
+  </script>
+
+</body>
+</html>
diff --git a/test/visual/screens/vaadin-icons/default/default/chrome.png b/test/visual/screens/vaadin-icons/default/default/chrome.png
diff --git a/test/visual/screens/vaadin-icons/default/default/edge.png b/test/visual/screens/vaadin-icons/default/default/edge.png
diff --git a/test/visual/screens/vaadin-icons/default/default/firefox.png b/test/visual/screens/vaadin-icons/default/default/firefox.png
diff --git a/test/visual/screens/vaadin-icons/default/default/ie.png b/test/visual/screens/vaadin-icons/default/default/ie.png
diff --git a/test/visual/test.js b/test/visual/test.js
@@ -2,13 +2,13 @@ gemini.suite('vaadin-icons', function(rootSuite) {
 
   gemini.suite('default', function(suite) {
     suite
-      .setUrl('../../demo/index.html')
+      .setUrl('icons.html')
       .before(function(actions) {
         actions.waitForJSCondition(function(window) {
           return window.webComponentsAreReady;
         }, 120000).wait(10000);
       })
-      .setCaptureElements('body')
+      .setCaptureElements('.iconset-container')
       .capture('default');
   });