1 files changed, 263 insertions, 0 deletions
diff --git a/catapult/third_party/polymer/components/iron-selector/test/basic.html b/catapult/third_party/polymer/components/iron-selector/test/basic.html
new file mode 100644
index 00000000..08866bb3
--- /dev/null
+++ b/catapult/third_party/polymer/components/iron-selector/test/basic.html
@@ -0,0 +1,263 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+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
+-->
+
+<html>
+<head>
+
+  <title>iron-selector-basic</title>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
+
+  <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+  <script src="../../web-component-tester/browser.js"></script>
+  <script src="../../test-fixture/test-fixture-mocha.js"></script>
+
+  <link rel="import" href="../../test-fixture/test-fixture.html">
+  <link rel="import" href="../iron-selector.html">
+
+  <style>
+    .iron-selected {
+      background: #ccc;
+    }
+
+    .my-selected {
+      background: red;
+    }
+  </style>
+
+</head>
+<body>
+
+  <test-fixture id="defaults">
+    <template>
+      <iron-selector>
+        <div>Item 0</div>
+        <div>Item 1</div>
+        <div>Item 2</div>
+        <div>Item 3</div>
+        <div>Item 4</div>
+      </iron-selector>
+    </template>
+  </test-fixture>
+
+  <br><br>
+
+  <test-fixture id="basic">
+    <template>
+      <iron-selector selected="item2" attr-for-selected="id">
+        <div id="item0">Item 0</div>
+        <div id="item1">Item 1</div>
+        <div id="item2">Item 2</div>
+        <div id="item3">Item 3</div>
+        <div id="item4">Item 4</div>
+      </iron-selector>
+    </template>
+  </test-fixture>
+
+  <script>
+
+    suite('defaults', function() {
+
+      var s1;
+
+      setup(function () {
+        s1 = fixture('defaults');
+      });
+
+      test('to nothing selected', function() {
+        assert.equal(s1.selected, null);
+      });
+
+      test('to iron-selected as selectedClass', function() {
+        assert.equal(s1.selectedClass, 'iron-selected');
+      });
+
+      test('to false as multi', function() {
+        assert.isFalse(s1.multi);
+      });
+
+      test('to tap as activateEvent', function() {
+        assert.equal(s1.activateEvent, 'tap');
+      });
+
+      test('to nothing as attrForSelected', function() {
+        assert.equal(s1.attrForSelected, null);
+      });
+
+      test('as many items as children', function() {
+        assert.equal(s1.items.length, s1.querySelectorAll('div').length);
+      });
+    });
+
+    suite('basic', function() {
+
+      var s2;
+
+      setup(function () {
+        s2 = fixture('basic');
+      });
+
+      test('honors the attrForSelected attribute', function(done) {
+        Polymer.Base.async(function() {
+          assert.equal(s2.attrForSelected, 'id');
+          assert.equal(s2.selected, 'item2');
+          assert.equal(s2.selectedItem, document.querySelector('#item2'));
+          done();
+        });
+      });
+
+      test('allows assignment to selected', function() {
+        // set selected
+        s2.selected = 'item4';
+        // check selected class
+        assert.isTrue(s2.children[4].classList.contains('iron-selected'));
+        // check item
+        assert.equal(s2.selectedItem, s2.children[4]);
+      });
+
+      test('fire iron-select when selected is set', function() {
+        // setup listener for iron-select event
+        var selectedEventCounter = 0;
+        s2.addEventListener('iron-select', function(e) {
+          selectedEventCounter++;
+        });
+        // set selected
+        s2.selected = 'item4';
+        // check iron-select event
+        assert.equal(selectedEventCounter, 1);
+      });
+
+      test('set selected to old value', function() {
+        // setup listener for iron-select event
+        var selectedEventCounter = 0;
+        s2.addEventListener('iron-select', function(e) {
+          selectedEventCounter++;
+        });
+        // selecting the same value shouldn't fire iron-select
+        s2.selected = 'item2';
+        assert.equal(selectedEventCounter, 0);
+      });
+
+      test('force synchronous item update', function() {
+        expect(s2.items.length).to.be.equal(5);
+        Polymer.dom(s2).appendChild(document.createElement('div'));
+        expect(s2.items.length).to.be.equal(5);
+        s2.forceSynchronousItemUpdate();
+        expect(s2.items.length).to.be.equal(6);
+      });
+
+      suite('`select()` and `selectIndex()`', function() {
+        test('`select()` selects an item with the given value', function() {
+          s2.select('item1');
+          assert.equal(s2.selected, 'item1');
+
+          s2.select('item3');
+          assert.equal(s2.selected, 'item3');
+
+          s2.select('item2');
+          assert.equal(s2.selected, 'item2');
+        });
+
+        test('`selectIndex()` selects an item with the given index', function() {
+          assert.equal(s2.selectedItem, undefined);
+
+          s2.selectIndex(1);
+          assert.equal(s2.selected, 'item1');
+          assert.equal(s2.selectedItem, s2.items[1]);
+
+          s2.selectIndex(3);
+          assert.equal(s2.selected, 'item3');
+          assert.equal(s2.selectedItem, s2.items[3]);
+
+          s2.selectIndex(4);
+          assert.equal(s2.selected, 'item4');
+          assert.equal(s2.selectedItem, s2.items[4]);
+        });
+      });
+
+      suite('items changing', function() {
+        var s1;
+
+        setup(function() {
+          s1 = fixture('defaults');
+        });
+
+        test('cause iron-items-changed to fire', function(done) {
+          var newItem = document.createElement('div');
+          var changeCount = 0;
+
+          newItem.id = 'item999';
+
+          s2.addEventListener('iron-items-changed', function(event) {
+            changeCount++;
+            var mutation = event.detail;
+            assert.notEqual(mutation, undefined);
+            assert.notEqual(mutation.addedNodes, undefined);
+            assert.notEqual(mutation.removedNodes, undefined);
+          });
+
+          Polymer.dom(s2).appendChild(newItem);
+
+          Polymer.Base.async(function() {
+            Polymer.dom(s2).removeChild(newItem);
+
+            Polymer.Base.async(function() {
+              expect(changeCount).to.be.equal(2);
+              done();
+            }, 1);
+          }, 1);
+        });
+
+        test('updates selected item', function(done) {
+          s1.addEventListener('iron-items-changed', function firstListener() {
+            s1.removeEventListener('iron-items-changed', firstListener);
+            var firstElementChild = Polymer.dom(s1).firstElementChild;
+            expect(firstElementChild).to.be.equal(s1.selectedItem);
+            expect(firstElementChild.classList.contains('iron-selected'))
+                .to.be.eql(true);
+            Polymer.dom(s1).removeChild(s1.selectedItem);
+
+            s1.addEventListener('iron-items-changed', function() {
+              firstElementChild = Polymer.dom(s1).firstElementChild;
+              expect(firstElementChild).to.be.equal(s1.selectedItem);
+              expect(firstElementChild.classList.contains('iron-selected'))
+                  .to.be.eql(true);
+              done();
+            });
+          });
+          s1.selected = 0;
+        });
+      });
+
+      suite('dynamic selector', function() {
+        test('selects dynamically added child automatically', function(done) {
+          var selector = document.createElement('iron-selector');
+          var child = document.createElement('div');
+
+          selector.selected = '0';
+          child.textContent = 'Item 0';
+
+          Polymer.dom(selector).appendChild(child);
+          document.body.appendChild(selector);
+
+          Polymer.Base.async(function() {
+            assert.equal(child.className, 'iron-selected');
+            document.body.removeChild(selector);
+            done();
+          }, 1);
+        });
+      });
+    });
+
+  </script>
+
+</body>
+</html>