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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: LayoutTests/fast/events/touch/gesture/touch-gesture-scroll-input-field.html

Issue 22488004: Made text inside <input> elements scrollable using touch gestures (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: CR Fixes Created 7 years, 4 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
« no previous file with comments | « no previous file | LayoutTests/fast/events/touch/gesture/touch-gesture-scroll-input-field-expected.txt » ('j') | Source/core/rendering/RenderLayer.cpp » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <link rel="stylesheet" href="../../../js/resources/js-test-style.css">
5 <script src="../../../js/resources/js-test-pre.js"></script>
6 <script src="resources/gesture-helpers.js"></script>
7
8 </head>
9
10 <body style="margin:0" onload="runTest()">
11 <div id="container" style="width: 500px; height: 200px; overflow-y: scroll ; overflow-x: scroll">
12 <form>
13 <input id="box" size="10" style="height:100px; font-size:xx-large" type="text" value="asasd;flkajsd;flkasjdf;alksdjf;alskdfja;lksdja;sdlfjkas;ldkf "></input>
14 </form>
15 <div style="background: green; height: 1000px; width: 1000px"></div>
16 </div>
17
18 <p id="description"></p>
19 <div id="console"></div>
20
21 <script type="text/javascript">
22 var gestureX = 200;
23 var gestureY = 50;
24 var box;
25 var container;
26 var scrollableArea;
27
28 function resetScroll()
29 {
30 container.scrollLeft = 0;
31 box.scrollLeft = 0;
32 container.scrollTop = 0;
33 box.scrollTop = 0;
34 }
35
36 function testFlingGestureScroll()
37 {
38 debug("===Testing fling behavior===");
39 resetScroll();
40
41 shouldBe('box.scrollLeft', '0');
42 shouldBe('container.scrollLeft', '0');
43
44 eventSender.gestureScrollBegin(gestureX, gestureY);
45 eventSender.gestureScrollUpdateWithoutPropagation(-10, 0);
46 eventSender.gestureScrollUpdateWithoutPropagation(-10, 0);
47 eventSender.gestureScrollUpdateWithoutPropagation(-10, 0);
48 eventSender.gestureScrollUpdateWithoutPropagation(-10, 0);
49 eventSender.gestureScrollEnd(0, 0);
50
51 debug("Flinging input text should scroll text by the specified amoun t");
52 shouldBe('box.scrollLeft', '40');
53 shouldBe('container.scrollLeft', '0');
54
55 resetScroll();
56
57 eventSender.gestureScrollBegin(gestureX, gestureY);
58 eventSender.gestureScrollUpdateWithoutPropagation(-scrollableArea, 0 );
59 eventSender.gestureScrollUpdateWithoutPropagation(-300, 0);
60 eventSender.gestureScrollUpdateWithoutPropagation(-100, 0);
61 eventSender.gestureScrollUpdateWithoutPropagation(-100, 0);
62 eventSender.gestureScrollEnd(0, 0);
63
64 debug("Flinging input text past the scrollable width shouldn't scrol l containing div");
65 shouldBe('box.scrollLeft', (box.scrollWidth - box.clientWidth).toStr ing());
66 shouldBe('container.scrollLeft', '0');
67
68 eventSender.gestureScrollBegin(gestureX, gestureY);
69 eventSender.gestureScrollUpdateWithoutPropagation(-30, 0);
70 eventSender.gestureScrollUpdateWithoutPropagation(-30, 0);
71 eventSender.gestureScrollEnd(0, 0);
72
73 debug("Flinging fully scrolled input text should fling containing di v");
74 shouldBe('box.scrollLeft', (box.scrollWidth - box.clientWidth).toStr ing());
75 shouldBe('container.scrollLeft', '60');
76 }
77
78 function testGestureScroll()
79 {
80 debug("===Testing scroll behavior===");
81 resetScroll();
82
83 shouldBe('box.scrollLeft', '0');
84 shouldBe('container.scrollLeft', '0');
85
86 eventSender.gestureScrollBegin(gestureX, gestureY);
87 eventSender.gestureScrollUpdate(-30, 0);
88 eventSender.gestureScrollUpdate(-30, 0);
89 eventSender.gestureScrollEnd(0, 0);
90
91 debug("Gesture scrolling input text should scroll text the specified amount");
92 shouldBe('box.scrollLeft', '60');
93 shouldBe('container.scrollLeft', '0');
94
95 resetScroll();
96
97 eventSender.gestureScrollBegin(gestureX, gestureY);
98 eventSender.gestureScrollUpdate(-scrollableArea, 0);
99 eventSender.gestureScrollUpdate(-50, 0);
100 eventSender.gestureScrollEnd(0, 0);
101
102 debug("Gesture scrolling input text past scroll width should scroll container div");
103 shouldBe('box.scrollLeft', (box.scrollWidth - box.clientWidth).toStr ing());
104 shouldBe('container.scrollLeft', '50');
105 }
106
107 function testVerticalScroll()
108 {
109 debug("===Testing vertical scroll behavior===");
110 resetScroll();
111
112 shouldBe('box.scrollTop', '0');
113 shouldBe('container.scrollTop', '0');
114
115 eventSender.gestureScrollBegin(gestureX, gestureY);
116 eventSender.gestureScrollUpdate(0, -30);
117 eventSender.gestureScrollUpdate(0, -30);
118 eventSender.gestureScrollEnd(0, 0);
119
120 debug("Vertically gesture scrolling input text should scroll contain ing div the specified amount");
121 shouldBe('box.scrollTop', '0');
122 shouldBe('container.scrollTop', '60');
123
124 resetScroll();
125
126 shouldBe('box.scrollTop', '0');
127 shouldBe('container.scrollTop', '0');
128
129 eventSender.gestureScrollBegin(gestureX, gestureY);
130 eventSender.gestureScrollUpdateWithoutPropagation(0, -30);
131 eventSender.gestureScrollUpdateWithoutPropagation(0, -30);
132 eventSender.gestureScrollEnd(0, 0);
133
134 debug("Vertically flinging input text should scroll the containing d iv the specified amount");
135 shouldBe('box.scrollTop', '0');
136 shouldBe('container.scrollTop', '60');
137 }
138
139 function testNonOverflowingText()
140 {
141 debug("===Testing non-overflow scroll behavior===");
142 box.value = "short";
143
144 debug("Input box without overflow should not scroll");
145 shouldBe('box.scrollLeft', '0');
146 shouldBe('container.scrollLeft', '0');
147 shouldBe('box.clientWidth >= box.scrollWidth', 'true');
148
149 eventSender.gestureScrollBegin(gestureX, gestureY);
150 eventSender.gestureScrollUpdate(-30, 0);
151 eventSender.gestureScrollUpdateWithoutPropagation(-30, 0);
152 eventSender.gestureScrollEnd(0, 0);
153
154 shouldBe('box.scrollLeft', '0');
155 shouldBe('container.scrollLeft', '60');
156 }
157
158 if (window.testRunner)
159 testRunner.waitUntilDone();
160
161 function runTest()
162 {
163 box = document.getElementById("box");
164 container = document.getElementById("container");
165
166 scrollableArea = box.scrollWidth - box.clientWidth;
167
168 if (window.eventSender) {
169 description('This tests that an input text field can be properly scrolled with touch gestures');
170
171 if (checkTestDependencies() && window.eventSender.gestureScrollU pdateWithoutPropagation) {
172 testFlingGestureScroll();
173 testGestureScroll();
174 testVerticalScroll();
175 testNonOverflowingText();
176 testRunner.notifyDone();
177 } else
178 exitIfNecessary();
179 } else {
180 debug("This test requires DumpRenderTree. Gesture-scroll the pa ge to validate the implementation.");
181 }
182 }
183 </script>
184 </body>
185 </html>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/fast/events/touch/gesture/touch-gesture-scroll-input-field-expected.txt » ('j') | Source/core/rendering/RenderLayer.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698