OLD | NEW |
1 TestRunner.addResult('Test ListControl rendering for variable height case.'); | 1 TestRunner.addResult('Test ListControl rendering and selection for grow mode.'); |
2 | 2 |
3 class Delegate { | 3 class Delegate { |
4 constructor() { | 4 constructor() { |
5 } | 5 } |
6 | 6 |
7 createElementForItem(item) { | 7 createElementForItem(item) { |
8 TestRunner.addResult('Creating element for ' + item); | 8 TestRunner.addResult('Creating element for ' + item); |
9 var element = document.createElement('div'); | 9 var element = document.createElement('div'); |
10 element.style.height = this.heightForItem(item) + 'px'; | 10 element.style.height = (10 + item % 5) + 'px'; |
11 element.textContent = item; | 11 element.textContent = item; |
12 return element; | 12 return element; |
13 } | 13 } |
14 | 14 |
15 heightForItem(item) { | 15 heightForItem(item) { |
16 return 7 + item % 10; | 16 TestRunner.addResult('heightForItem should not be called'); |
| 17 return 10 + item % 5; |
17 } | 18 } |
18 | 19 |
19 isItemSelectable(item) { | 20 isItemSelectable(item) { |
20 return (item % 5 === 0) || (item % 5 === 2); | 21 return (item % 5 === 0) || (item % 5 === 2); |
21 } | 22 } |
22 | 23 |
23 selectedItemChanged(from, to, fromElement, toElement) { | 24 selectedItemChanged(from, to, fromElement, toElement) { |
24 TestRunner.addResult('Selection changed from ' + from + ' to ' + to); | 25 TestRunner.addResult('Selection changed from ' + from + ' to ' + to); |
25 if (fromElement) | 26 if (fromElement) |
26 fromElement.classList.remove('selected'); | 27 fromElement.classList.remove('selected'); |
27 if (toElement) | 28 if (toElement) |
28 toElement.classList.add('selected'); | 29 toElement.classList.add('selected'); |
29 } | 30 } |
30 } | 31 } |
31 | 32 |
32 var delegate = new Delegate(); | 33 var delegate = new Delegate(); |
33 var list = new UI.ListControl(delegate); | 34 var list = new UI.ListControl(delegate); |
34 list.setHeightMode(UI.ListHeightMode.Variable); | 35 list.setMode(UI.ListMode.Grow); |
35 list.element.style.height = '73px'; | |
36 UI.inspectorView.element.appendChild(list.element); | 36 UI.inspectorView.element.appendChild(list.element); |
37 | 37 |
38 function dumpList() | 38 function dumpList() |
39 { | 39 { |
40 var height = list.element.offsetHeight; | 40 var height = list.element.offsetHeight; |
41 TestRunner.addResult(`----list[length=${list.length()}][height=${height}]----`
); | 41 TestRunner.addResult(`----list[length=${list.length()}][height=${height}]----`
); |
42 for (var child of list.element.children) { | 42 for (var child of list.element.children) { |
43 var offsetTop = child.getBoundingClientRect().top - list.element.getBounding
ClientRect().top; | 43 var offsetTop = child.getBoundingClientRect().top - list.element.getBounding
ClientRect().top; |
44 var offsetBottom = child.getBoundingClientRect().bottom - list.element.getBo
undingClientRect().top; | 44 var offsetBottom = child.getBoundingClientRect().bottom - list.element.getBo
undingClientRect().top; |
45 var visible = (offsetBottom <= 0 || offsetTop >= height) ? ' ' : | 45 var visible = (offsetBottom <= 0 || offsetTop >= height) ? ' ' : |
46 (offsetTop >= 0 && offsetBottom <= height ? '*' : '+'); | 46 (offsetTop >= 0 && offsetBottom <= height ? '*' : '+'); |
47 var selected = child.classList.contains('selected') ? ' (selected)' : ''; | 47 var selected = child.classList.contains('selected') ? ' (selected)' : ''; |
48 var text = child === list._topElement ? 'top' : (child === list._bottomEleme
nt ? 'bottom' : child.textContent); | 48 var text = child === list._topElement ? 'top' : (child === list._bottomEleme
nt ? 'bottom' : child.textContent); |
49 TestRunner.addResult(`${visible}[${offsetTop}] ${text}${selected}`); | 49 TestRunner.addResult(`${visible}[${offsetTop}] ${text}${selected}`); |
50 } | 50 } |
51 TestRunner.addResult('offsets: ' + list._variableOffsets.join(' ')); | |
52 TestRunner.addResult(''); | 51 TestRunner.addResult(''); |
53 } | 52 } |
54 | 53 |
55 TestRunner.addResult('Adding 0, 1, 2'); | 54 TestRunner.addResult('Adding 0, 1, 2'); |
56 list.replaceAllItems([0, 1, 2]); | 55 list.replaceAllItems([0, 1, 2]); |
57 dumpList(); | 56 dumpList(); |
58 | 57 |
59 TestRunner.addResult('Scrolling to 0'); | 58 TestRunner.addResult('Scrolling to 0'); |
60 list.scrollItemAtIndexIntoView(0); | 59 list.scrollItemAtIndexIntoView(0); |
61 dumpList(); | 60 dumpList(); |
62 | 61 |
63 TestRunner.addResult('Scrolling to 2'); | 62 TestRunner.addResult('Scrolling to 2'); |
64 list.scrollItemAtIndexIntoView(2); | 63 list.scrollItemAtIndexIntoView(2); |
65 dumpList(); | 64 dumpList(); |
66 | 65 |
67 TestRunner.addResult('Adding 3-20'); | 66 TestRunner.addResult('Adding 3-20'); |
68 list.replaceItemsInRange(3, 3, [3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16,
17, 18, 19]); | 67 list.replaceItemsInRange(3, 3, [3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16,
17, 18, 19]); |
69 dumpList(); | 68 dumpList(); |
70 | 69 |
71 TestRunner.addResult('Scrolling to 11'); | |
72 list.scrollItemAtIndexIntoView(11); | |
73 dumpList(); | |
74 | |
75 TestRunner.addResult('Scrolling to 19'); | 70 TestRunner.addResult('Scrolling to 19'); |
76 list.scrollItemAtIndexIntoView(19); | 71 list.scrollItemAtIndexIntoView(19); |
77 dumpList(); | 72 dumpList(); |
78 | 73 |
79 TestRunner.addResult('Scrolling to 16'); | |
80 list.scrollItemAtIndexIntoView(16); | |
81 dumpList(); | |
82 | |
83 TestRunner.addResult('Scrolling to 3'); | |
84 list.scrollItemAtIndexIntoView(3); | |
85 dumpList(); | |
86 | |
87 TestRunner.addResult('Replacing 0, 1 with 25-36'); | 74 TestRunner.addResult('Replacing 0, 1 with 25-36'); |
88 list.replaceItemsInRange(0, 2, [25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36])
; | 75 list.replaceItemsInRange(0, 2, [25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36])
; |
89 dumpList(); | 76 dumpList(); |
90 | 77 |
91 TestRunner.addResult('Scrolling to 18'); | 78 TestRunner.addResult('Scrolling to 18'); |
92 list.scrollItemAtIndexIntoView(28); | 79 list.scrollItemAtIndexIntoView(28); |
93 dumpList(); | 80 dumpList(); |
94 | 81 |
95 TestRunner.addResult('Replacing 25-36 with 0-1'); | 82 TestRunner.addResult('Replacing 25-36 with 0-1'); |
96 list.replaceItemsInRange(0, 12, [0, 1]); | 83 list.replaceItemsInRange(0, 12, [0, 1]); |
97 dumpList(); | 84 dumpList(); |
98 | 85 |
99 TestRunner.addResult('Replacing 16-18 with 45'); | 86 TestRunner.addResult('Replacing 16-18 with 45'); |
100 list.replaceItemsInRange(16, 19, [45]); | 87 list.replaceItemsInRange(16, 19, [45]); |
101 dumpList(); | 88 dumpList(); |
102 | 89 |
103 TestRunner.addResult('Scrolling to 4'); | 90 TestRunner.addResult('Scrolling to 4'); |
104 list.scrollItemAtIndexIntoView(4); | 91 list.scrollItemAtIndexIntoView(4); |
105 dumpList(); | 92 dumpList(); |
106 | 93 |
107 TestRunner.addResult('Replacing 45 with 16-18'); | 94 TestRunner.addResult('Replacing 45 with 16-18'); |
108 list.replaceItemsInRange(16, 17, [16, 17, 18]); | 95 list.replaceItemsInRange(16, 17, [16, 17, 18]); |
109 dumpList(); | 96 dumpList(); |
110 | 97 |
111 TestRunner.addResult('Resizing'); | |
112 list.element.style.height = '190px'; | |
113 list.viewportResized(); | |
114 dumpList(); | |
115 | |
116 TestRunner.completeTest(); | 98 TestRunner.completeTest(); |
OLD | NEW |