1 <!doctype html> 2 <!-- 3 @license 4 Copyright (c) 2016 The Polymer Project Authors. All rights reserved. 5 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 6 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 7 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 8 Code distributed by Google as part of the polymer project is also 9 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 10 --> 11 12 <html> 13 <head> 14 15 <title>iron-selector-numeric-ids</title> 16 <meta charset="utf-8"> 17 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"> 18 19 <script src="../../webcomponentsjs/webcomponents-lite.js"></script> 20 <script src="../../web-component-tester/browser.js"></script> 21 22 <link rel="import" href="../iron-selector.html"> 23 24 <style> 25 .iron-selected { 26 background: #ccc; 27 } 28 </style> 29 30 </head> 31 <body> 32 33 <template is="dom-bind"> 34 <iron-selector id="selector" attr-for-selected="name"> 35 <template id="t" is="dom-repeat"> 36 <div name="[[item.id]]">{{item.name}}</div> 37 </template> 38 </iron-selector> 39 </template> 40 41 <script> 42 43 suite('select by a numeric property', function() { 44 45 var scope, s, t; 46 47 setup(function() { 48 scope = document.querySelector('template[is="dom-bind"]'); 49 s = scope.$.selector; 50 t = scope.$.t; 51 t.items = [{ id: 0, name:'item0'}, {id: 1, name: 'item1'}, {id: 2, name: 'item2'}]; 52 }); 53 54 teardown(function() { 55 t.items = []; 56 }); 57 58 test('select a value of zero', function() { 59 t.render(); 60 s.selected = 1; 61 assert.equal(s.selected, '1'); 62 63 // select item with a name value of 0 64 s.children[0].dispatchEvent(new CustomEvent('tap', {bubbles: true})); 65 assert.equal(s.selected, 0); 66 }); 67 68 }); 69 70 </script> 71 72 </body> 73 </html> 74
