| OLD | NEW |
|---|
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <body> |
| 4 |
| 5 <script> |
| 6 |
| 7 function setUp() { |
| 8 loadTimeData.data = { |
| 9 'deletableItemDeleteButtonTitle': 'test_deletable_button_title' |
| 10 }; |
| 11 |
| 12 cr.define('options', function() { |
| 13 /** @const */ var InlineEditableItemList = options.InlineEditableItemList; |
| 14 /** @const */ var InlineEditableItem = options.InlineEditableItem; |
| 15 |
| 16 /** |
| 17 * Creates a test list item. |
| 18 * @param {string} name This item's name. |
| 19 * @constructor |
| 20 * @extends {options.InlineEditableItem} |
| 21 */ |
| 22 function TestItem(name) { |
| 23 var el = cr.doc.createElement('div'); |
| 24 el.name_ = name; |
| 25 TestItem.decorate(el); |
| 26 return el; |
| 27 } |
| 28 |
| 29 /** |
| 30 * Decorates an element as a test list item. |
| 31 * @param {!HTMLElement} el The element to decorate. |
| 32 */ |
| 33 TestItem.decorate = function(el) { |
| 34 el.__proto__ = TestItem.prototype; |
| 35 el.decorate(); |
| 36 }; |
| 37 |
| 38 TestItem.prototype = { |
| 39 __proto__: InlineEditableItem.prototype, |
| 40 |
| 41 /** |
| 42 * Item name. Used to set the item's text fields. |
| 43 * @type {string} |
| 44 * @private |
| 45 */ |
| 46 name_: null, |
| 47 |
| 48 /** @override */ |
| 49 decorate: function() { |
| 50 InlineEditableItem.prototype.decorate.call(this); |
| 51 |
| 52 var fieldEl = this.createEditableTextCell(this.name_); |
| 53 this.contentElement.appendChild(fieldEl); |
| 54 |
| 55 fieldEl = this.createEditableTextCell(this.name_ + '_two'); |
| 56 this.contentElement.appendChild(fieldEl); |
| 57 }, |
| 58 }; |
| 59 |
| 60 /** |
| 61 * @constructor |
| 62 * @extends {options.InlineEditableItemList} |
| 63 */ |
| 64 var TestItemList = cr.ui.define('list'); |
| 65 |
| 66 TestItemList.prototype = { |
| 67 __proto__: InlineEditableItemList.prototype, |
| 68 |
| 69 /** |
| 70 * @override |
| 71 * @param {string} name |
| 72 */ |
| 73 createItem: function(name) { |
| 74 return new TestItem(name); |
| 75 }, |
| 76 |
| 77 /** |
| 78 * @param {!Element} el |
| 79 * @return {boolean} True if |el| or any of its children are focusable. |
| 80 * @private |
| 81 */ |
| 82 hasFocusableElement_: function(el) { |
| 83 return el.querySelectorAll('[tabindex="0"]').length > 0; |
| 84 }, |
| 85 |
| 86 /** |
| 87 * @param {number} itemIndex |
| 88 * @return {boolean} True if item at |itemIndex| has a focusable element |
| 89 * and no other items have focusable elements. |
| 90 */ |
| 91 hasExactlyOneItemFocusable: function(itemIndex) { |
| 92 var length = this.items.length; |
| 93 for(var i = 0; i < length; ++i) { |
| 94 if (this.hasFocusableElement_(this.items[i]) != (i == itemIndex)) |
| 95 return false; |
| 96 } |
| 97 return true; |
| 98 }, |
| 99 }; |
| 100 |
| 101 // Export. |
| 102 return { |
| 103 TestItemList: TestItemList |
| 104 }; |
| 105 |
| 106 }) |
| 107 } |
| 108 |
| 109 /** |
| 110 * @param {!EventTarget} target Where to send the event. |
| 111 * @param {!string} keyIdentifier Which key to send. |
| 112 */ |
| 113 function sendKeyDownEvent(target, keyIdentifier) { |
| 114 var event = document.createEvent('KeyboardEvent'); |
| 115 event.initKeyboardEvent('keydown', true, true, window, keyIdentifier); |
| 116 assertEquals(keyIdentifier, event.keyIdentifier); |
| 117 target.dispatchEvent(event); |
| 118 } |
| 119 |
| 120 /** |
| 121 * Test that exactly one item in the list is focusable after navigating the |
| 122 * list using up and down arrow keys. |
| 123 */ |
| 124 function testUpDownFocus() { |
| 125 var list = document.createElement('ul'); |
| 126 list.style.position = 'absolute'; |
| 127 list.style.width = '800px'; |
| 128 list.style.height = '800px'; |
| 129 options.TestItemList.decorate(list); |
| 130 document.body.appendChild(list); |
| 131 |
| 132 var model = new cr.ui.ArrayDataModel(['itemA', 'itemB', 'itemC']); |
| 133 list.dataModel = model; |
| 134 list.selectionModel.setIndexSelected(0, true); |
| 135 list.selectionModel.leadIndex = 0; |
| 136 |
| 137 assertTrue(list.hasExactlyOneItemFocusable(0)); |
| 138 sendKeyDownEvent(list, 'Down'); |
| 139 assertTrue(list.hasExactlyOneItemFocusable(1)); |
| 140 sendKeyDownEvent(list, 'Down'); |
| 141 assertTrue(list.hasExactlyOneItemFocusable(2)); |
| 142 sendKeyDownEvent(list, 'Up'); |
| 143 assertTrue(list.hasExactlyOneItemFocusable(1)); |
| 144 sendKeyDownEvent(list, 'Up'); |
| 145 assertTrue(list.hasExactlyOneItemFocusable(0)); |
| 146 sendKeyDownEvent(list, 'Down'); |
| 147 assertTrue(list.hasExactlyOneItemFocusable(1)); |
| 148 } |
| 149 |
| 150 </script> |
| 151 |
| 152 </body> |
| 153 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 683813004:
Fewer focusable items in chrome://settings/searchEngines (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master