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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: LayoutTests/inspector/tracing/timeline-layout-with-invalidations.html

Issue 671913005: Implement layout invalidation tracking in devtools (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 6 years, 2 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 side-by-side diff with in-line comments
Download patch
« no previous file with comments | « LayoutTests/http/tests/inspector/timeline-test.js ('k') | LayoutTests/inspector/tracing/timeline-layout-with-invalidations-expected.txt » ('j') | Source/devtools/front_end/timeline/TracingTimelineModel.js » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/inspector/tracing/timeline-layout-with-invalidations.html
diff --git a/LayoutTests/inspector/tracing/timeline-layout-with-invalidations.html b/LayoutTests/inspector/tracing/timeline-layout-with-invalidations.html
new file mode 100644
index 0000000000000000000000000000000000000000..6d91e36a2a2c1d024bd49402d14be7f1b9cb53be
--- /dev/null
+++ b/LayoutTests/inspector/tracing/timeline-layout-with-invalidations.html
@@ -0,0 +1,88 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<script src="../../http/tests/inspector/inspector-test.js"></script>
+<script src="../../http/tests/inspector/timeline-test.js"></script>
+<script>
+function display(callback)
+{
+ requestAnimationFrame(function() {
+ document.getElementById("testElement").style.width = "100px";
+ var forceLayout1 = document.body.offsetTop;
+ document.getElementById("testElement").style.width = "110px";
+ var forceLayout2 = document.body.offsetTop;
+ if (window.testRunner)
+ testRunner.displayAsyncThen(callback);
+ });
+}
+
+function updateSubframeAndDisplay(callback)
+{
+ requestAnimationFrame(function() {
+ frames[0].document.body.children[0].style.width = "10px";
+ var forceLayout1 = frames[0].document.body.offsetTop;
+ frames[0].document.body.children[0].style.width = "20px";
+ var forceLayout2 = frames[0].document.body.offsetTop;
+ if (window.testRunner)
+ testRunner.displayAsyncThen(callback);
+ });
+}
+
+function test()
+{
+ var currentPanel = WebInspector.inspectorView.currentPanel();
+ InspectorTest.assertEquals(currentPanel._panelName, "timeline", "Current panel should be the timeline.");
+ Runtime.experiments.enableForTest("timelineInvalidationTracking");
+
+ InspectorTest.runTestSuite([
+ function testLocalFrame(next)
+ {
+ InspectorTest.invokeAsyncWithTimeline("display", function() {
+ var firstLayoutRecord = InspectorTest.findFirstTimelineRecord(WebInspector.TimelineModel.RecordType.Layout);
+ var firstInvalidations = firstLayoutRecord._event.invalidationTrackingEvents;
+ InspectorTest.assertEquals(firstInvalidations.length, 1);
+ InspectorTest.assertEquals(firstInvalidations[0].type, WebInspector.TracingTimelineModel.RecordType.LayoutInvalidationTracking);
+ InspectorTest.assertEquals(firstInvalidations[0].nodeName, "DIV id='testElement'");
+ InspectorTest.assertGreaterOrEqual(firstInvalidations[0].stackTrace.length, 1);
+
+ var secondLayoutRecord = InspectorTest.findTimelineRecord(WebInspector.TimelineModel.RecordType.Layout, 1);
+ var secondInvalidations = secondLayoutRecord._event.invalidationTrackingEvents;
+ InspectorTest.assertEquals(secondInvalidations.length, 1);
+ InspectorTest.assertEquals(secondInvalidations[0].type, WebInspector.TracingTimelineModel.RecordType.LayoutInvalidationTracking);
+ InspectorTest.assertEquals(secondInvalidations[0].nodeName, "DIV id='testElement'");
+ InspectorTest.assertGreaterOrEqual(secondInvalidations[0].stackTrace.length, 1);
+
+ next();
+ });
+ },
+
+ function testSubframe(next)
+ {
+ InspectorTest.invokeAsyncWithTimeline("updateSubframeAndDisplay", function() {
+ var firstLayoutRecord = InspectorTest.findFirstTimelineRecord(WebInspector.TimelineModel.RecordType.Layout);
+ var firstInvalidations = firstLayoutRecord._event.invalidationTrackingEvents;
+ InspectorTest.assertEquals(firstInvalidations.length, 1);
+ InspectorTest.assertEquals(firstInvalidations[0].type, WebInspector.TracingTimelineModel.RecordType.LayoutInvalidationTracking);
+ InspectorTest.assertEquals(firstInvalidations[0].nodeName, "DIV");
+ InspectorTest.assertGreaterOrEqual(firstInvalidations[0].stackTrace.length, 1);
+
+ var secondLayoutRecord = InspectorTest.findTimelineRecord(WebInspector.TimelineModel.RecordType.Layout, 1);
+ var secondInvalidations = secondLayoutRecord._event.invalidationTrackingEvents;
+ InspectorTest.assertEquals(secondInvalidations.length, 1);
+ InspectorTest.assertEquals(secondInvalidations[0].type, WebInspector.TracingTimelineModel.RecordType.LayoutInvalidationTracking);
+ InspectorTest.assertEquals(secondInvalidations[0].nodeName, "DIV");
+ InspectorTest.assertGreaterOrEqual(secondInvalidations[0].stackTrace.length, 1);
+
+ next();
+ });
+ }
+ ]);
+}
+</script>
+</head>
+<body onload="runTest()">
+<p>Tests the Timeline API instrumentation of layout events with invalidations.</p>
+<div id="outerTestElement" style="display: inline-block;"><div id="testElement">PASS</div></div>
+<iframe src="resources/timeline-iframe-paint.html" style="position: absolute; left: 40px; top: 40px; width: 100px; height: 100px; border: none"></iframe>
+</body>
+</html>
« no previous file with comments | « LayoutTests/http/tests/inspector/timeline-test.js ('k') | LayoutTests/inspector/tracing/timeline-layout-with-invalidations-expected.txt » ('j') | Source/devtools/front_end/timeline/TracingTimelineModel.js » ('J')

Powered by Google App Engine
This is Rietveld 408576698