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

Side by Side Diff: LayoutTests/inspector/layers/layers-panel-mouse-events.html

Issue 177353005: Layers view: Extract zoom/pan/rotate logic into transorm controller (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: added rounding of layer divs positions and sizes, fixed the test Created 6 years, 9 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 | Annotate | Revision Log
« no previous file with comments | « no previous file | Source/devtools/devtools.gypi » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <html> 1 <html>
2 <head> 2 <head>
3 <style> 3 <style>
4 .layer { 4 .layer {
5 position: absolute; 5 position: absolute;
6 -webkit-transform: translateZ(10px); 6 -webkit-transform: translateZ(10px);
7 opacity: 0.8; 7 opacity: 0.8;
8 left: 20px; 8 left: 20px;
9 top: 20px; 9 top: 20px;
10 } 10 }
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after
55 InspectorTest.dispatchMouseEventToLayerTree = function(eventType, button, layer) 55 InspectorTest.dispatchMouseEventToLayerTree = function(eventType, button, layer)
56 { 56 {
57 var element = InspectorTest.findLayerTreeElement(layer); 57 var element = InspectorTest.findLayerTreeElement(layer);
58 InspectorTest.assertTrue(!!element); 58 InspectorTest.assertTrue(!!element);
59 InspectorTest.dispatchMouseEvent(eventType, button, element, element.clientW idth >> 1, element.clientHeight >> 1); 59 InspectorTest.dispatchMouseEvent(eventType, button, element, element.clientW idth >> 1, element.clientHeight >> 1);
60 } 60 }
61 61
62 InspectorTest.dispatchMouseEventTo3DView = function(eventType, button, layer) 62 InspectorTest.dispatchMouseEventTo3DView = function(eventType, button, layer)
63 { 63 {
64 // Caveat: this will blow if layers are transformed. We only take root layer scale into account. 64 // Caveat: this will blow if layers are transformed. We only take root layer scale into account.
65 var offsetX = 0; 65 var layer3DView = WebInspector.panel("layers")._layers3DView;
66 var offsetY = 0; 66 const borderWidth = 1;
67 for (var currentLayer = layer; currentLayer; currentLayer = currentLayer.par ent()) { 67 var offsetX = borderWidth;
68 offsetX += currentLayer.offsetX(); 68 var offsetY = borderWidth;
69 offsetY += currentLayer.offsetY(); 69 for (var currentLayer = layer; currentLayer && currentLayer.nodeId(); curren tLayer = currentLayer.parent()) {
70 offsetX += Math.round(layer3DView._scale * currentLayer.offsetX()) + bo rderWidth;
71 offsetY += Math.round(layer3DView._scale * currentLayer.offsetY()) + bo rderWidth;
70 } 72 }
71 var layer3DView = WebInspector.panel("layers")._layers3DView;
72 var rootElement = layer3DView._elementForLayer(InspectorTest._layerTreeModel .contentRoot()); 73 var rootElement = layer3DView._elementForLayer(InspectorTest._layerTreeModel .contentRoot());
73 var screenOffsetX = Math.round(layer3DView._scale * offsetX) + 2; 74 InspectorTest.dispatchMouseEvent(eventType, button, rootElement, offsetX, of fsetY);
74 var screenOffsetY = Math.round(layer3DView._scale * offsetY) + 2;
75 InspectorTest.dispatchMouseEvent(eventType, button, rootElement, screenOffse tX, screenOffsetY);
76 } 75 }
77 76
78 InspectorTest.dumpSelectedStyles = function(message, element) 77 InspectorTest.dumpSelectedStyles = function(message, element)
79 { 78 {
80 var classes = []; 79 var classes = [];
81 if (element.classList.contains("selected")) 80 if (element.classList.contains("selected"))
82 classes.push("selected"); 81 classes.push("selected");
83 if (element.classList.contains("hovered")) 82 if (element.classList.contains("hovered"))
84 classes.push("hovered"); 83 classes.push("hovered");
85 84
(...skipping 66 matching lines...) Expand 10 before | Expand all | Expand 10 after
152 WebInspector.showPanel("layers"); 151 WebInspector.showPanel("layers");
153 InspectorTest.requestLayers(step1); 152 InspectorTest.requestLayers(step1);
154 153
155 } 154 }
156 </script> 155 </script>
157 156
158 <body onload="runTest()"> 157 <body onload="runTest()">
159 <div id="a" style="width: 200px; height: 200px" class="layer"> 158 <div id="a" style="width: 200px; height: 200px" class="layer">
160 <div class="layer" id="b1" style="width: 150px; height: 100px"></div> 159 <div class="layer" id="b1" style="width: 150px; height: 100px"></div>
161 <div id="b2" class="layer" style="width: 140px; height: 110px"> 160 <div id="b2" class="layer" style="width: 140px; height: 110px">
161 <div id="b3" class="layer" style="width: 140px; height: 110px;"></div>
162 <div id="c" class="layer" style="width: 100px; height: 90px"></div> 162 <div id="c" class="layer" style="width: 100px; height: 90px"></div>
163 <div id="b3" class="layer" style="width: 140px; height: 110px;"></div>
164 </div> 163 </div>
165 </div> 164 </div>
166 </body> 165 </body>
OLDNEW
« no previous file with comments | « no previous file | Source/devtools/devtools.gypi » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698