| OLD | NEW |
|---|
| (Empty) |
| 1 <!doctype html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <title>polymer-selector-basic</title> | |
| 5 <script src="../../../platform/platform.js"></script> | |
| 6 <script src="../../../tools/test/htmltest.js"></script> | |
| 7 <script src="../../../tools/test/chai/chai.js"></script> | |
| 8 <link rel="import" href="../../polymer-selector.html"> | |
| 9 <style> | |
| 10 .polymer-selected { | |
| 11 background: #ccc; | |
| 12 } | |
| 13 | |
| 14 .my-selected { | |
| 15 background: red; | |
| 16 } | |
| 17 </style> | |
| 18 </head> | |
| 19 <body> | |
| 20 | |
| 21 <polymer-selector id="selector1"> | |
| 22 <div>Item 1</div> | |
| 23 <div>Item 2</div> | |
| 24 <div>Item 3</div> | |
| 25 <div>Item 4</div> | |
| 26 <div>Item 5</div> | |
| 27 </polymer-selector> | |
| 28 | |
| 29 <br><br> | |
| 30 | |
| 31 <polymer-selector id="selector2" selected="item3" selectedClass="my-selected"
valueattr="id"> | |
| 32 <div id="item1">Item 1</div> | |
| 33 <div id="item2">Item 2</div> | |
| 34 <div id="item3">Item 3</div> | |
| 35 <div id="item4">Item 4</div> | |
| 36 <div id="item5">Item 5</div> | |
| 37 </polymer-selector> | |
| 38 | |
| 39 <script> | |
| 40 var assert = chai.assert; | |
| 41 var async = requestAnimationFrame; | |
| 42 | |
| 43 function oneMutation(node, options, cb) { | |
| 44 var o = new MutationObserver(function() { | |
| 45 cb(); | |
| 46 o.disconnect(); | |
| 47 }); | |
| 48 o.observe(node, options); | |
| 49 } | |
| 50 | |
| 51 document.addEventListener('polymer-ready', function() { | |
| 52 // selector1 | |
| 53 var s = document.querySelector('#selector1'); | |
| 54 assert.equal(s.selected, null); | |
| 55 assert.equal(s.selectedClass, 'polymer-selected'); | |
| 56 assert.isFalse(s.multi); | |
| 57 assert.equal(s.valueattr, 'name'); | |
| 58 assert.equal(s.items.length, 5); | |
| 59 // selector2 | |
| 60 s = document.querySelector('#selector2'); | |
| 61 assert.equal(s.selected, "item3"); | |
| 62 assert.equal(s.selectedClass, 'my-selected'); | |
| 63 // setup listener for polymer-select event | |
| 64 var selectEventCounter = 0; | |
| 65 s.addEventListener('polymer-select', function(e) { | |
| 66 if (e.detail.isSelected) { | |
| 67 selectEventCounter++; | |
| 68 // selectedItem and detail.item should be the same | |
| 69 assert.equal(e.detail.item, s.selectedItem); | |
| 70 } | |
| 71 }); | |
| 72 // set selected | |
| 73 s.selected = 'item5'; | |
| 74 Platform.flush(); | |
| 75 oneMutation(s, {attributes: true}, function() { | |
| 76 // check polymer-select event | |
| 77 assert.equal(selectEventCounter, 1); | |
| 78 // check selected class | |
| 79 assert.isTrue(s.children[4].classList.contains('my-selected')); | |
| 80 // check selectedItem | |
| 81 assert.equal(s.selectedItem, s.children[4]); | |
| 82 // selecting the same value shouldn't fire polymer-select | |
| 83 selectEventCounter = 0; | |
| 84 s.selected = 'item5'; | |
| 85 Platform.flush(); | |
| 86 // TODO(ffu): would be better to wait for something to happen | |
| 87 // instead of not to happen | |
| 88 setTimeout(function() { | |
| 89 assert.equal(selectEventCounter, 0); | |
| 90 done(); | |
| 91 }, 50); | |
| 92 }); | |
| 93 }); | |
| 94 </script> | |
| 95 </body> | |
| 96 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 236733003:
Remove the need for <polymer-selector> in the PDF plugin. (Closed)
Base URL: svn://svn.chromium.org/chrome/trunk/src