1 <!doctype html> 2 <!-- 3 @license 4 Copyright (c) 2015 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-next-previous</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 <script src="../../test-fixture/test-fixture-mocha.js"></script> 22 23 <link rel="import" href="../../test-fixture/test-fixture.html"> 24 <link rel="import" href="../iron-selector.html"> 25 26 <style> 27 .iron-selected { 28 background: #ccc; 29 } 30 </style> 31 32 </head> 33 <body> 34 35 <test-fixture id="test1"> 36 <template> 37 <iron-selector selected="0"> 38 <div>Item 0</div> 39 <div>Item 1</div> 40 <div>Item 2</div> 41 </iron-selector> 42 </template> 43 </test-fixture> 44 45 <test-fixture id="test2"> 46 <template> 47 <iron-selector selected="foo" attr-for-selected="name"> 48 <div name="foo">Item Foo</div> 49 <div name="bar">Item Bar</div> 50 <div name="zot">Item Zot</div> 51 </iron-selector> 52 </template> 53 </test-fixture> 54 55 <script> 56 57 var s; 58 59 function assertAndSelect(method, expectedIndex) { 60 assert.equal(s.selected, expectedIndex); 61 s[method](); 62 } 63 64 suite('next/previous', function() { 65 66 setup(function () { 67 s = fixture('test1'); 68 }); 69 70 test('selectNext', function() { 71 assert.equal(s.selected, 0); 72 assertAndSelect('selectNext', 0); 73 assertAndSelect('selectNext', 1); 74 assertAndSelect('selectNext', 2); 75 assert.equal(s.selected, 0); 76 }); 77 78 test('selectPrevious', function() { 79 assert.equal(s.selected, 0); 80 assertAndSelect('selectPrevious', 0); 81 assertAndSelect('selectPrevious', 2); 82 assertAndSelect('selectPrevious', 1); 83 assert.equal(s.selected, 0); 84 }); 85 86 test('selectNext/Previous', function() { 87 assert.equal(s.selected, 0); 88 assertAndSelect('selectNext', 0); 89 assertAndSelect('selectNext', 1); 90 assertAndSelect('selectPrevious', 2); 91 assertAndSelect('selectNext', 1); 92 assertAndSelect('selectPrevious', 2); 93 assert.equal(s.selected, 1); 94 }); 95 96 }); 97 98 suite('next/previous attrForSelected', function() { 99 100 setup(function () { 101 s = fixture('test2'); 102 }); 103 104 test('selectNext', function() { 105 assert.equal(s.selected, 'foo'); 106 assertAndSelect('selectNext', 'foo'); 107 assertAndSelect('selectNext', 'bar'); 108 assertAndSelect('selectNext', 'zot'); 109 assert.equal(s.selected, 'foo'); 110 }); 111 112 test('selectPrevious', function() { 113 assert.equal(s.selected, 'foo'); 114 assertAndSelect('selectPrevious', 'foo'); 115 assertAndSelect('selectPrevious', 'zot'); 116 assertAndSelect('selectPrevious', 'bar'); 117 assert.equal(s.selected, 'foo'); 118 }); 119 120 test('selectNext/Previous', function() { 121 assert.equal(s.selected, 'foo'); 122 assertAndSelect('selectNext', 'foo'); 123 assertAndSelect('selectNext', 'bar'); 124 assertAndSelect('selectPrevious', 'zot'); 125 assertAndSelect('selectNext', 'bar'); 126 assertAndSelect('selectPrevious', 'zot'); 127 assert.equal(s.selected, 'bar'); 128 }); 129 130 }); 131 132 </script> 133 134 </body> 135 </html> 136
