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

Side by Side Diff: third_party/WebKit/LayoutTests/inspector-protocol/emulation/device-emulation-test.js

Issue 2942573003: [DevTools] New harness for inspector-protocol layout tests (Closed)
Patch Set: Protocol -> dp Created 3 years, 6 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
(Empty)
1 function setMetaViewport(override)
2 {
3 var VIEWPORTS = {
4 "w=320": "width=320",
5 "w=dw": "width=device-width",
6 "w=980": "width=980",
7 "none": "no viewport (desktop site)"
8 };
9
10 var viewport = VIEWPORTS["none"];
11 for (var key in VIEWPORTS) {
12 if (location.search.indexOf(key) !== -1) {
13 viewport = VIEWPORTS[key];
14 window.__viewport = key;
15 break;
16 }
17 }
18 if (override) {
19 viewport = VIEWPORTS[override];
20 window.__viewport = override;
21 }
22 if (viewport != VIEWPORTS["none"])
23 document.write('<meta name="viewport" content="'+viewport+'">');
24 }
25
26 // matchMedia() polyfill from https://github.com/paulirish/matchMedia.js
27 // Authors & copyright (c) 2012: Scott Jehl, Paul Irish, Nicholas Zakas. Dual MI T/BSD license
28 window.matchMedia = window.matchMedia || (function(doc, undefined){
29 var bool,
30 docElem = doc.documentElement,
31 refNode = docElem.firstElementChild || docElem.firstChild,
32 // fakeBody required for <FF4 when executed in <head>
33 fakeBody = doc.createElement('body'),
34 div = doc.createElement('div');
35
36 div.id = 'mq-test-1';
37 div.style.cssText = "position:absolute;top:-100em";
38 fakeBody.style.background = "none";
39 fakeBody.appendChild(div);
40
41 return function(q){
42 div.innerHTML = '&shy;<style media="'+q+'"> #mq-test-1 { width: 42px; }< /style>';
43
44 docElem.insertBefore(fakeBody, refNode);
45 bool = div.offsetWidth == 42;
46 docElem.removeChild(fakeBody);
47
48 return { matches: bool, media: q };
49 };
50 })(document);
51
52 var results;
53
54 function dumpMetrics(full)
55 {
56 results = [];
57 writeResult("Device:", "");
58 testJS("window.screenX");
59 testJS("window.screenY");
60
61 writeResult("Viewport:", "?" + window.__viewport);
62
63 testMQOrientation();
64 testJS("window.orientation", "");
65
66 if (full) {
67 testMQDimension("resolution", null, "dpi");
68 testMQDevicePixelRatio(window.devicePixelRatio);
69 testJS("window.devicePixelRatio", "");
70 }
71
72 writeResult("Widths:", "");
73
74 if (full) {
75 testMQDimension("device-width", screen.width);
76 testJS("screen.width");
77 testJS("screen.availWidth");
78 testJS("window.outerWidth");
79 testJS("window.innerWidth");
80 testMQDimension("width", document.documentElement.clientWidth);
81 }
82 testJS("document.documentElement.clientWidth");
83 testJS("document.documentElement.offsetWidth");
84 testJS("document.documentElement.scrollWidth");
85 if (full)
86 testJS("document.body.clientWidth");
87 testJS("document.body.offsetWidth");
88 testJS("document.body.scrollWidth");
89
90 writeResult("Heights:", "");
91
92 if (full) {
93 testMQDimension("device-height", screen.height);
94 testJS("screen.height");
95 testJS("screen.availHeight");
96 testJS("window.outerHeight");
97 testJS("window.innerHeight");
98 testMQDimension("height", document.documentElement.clientHeight);
99 }
100 testJS("document.documentElement.clientHeight");
101 testJS("document.documentElement.offsetHeight");
102 testJS("document.documentElement.scrollHeight");
103 if (full)
104 testJS("document.body.clientHeight");
105 testJS("document.body.offsetHeight");
106 testJS("document.body.scrollHeight");
107
108 var measured = document.querySelectorAll(".device-emulation-measure");
109 for (var i = 0; i < measured.length; ++i)
110 writeResult("measured " + measured[i].getAttribute("type") + ": " + meas ured[i].offsetWidth + "x" + measured[i].offsetHeight);
111
112 return results.join("\n");
113 }
114
115 function testJS(expr, unit)
116 {
117 if (unit === undefined)
118 unit = "px";
119
120 var ans = eval(expr);
121 if (typeof ans == "number")
122 ans += unit;
123
124 // Shorten long properties to make more readable
125 expr = expr.replace("documentElement", "docElem").replace("document", "doc") ;
126
127 writeResult(expr, ans);
128 }
129
130 function testMQOrientation()
131 {
132 if (matchMedia("screen and (orientation: portrait)").matches)
133 writeResult("@media orientation", "portrait");
134 else if (matchMedia("screen and (orientation: landscape)").matches)
135 writeResult("@media orientation", "landscape");
136 else
137 writeResult("@media orientation", "???");
138 }
139
140 function testMQDevicePixelRatio(guess)
141 {
142 // To save time, try the guess value first; otherwise try common values (TOD O: binary search).
143 if (matchMedia("screen and (-webkit-device-pixel-ratio: "+guess+"), screen a nd (device-pixel-ratio: "+guess+")").matches)
144 writeResult("@media device-pixel-ratio", guess);
145 else if (matchMedia("screen and (-webkit-device-pixel-ratio: 2), screen and (device-pixel-ratio: 2)").matches)
146 writeResult("@media device-pixel-ratio", "2");
147 else if (matchMedia("screen and (-webkit-device-pixel-ratio: 1.5), screen an d (device-pixel-ratio: 1.5)").matches)
148 writeResult("@media device-pixel-ratio", "1.5");
149 else if (matchMedia("screen and (-webkit-device-pixel-ratio: 1), screen and (device-pixel-ratio: 1)").matches)
150 writeResult("@media device-pixel-ratio", "1");
151 else if (matchMedia("screen and (-webkit-device-pixel-ratio: 2.25), screen a nd (device-pixel-ratio: 2.25)").matches)
152 writeResult("@media device-pixel-ratio", "2.25");
153 else
154 writeResult("@media device-pixel-ratio", "???");
155 }
156
157 function testMQDimension(feature, guess, unit)
158 {
159 unit = unit || "px";
160 // To save time, try the guess value first; otherwise binary search.
161 if (guess && matchMedia("screen and (" + feature + ":" + guess + unit + ")") .matches) {
162 writeResult("@media " + feature, guess + unit);
163 } else {
164 var val = mqBinarySearch(feature, 1, 2560, unit);
165 writeResult("@media " + feature, val ? val + unit : "???");
166 }
167 }
168
169 // Searches the inclusive range [minValue, maxValue].
170 function mqBinarySearch(feature, minValue, maxValue, unit)
171 {
172 if (minValue == maxValue) {
173 if (matchMedia("screen and (" + feature + ":" + minValue + unit + ")").m atches)
174 return minValue;
175 else
176 return null;
177 }
178 var mid = Math.ceil((minValue + maxValue) / 2);
179 if (matchMedia("screen and (min-" + feature + ":" + mid + unit + ")").matche s)
180 return mqBinarySearch(feature, mid, maxValue, unit); // feature is >= mi d
181 else
182 return mqBinarySearch(feature, minValue, mid - 1, unit); // feature is < mid
183 }
184
185 function writeResult(key, val)
186 {
187 results.push(key + (val ? " = " + val : ""));
188 }
189
190 var initialize_DeviceEmulationTest = function() {
191
192 InspectorTest.getPageMetrics = function(full, callback)
193 {
194 InspectorTest.evaluateInPage("dumpMetrics(" + full + ")", callback);
195 }
196
197 InspectorTest.applyEmulationAndReload = function(enabled, width, height, deviceS caleFactor, viewport, insets, noReload, callback)
198 {
199 if (enabled) {
200 var params = {};
201 params.width = width;
202 params.height = height;
203 params.deviceScaleFactor = deviceScaleFactor;
204 params.mobile = true;
205 params.fitWindow = false;
206 params.scale = 1;
207 params.screenWidth = width;
208 params.screenHeight = height;
209 params.positionX = 0;
210 params.positionY = 0;
211 if (insets) {
212 params.screenWidth += insets.left + insets.right;
213 params.positionX = insets.left;
214 params.screenHeight += insets.top + insets.bottom;
215 params.positionY = insets.top;
216 }
217 InspectorTest.sendCommand("Emulation.setDeviceMetricsOverride", params, emulateCallback);
218 } else {
219 InspectorTest.sendCommand("Emulation.clearDeviceMetricsOverride", {}, em ulateCallback);
220 }
221
222 function emulateCallback(result)
223 {
224 if (result.error)
225 InspectorTest._deviceEmulationResults.push("Error: " + result.error) ;
226 if (noReload)
227 callback();
228 else
229 InspectorTest.navigate(InspectorTest._deviceEmulationPageUrl + "?" + viewport, callback);
230 }
231 };
232
233 InspectorTest.emulateAndGetMetrics = function(width, height, deviceScaleFactor, viewport, insets, noReload, callback)
234 {
235 InspectorTest._deviceEmulationResults.push("Emulating device: " + width + "x " + height + "x" + deviceScaleFactor + " viewport='" + viewport + "'");
236 var full = !!width && !!height && !!deviceScaleFactor;
237 InspectorTest.applyEmulationAndReload(true, width, height, deviceScaleFactor , viewport, insets, noReload, InspectorTest.getPageMetrics.bind(InspectorTest, f ull, printMetrics));
238
239 function printMetrics(metrics)
240 {
241 InspectorTest._deviceEmulationResults.push(metrics + "\n");
242 callback();
243 }
244 };
245
246 InspectorTest.testDeviceEmulation = function(pageUrl, width, height, deviceScale Factor, viewport, insets, noReload)
247 {
248 InspectorTest._deviceEmulationPageUrl = pageUrl;
249 InspectorTest._deviceEmulationResults = [];
250 InspectorTest.emulateAndGetMetrics(width, height, deviceScaleFactor, viewpor t, insets, noReload, callback);
251
252 function callback()
253 {
254 InspectorTest.log(InspectorTest._deviceEmulationResults.join("\n"));
255 InspectorTest.completeTest();
256 }
257 };
258
259 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698