Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(486)

Side by Side Diff: chrome/test/data/webui/cr_elements/cr_dialog_test.js

Issue 2795353002: WebUI: For cr-dialog, handle Enter keys in paper-inputs. (Closed)
Patch Set: fix test Created 3 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 // Copyright 2016 The Chromium Authors. All rights reserved. 1 // Copyright 2016 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 suite('cr-dialog', function() { 5 suite('cr-dialog', function() {
6 setup(function() { 6 setup(function() {
7 PolymerTest.clearBody(); 7 PolymerTest.clearBody();
8 }); 8 });
9 9
10 test('focuses title on show', function() { 10 test('focuses title on show', function() {
(...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after
83 }) 83 })
84 var clicked = false; 84 var clicked = false;
85 actionButton.addEventListener('click', function() { 85 actionButton.addEventListener('click', function() {
86 clicked = true; 86 clicked = true;
87 }); 87 });
88 88
89 MockInteractions.keyEventOn(dialog, 'keypress', 13, undefined, 'Enter'); 89 MockInteractions.keyEventOn(dialog, 'keypress', 13, undefined, 'Enter');
90 assertTrue(clicked); 90 assertTrue(clicked);
91 }); 91 });
92 92
93 test('enter keys from paper-inputs (only) are processed', function() {
94 document.body.innerHTML = `
95 <dialog is="cr-dialog">
96 <div class="title">title</div>
97 <div class="body">
98 <paper-input></paper-input>
99 <foobar></foobar>
100 <button class="action-button">active</button>
101 </div>
102 </dialog>`;
103
104 var dialog = document.body.querySelector('dialog');
105
106 var inputElement = document.body.querySelector('paper-input');
107 var otherElement = document.body.querySelector('foobar');
108 var actionButton = document.body.querySelector('.action-button');
109 assertTrue(!!inputElement);
110 assertTrue(!!otherElement);
111 assertTrue(!!actionButton);
112
113 // MockInteractions triggers event listeners synchronously.
114 var clickedCounter = 0;
115 actionButton.addEventListener('click', function() {
116 clickedCounter += 1;
dpapad 2017/04/05 21:34:45 Nit (optional): clickedCounter++;
tommycli 2017/04/05 21:42:48 Done.
117 });
118
119 MockInteractions.keyEventOn(
120 otherElement, 'keypress', 13, undefined, 'Enter');
dpapad 2017/04/05 21:34:45 Nit (optional): Can we make a helper function pre
tommycli 2017/04/05 21:42:48 Done.
121 assertEquals(0, clickedCounter);
122
123 MockInteractions.keyEventOn(
124 inputElement, 'keypress', 13, undefined, 'Enter');
125 assertEquals(1, clickedCounter);
126 });
127
93 test('focuses [autofocus] instead of title when present', function() { 128 test('focuses [autofocus] instead of title when present', function() {
94 document.body.innerHTML = ` 129 document.body.innerHTML = `
95 <dialog is="cr-dialog"> 130 <dialog is="cr-dialog">
96 <div class="title">title</div> 131 <div class="title">title</div>
97 <div class="body"><button autofocus>button</button></div> 132 <div class="body"><button autofocus>button</button></div>
98 </dialog>`; 133 </dialog>`;
99 134
100 var dialog = document.body.querySelector('dialog'); 135 var dialog = document.body.querySelector('dialog');
101 var button = document.body.querySelector('button'); 136 var button = document.body.querySelector('button');
102 137
(...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after
136 } 171 }
137 }); 172 });
138 observer.observe(bodyContainer, {attributes: true}); 173 observer.observe(bodyContainer, {attributes: true});
139 174
140 // Height is normally set via CSS, but mixin doesn't work with innerHTML. 175 // Height is normally set via CSS, but mixin doesn't work with innerHTML.
141 bodyContainer.style.height = '1px'; 176 bodyContainer.style.height = '1px';
142 bodyContainer.scrollTop = 100; 177 bodyContainer.scrollTop = 100;
143 dialog.showModal(); // Attach the dialog for the first time here. 178 dialog.showModal(); // Attach the dialog for the first time here.
144 }); 179 });
145 }); 180 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698