Commit 627b247f authored by Alexei Filippov's avatar Alexei Filippov Committed by Commit Bot

DevTools: Migrate remaining http/tests/devtools/tracing/ tests to the new framework.

Bug: 667560
Cq-Include-Trybots: master.tryserver.chromium.linux:linux_mojo
Change-Id: I6c1b582e0223dc15a1bc52e8b30adbf48619eea9
Reviewed-on: https://chromium-review.googlesource.com/804999
Commit-Queue: Alexei Filippov <alph@chromium.org>
Reviewed-by: default avatarAndrey Kosyakov <caseq@chromium.org>
Reviewed-by: default avatarWill Chen <chenwilliam@chromium.org>
Cr-Commit-Position: refs/heads/master@{#521536}
parent 409774e9
......@@ -92,7 +92,7 @@ Bug(none) http/tests/encoding/meta-switch-mid-parse.html [ Timeout ]
crbug.com/778542 http/tests/devtools/tracing/timeline-js/timeline-script-id.js [ Failure ]
crbug.com/778542 http/tests/devtools/tracing/timeline-network/timeline-network-resource-details.js [ Failure Pass ]
crbug.com/778542 virtual/threaded/http/tests/devtools/tracing/timeline-js/timeline-open-function-call.js [ Failure ]
crbug.com/778542 virtual/threaded/http/tests/devtools/tracing/timeline-misc/timeline-grouped-invalidations.html [ Failure ]
crbug.com/778542 virtual/threaded/http/tests/devtools/tracing/timeline-misc/timeline-grouped-invalidations.js [ Failure ]
crbug.com/721408 http/tests/devtools/extensions-ignore-cache.html [ Crash ]
crbug.com/721408 http/tests/devtools/extensions-useragent.html [ Crash ]
crbug.com/721408 http/tests/devtools/network/load-resource-for-frontend.js [ Failure Timeout ]
......
......@@ -26,7 +26,7 @@ crbug.com/417782 html/dialog/form-method-dialog.html [ Crash ]
crbug.com/417782 http/tests/devtools/device-mode/default-background-color.html [ Failure ]
crbug.com/417782 http/tests/devtools/layers/layer-compositing-reasons.js [ Failure ]
crbug.com/417782 http/tests/devtools/layers/layer-tree-model.js [ Failure ]
crbug.com/417782 http/tests/devtools/tracing/scroll-invalidations.html [ Failure ]
crbug.com/417782 http/tests/devtools/tracing/scroll-invalidations.js [ Failure ]
crbug.com/417782 http/tests/devtools/tracing/timeline-paint/layer-tree.js [ Failure ]
crbug.com/417782 http/tests/devtools/tracing/timeline-paint/timeline-paint-with-layout-invalidations-on-deleted-node.js [ Failure ]
crbug.com/417782 http/tests/devtools/tracing/timeline-paint/timeline-paint-with-layout-invalidations.js [ Failure ]
......@@ -53,7 +53,7 @@ crbug.com/417782 virtual/mouseevent_fractional/fast/events/scale-and-scroll-ifra
crbug.com/417782 virtual/scroll_customization/fast/events/touch/compositor-touch-hit-rects-iframes.html [ Failure ]
crbug.com/417782 virtual/threaded/compositing/visibility/visibility-image-layers-dynamic.html [ Failure ]
crbug.com/417782 [ Linux Win ] virtual/threaded/fast/scroll-behavior/smooth-scroll/main-thread-scrolling-reason-correctness.html [ Failure ]
crbug.com/417782 virtual/threaded/http/tests/devtools/tracing/scroll-invalidations.html [ Failure ]
crbug.com/417782 virtual/threaded/http/tests/devtools/tracing/scroll-invalidations.js [ Failure ]
crbug.com/417782 virtual/threaded/http/tests/devtools/tracing/timeline-paint/timeline-paint-with-layout-invalidations-on-deleted-node.js [ Failure ]
crbug.com/417782 virtual/threaded/http/tests/devtools/tracing/timeline-paint/timeline-paint-with-layout-invalidations.js [ Failure ]
crbug.com/417782 virtual/threaded/http/tests/devtools/tracing/timeline-paint/timeline-paint-with-style-recalc-invalidations.js [ Failure ]
......
......@@ -212,7 +212,7 @@ crbug.com/480769 virtual/pwa-full-code-cache/http/tests/devtools/service-workers
crbug.com/480769 http/tests/devtools/service-workers/service-worker-agents.js [ Slow ]
crbug.com/480769 virtual/pwa-full-code-cache/http/tests/devtools/service-workers/service-worker-agents.js [ Slow ]
crbug.com/504703 inspector-protocol/debugger/debugger-step-into-dedicated-worker.js [ Slow ]
crbug.com/535478 [ Win ] virtual/threaded/http/tests/devtools/tracing/decode-resize.html [ Slow ]
crbug.com/535478 [ Win ] virtual/threaded/http/tests/devtools/tracing/decode-resize.js [ Slow ]
crbug.com/548765 http/tests/devtools/console-fetch-logging.js [ Slow ]
crbug.com/419993 [ Debug ] fast/css/giant-stylesheet-crash.html [ Slow ]
......
......@@ -982,11 +982,11 @@ crbug.com/569139 fast/js/string-replace-2.html [ Failure ]
crbug.com/569139 fast/js/regexp-caching.html [ Failure ]
crbug.com/597221 fast/dom/Window/window-postmessage-clone-deep-array.html [ Failure ]
# crbug.com/778784 Is tracking recent flakiness in decode-resize.html. Once that is fixed, the following
# crbug.com/778784 Is tracking recent flakiness in decode-resize.js. Once that is fixed, the following
# failures should be uncommented:
# crbug.com/498539 [ Win ] http/tests/devtools/tracing/decode-resize.html [ Failure Timeout ]
crbug.com/778784 http/tests/devtools/tracing/decode-resize.html [ Failure Timeout Pass ]
crbug.com/778784 virtual/threaded/http/tests/devtools/tracing/decode-resize.html [ Failure Timeout Pass ]
# crbug.com/498539 [ Win ] http/tests/devtools/tracing/decode-resize.js [ Failure Timeout ]
crbug.com/778784 http/tests/devtools/tracing/decode-resize.js [ Failure Timeout Pass ]
crbug.com/778784 virtual/threaded/http/tests/devtools/tracing/decode-resize.js [ Failure Timeout Pass ]
crbug.com/498539 http/tests/devtools/tracing/timeline-misc/timeline-bound-function.js [ Pass Failure ]
crbug.com/498539 virtual/threaded/http/tests/devtools/tracing/timeline-misc/timeline-bound-function.js [ Pass Failure ]
......
<html>
<head>
<style>
div {
display: inline-block;
border-style: solid;
}
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
div.img-container {
position: relative;
width: 99px;
height: 99px;
overflow: clip;
}
(async function() {
TestRunner.addResult(`Tests the instrumentation of a DecodeImage and ResizeImage events\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.loadHTML(`
<style>
div {
display: inline-block;
border-style: solid;
}
.background, .border {
width: 25px;
height: 25px;
};
div.img-container {
position: relative;
width: 99px;
height: 99px;
overflow: clip;
}
.border {
border-width: 12px;
}
.background, .border {
width: 25px;
height: 25px;
};
</style>
<script src="../../inspector/inspector-test.js"></script>
<script src="../../inspector/timeline-test.js"></script>
<script>
.border {
border-width: 12px;
}
var images = [
["./resources/test.webp", "25", "25"],
["./resources/test.bmp", "25", "25"],
["./resources/test.gif", "25", "25"],
["./resources/test.ico", "25", "25"],
["./resources/test.jpg", "25", "25"],
["./resources/test.png", "25", "25"],
["./resources/big.png", "150", "150"]
];
</style>
`);
function showImages()
{
var promise = Promise.resolve();
for (let image of images) {
promise = promise
.then(() => addImage(image))
.then(() => new Promise((fulfill) => testRunner.layoutAndPaintAsyncThen(fulfill)));
}
return promise.then(() => generateFrames(3));
await TestRunner.evaluateInPagePromise(`
var images = [
["./resources/test.webp", "25", "25"],
["./resources/test.bmp", "25", "25"],
["./resources/test.gif", "25", "25"],
["./resources/test.ico", "25", "25"],
["./resources/test.jpg", "25", "25"],
["./resources/test.png", "25", "25"],
["./resources/big.png", "150", "150"]
];
function addImage(image)
async function showImages()
{
var imgContainer = document.createElement("div");
imgContainer.className = "img-container";
document.body.appendChild(imgContainer);
for (let image of images) {
await addImage(image);
await new Promise(fulfill => testRunner.layoutAndPaintAsyncThen(fulfill));
}
return generateFrames(3);
var imgElement = document.createElement("img");
var promise = new Promise((fulfill) => imgElement.onload = fulfill);
imgContainer.appendChild(imgElement);
function addImage(image)
{
var imgContainer = document.createElement("div");
imgContainer.className = "img-container";
document.body.appendChild(imgContainer);
var backgroundElement = document.createElement("div");
backgroundElement.className = "background";
document.body.appendChild(backgroundElement);
var imgElement = document.createElement("img");
var promise = new Promise((fulfill) => imgElement.onload = fulfill);
imgContainer.appendChild(imgElement);
var borderElement = document.createElement("div");
borderElement.className = "border";
document.body.appendChild(borderElement);
var backgroundElement = document.createElement("div");
backgroundElement.className = "background";
document.body.appendChild(backgroundElement);
imgElement.width = image[1];
imgElement.height = image[2];
imgElement.src = image[0];
backgroundElement.style.backgroundImage = "url(" + image[0] + "?background)";
borderElement.style.borderImage = "url(" + image[0] + "?border)";
var borderElement = document.createElement("div");
borderElement.className = "border";
document.body.appendChild(borderElement);
return promise;
imgElement.width = image[1];
imgElement.height = image[2];
imgElement.src = image[0];
backgroundElement.style.backgroundImage = "url(" + image[0] + "?background)";
borderElement.style.borderImage = "url(" + image[0] + "?border)";
return promise;
}
}
}
`);
function test() {
PerformanceTestRunner.invokeWithTracing('showImages', TestRunner.safeWrap(onTracingComplete));
function onTracingComplete() {
function isDecodeImageEvent(event) {
......@@ -103,14 +107,4 @@ function test() {
}
TestRunner.completeTest();
}
}
</script>
</head>
<body onload="runTest()">
<p>
Tests the instrumentation of a DecodeImage and ResizeImage events
</p>
</body>
</html>
})();
<html>
<head>
<script src="../../inspector/inspector-test.js"></script>
<script src="../../inspector/timeline-test.js"></script>
<script src="../tracing-test.js"></script>
<script>
function doActions()
{
return generateFrames(3);
}
function test() {
UI.panels.timeline._captureLayersAndPicturesSetting.set(true);
PerformanceTestRunner.invokeAsyncWithTimeline('doActions', TestRunner.safeWrap(dumpLastFrame));
function dumpLastFrame() {
var frames = PerformanceTestRunner.timelineFrameModel().frames();
var lastFrame = PerformanceTestRunner.timelineFrameModel().frames().peekLast();
if (lastFrame) {
TestRunner.addResult('layerTree: ' + typeof lastFrame.layerTree);
TestRunner.addResult('mainFrameId: ' + typeof lastFrame._mainFrameId);
var paints = lastFrame.layerTree.paints();
TestRunner.addResult('paints: ' + (paints && paints.length ? 'present' : 'absent'));
} else {
TestRunner.addResult('FAIL: there was no frame');
}
TestRunner.completeTest();
}
}
</script>
<body onload="runTestAfterDisplay()">
</body>
</html>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.evaluateInPagePromise(`
function doActions() {
return generateFrames(3);
}`);
UI.panels.timeline._captureLayersAndPicturesSetting.set(true);
await PerformanceTestRunner.invokeAsyncWithTimeline('doActions');
const frames = PerformanceTestRunner.timelineFrameModel().frames();
const lastFrame = PerformanceTestRunner.timelineFrameModel().frames().peekLast();
if (lastFrame) {
TestRunner.addResult('layerTree: ' + typeof lastFrame.layerTree);
TestRunner.addResult('mainFrameId: ' + typeof lastFrame._mainFrameId);
const paints = lastFrame.layerTree.paints();
TestRunner.addResult('paints: ' + (paints && paints.length ? 'present' : 'absent'));
} else {
TestRunner.addResult('FAIL: there was no frame');
}
TestRunner.completeTest();
})();
<html>
<head>
<script src="../../inspector/inspector-test.js"></script>
<script src="../../inspector/timeline-test.js"></script>
<script>
function performActions()
{
var e = document.elementFromPoint(10, 10);
}
function test() {
PerformanceTestRunner.performActionsAndPrint('performActions()', 'HitTest');
}
</script>
</head>
<body onload="runTest()">
<p>
Tests instrumentation for Timeline HitTest event.
</p>
</body>
</html>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Tests instrumentation for Timeline HitTest event.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.loadHTML(`<p>A text</p>`);
await TestRunner.evaluateInPagePromise(`
function performActions() {
var e = document.elementFromPoint(10, 10);
}`);
PerformanceTestRunner.performActionsAndPrint('performActions()', 'HitTest');
})();
<!DOCTYPE HTML>
<html>
<head>
<script src="../../inspector/inspector-test.js"></script>
<script src="../../inspector/timeline-test.js"></script>
<script>
function scrollAndDisplay()
{
scrollTo(0, 200);
if (window.testRunner)
return new Promise((fulfill) => testRunner.layoutAndPaintAsyncThen(fulfill));
return Promise.reject();
}
function test() {
Runtime.experiments.enableForTest('timelineInvalidationTracking');
PerformanceTestRunner.invokeAsyncWithTimeline('scrollAndDisplay', onRecordingDone);
function onRecordingDone() {
var event = PerformanceTestRunner.findTimelineEvent(TimelineModel.TimelineModel.RecordType.Paint);
TestRunner.addArray(
TimelineModel.InvalidationTracker.invalidationEventsFor(event), PerformanceTestRunner.InvalidationFormatters,
'', 'Scroll invalidations');
TestRunner.completeTest();
};
}
</script>
</head>
<body onload="runTest()">
<p>Tests invalidations produced by scrolling a page with position: fixed elements.</p>
<div style="width: 400px; height: 2000px; background-color: grey"></div>
<div style="position: fixed; left: 50px; top: 100px; width: 50px; height: 50px; background-color: rgba(255, 100, 100, 0.6)"></div>
</body>
</html>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Tests invalidations produced by scrolling a page with position: fixed elements.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.loadHTML(`
<div style="width: 400px; height: 2000px; background-color: grey"></div>
<div style="position: fixed; left: 50px; top: 100px; width: 50px; height: 50px; background-color: rgba(255, 100, 100, 0.6)"></div>
`);
await TestRunner.evaluateInPagePromise(`
function scrollAndDisplay() {
scrollTo(0, 200);
return new Promise(fulfill => testRunner.layoutAndPaintAsyncThen(fulfill));
}
`);
Runtime.experiments.enableForTest('timelineInvalidationTracking');
await PerformanceTestRunner.invokeAsyncWithTimeline('scrollAndDisplay');
const event = PerformanceTestRunner.findTimelineEvent(TimelineModel.TimelineModel.RecordType.Paint);
TestRunner.addArray(
TimelineModel.InvalidationTracker.invalidationEventsFor(event), PerformanceTestRunner.InvalidationFormatters,
'', 'Scroll invalidations');
TestRunner.completeTest();
})();
......@@ -9,11 +9,8 @@
await TestRunner.evaluateInPagePromise(`
function produceGarbageForGCEvents()
{
if (window.testRunner) {
window.gc();
return new Promise((fulfill) => testRunner.layoutAndPaintAsyncThen(fulfill));
}
return Promise.reject();
window.gc();
return new Promise(fulfill => testRunner.layoutAndPaintAsyncThen(fulfill));
}
`);
......
Test that checks location resolving mechanics for TimerInstall TimerRemove and FunctionCall events with scriptId.
It expects two FunctionCall for InjectedScript, two TimerInstall events, two FunctionCall events and one TimerRemove event to be logged with performActions.js script name and some line number.
detailsTextContent for TimerInstall event: 'performActions.js:37'
details.textContent for TimerInstall event: 'performActions.js:37'
detailsTextContent for TimerInstall event: 'performActions.js:38'
details.textContent for TimerInstall event: 'performActions.js:38'
detailsTextContent for FunctionCall event: 'performActions.js:42'
details.textContent for FunctionCall event: 'intervalTimerWork @ performActions.js:42'
detailsTextContent for FunctionCall event: 'performActions.js:42'
details.textContent for FunctionCall event: 'intervalTimerWork @ performActions.js:42'
detailsTextContent for TimerRemove event: 'performActions.js:45'
details.textContent for TimerRemove event: 'performActions.js:45'
detailsTextContent for TimerInstall event: 'performActions.js:33'
details.textContent for TimerInstall event: 'performActions.js:33'
detailsTextContent for TimerInstall event: 'performActions.js:34'
details.textContent for TimerInstall event: 'performActions.js:34'
detailsTextContent for FunctionCall event: 'performActions.js:38'
details.textContent for FunctionCall event: 'intervalTimerWork @ performActions.js:38'
detailsTextContent for FunctionCall event: 'performActions.js:38'
details.textContent for FunctionCall event: 'intervalTimerWork @ performActions.js:38'
detailsTextContent for TimerRemove event: 'performActions.js:41'
details.textContent for TimerRemove event: 'performActions.js:41'
......@@ -8,10 +8,6 @@
It expects two FunctionCall for InjectedScript, two TimerInstall events, two FunctionCall events and one TimerRemove event to be logged with performActions.js script name and some line number.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.evaluateInPagePromise(`
if (!window.testRunner)
setTimeout(performActions, 2000);
`);
function performActions() {
var callback;
......
......@@ -20,9 +20,6 @@
}
return promise;
}
if (!window.testRunner)
setTimeout(performActions, 2000);
`);
PerformanceTestRunner.invokeAsyncWithTimeline('performActions', finish);
......
......@@ -16,7 +16,7 @@
}
`);
await new Promise(resolve => PerformanceTestRunner.invokeAsyncWithTimeline('performActions', resolve));
await PerformanceTestRunner.invokeAsyncWithTimeline('performActions');
const events = new Set([
TimelineModel.TimelineModel.RecordType.CryptoDoEncrypt,
......
<html>
<head>
<script src="../../../inspector/inspector-test.js"></script>
<script src="../../../inspector/timeline-test.js"></script>
<script>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Test filtering in Timeline Tree View panel.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
function test() {
var sessionId = '4.20';
var mainThread = 1;
var pid = 100;
......@@ -274,7 +276,10 @@ function test() {
];
var model = PerformanceTestRunner.createPerformanceModelWithEvents(testData);
var view = new Timeline.EventsTimelineTreeView(UI.panels.timeline._filters, null);
const tabbedPane = UI.panels.timeline._flameChart._detailsView._tabbedPane;
tabbedPane.selectTab(Timeline.TimelineDetailsView.Tab.EventLog);
const view = tabbedPane.visibleView;
view.setModel(model);
view.updateContents(Timeline.TimelineSelection.fromRange(
model.timelineModel().minimumRecordTime(), model.timelineModel().maximumRecordTime()));
......@@ -290,24 +295,13 @@ function test() {
TestRunner.addResult('Initial:');
dumpRecords();
TestRunner.addResult('Filtered by \'bar\':');
TestRunner.addResult(`Filtered by 'bar':`);
view._textFilterUI._internalSetValue('bar', true);
dumpRecords();
TestRunner.addResult('Filtered by \'foo\':');
TestRunner.addResult(`Filtered by 'foo':`);
view._textFilterUI._internalSetValue('foo', true);
dumpRecords();
TestRunner.completeTest();
}
</script>
</head>
<body onload="runTest()">
<p>
Test filtering in Timeline Tree View panel.</a>
</p>
</body>
</html>
})();
Tests grouped invalidations on the timeline.
P
A
S
S
paint invalidations[
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:14}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:21}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -17,7 +13,7 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:15}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:22}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -28,7 +24,7 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:14}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:21}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -39,7 +35,7 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:15}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:22}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -50,7 +46,7 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:14}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:21}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -61,7 +57,7 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:15}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:22}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -72,7 +68,7 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:14}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:21}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -83,7 +79,7 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
{
cause : {reason: Inline CSS style declaration was mutated, stackTrace: .../devtools/tracing/timeline-misc/timeline-grouped-invalidations.html:15}
cause : {reason: Inline CSS style declaration was mutated, stackTrace: test://evaluations/0/timeline-grouped-invalidations.js:22}
changedAttribute : undefined
changedClass : undefined
changedId : undefined
......@@ -94,6 +90,6 @@ paint invalidations[
type : "StyleRecalcInvalidationTracking"
}
]
PASS - record contained Inline CSS style declaration was mutated for [ DIV class='testElement' ], [ DIV class='testElement' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.html:14
PASS - record contained Inline CSS style declaration was mutated for [ DIV class='testElement' ], [ DIV class='testElement' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.html:15
PASS - record contained Inline CSS style declaration was mutated for [ DIV class='testElement' ], [ DIV class='testElement' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.js:21
PASS - record contained Inline CSS style declaration was mutated for [ DIV class='testElement' ], [ DIV class='testElement' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.js:22
<!DOCTYPE HTML>
<html>
<head>
<script src="../../../inspector/inspector-test.js"></script>
<script src="../../../inspector/timeline-test.js"></script>
<script>
function display()
{
var callback;
var promise = new Promise((fulfill) => callback = fulfill);
requestAnimationFrame(function() {
var testElements = document.body.getElementsByClassName("testElement");
for (var i = 0; i < testElements.length; i++) {
testElements[i].style.color = "red";
testElements[i].style.backgroundColor = "blue";
}
if (window.testRunner)
testRunner.layoutAndPaintAsyncThen(callback);
});
return promise;
}
function test() {
Runtime.experiments.enableForTest('timelineInvalidationTracking');
PerformanceTestRunner.invokeAsyncWithTimeline('display', function() {
var event = PerformanceTestRunner.findTimelineEvent(TimelineModel.TimelineModel.RecordType.Paint);
TestRunner.addArray(
TimelineModel.InvalidationTracker.invalidationEventsFor(event), PerformanceTestRunner.InvalidationFormatters,
'', 'paint invalidations');
var linkifier = new Components.Linkifier();
var target = PerformanceTestRunner.timelineModel().targetByEvent(event);
var contentHelper = new Timeline.TimelineDetailsContentHelper(target, linkifier, true);
Timeline.TimelineUIUtils._generateCauses(event, target, null, contentHelper);
var invalidationsTree = contentHelper.element.getElementsByClassName('invalidations-tree')[0];
var invalidations = invalidationsTree.shadowRoot.textContent;
checkStringContains(
invalidations,
'Inline CSS style declaration was mutated for [ DIV class=\'testElement\' ], [ DIV class=\'testElement\' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.html:14');
checkStringContains(
invalidations,
'Inline CSS style declaration was mutated for [ DIV class=\'testElement\' ], [ DIV class=\'testElement\' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.html:15');
TestRunner.completeTest();
});
function checkStringContains(string, contains) {
var doesContain = string.indexOf(contains) >= 0;
TestRunner.check(doesContain, contains + ' should be present in ' + string);
TestRunner.addResult('PASS - record contained ' + contains);
}
}
</script>
</head>
<body onload="runTest()">
<p>Tests grouped invalidations on the timeline.</p>
<div class="testElement">P</div><div class="testElement">A</div>
<div class="testElement">S</div><div class="testElement">S</div>
</body>
</html>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Tests grouped invalidations on the timeline.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.loadHTML(`
<!DOCTYPE HTML>
<div class="testElement">P</div><div class="testElement">A</div>
<div class="testElement">S</div><div class="testElement">S</div>
`);
await TestRunner.evaluateInPagePromise(`
function display()
{
return new Promise(resolve => {
requestAnimationFrame(function() {
var testElements = document.body.getElementsByClassName("testElement");
for (var i = 0; i < testElements.length; i++) {
testElements[i].style.color = "red";
testElements[i].style.backgroundColor = "blue";
}
testRunner.layoutAndPaintAsyncThen(resolve);
});
});
}
`);
Runtime.experiments.enableForTest('timelineInvalidationTracking');
await PerformanceTestRunner.invokeAsyncWithTimeline('display');
var event = PerformanceTestRunner.findTimelineEvent(TimelineModel.TimelineModel.RecordType.Paint);
TestRunner.addArray(
TimelineModel.InvalidationTracker.invalidationEventsFor(event), PerformanceTestRunner.InvalidationFormatters,
'', 'paint invalidations');
var linkifier = new Components.Linkifier();
var target = PerformanceTestRunner.timelineModel().targetByEvent(event);
var contentHelper = new Timeline.TimelineDetailsContentHelper(target, linkifier, true);
Timeline.TimelineUIUtils._generateCauses(event, target, null, contentHelper);
var invalidationsTree = contentHelper.element.getElementsByClassName('invalidations-tree')[0];
var invalidations = invalidationsTree.shadowRoot.textContent;
checkStringContains(
invalidations,
`Inline CSS style declaration was mutated for [ DIV class='testElement' ], [ DIV class='testElement' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.js:21`);
checkStringContains(
invalidations,
`Inline CSS style declaration was mutated for [ DIV class='testElement' ], [ DIV class='testElement' ], and 2 others. (anonymous) @ timeline-grouped-invalidations.js:22`);
TestRunner.completeTest();
function checkStringContains(string, contains) {
var doesContain = string.indexOf(contains) >= 0;
TestRunner.check(doesContain, contains + ' should be present in ' + string);
TestRunner.addResult('PASS - record contained ' + contains);
}
})();
<html>
<head>
<script src="../../../inspector/inspector-test.js"></script>
<script src="../../../inspector/timeline-test.js"></script>
<script>
function display()
{
var callback;
var promise = new Promise((fulfill) => callback = fulfill);
if (window.testRunner)
testRunner.setCanOpenWindows(true);
var popup = window.open("resources/hello.html");
popup.onload = function()
{
requestAnimationFrame(testRunner.capturePixelsAsyncThen.bind(testRunner, callback));
}
return promise;
}
function test() {
UI.panels.timeline._disableCaptureJSProfileSetting.set(true);
PerformanceTestRunner.startTimeline(function() {
TestRunner.reloadPage(pageReloaded);
});
function pageReloaded() {
TestRunner.callFunctionInPageAsync('display').then(displayDone);
}
function displayDone() {
PerformanceTestRunner.stopTimeline(TestRunner.safeWrap(finish));
}
function finish() {
TestRunner.addResult('Model records:');
PerformanceTestRunner.printTimelineRecords('MarkDOMContent');
PerformanceTestRunner.printTimelineRecords('MarkLoad');
TestRunner.addResult('Timestamp records:');
PerformanceTestRunner.printTimestampRecords('MarkDOMContent');
PerformanceTestRunner.printTimestampRecords('MarkLoad');
PerformanceTestRunner.printTimestampRecords('MarkFirstPaint');
var eventDividers = PerformanceTestRunner.timelineModel().eventDividers();
for (var i = 1; i < eventDividers.length; ++i)
TestRunner.assertGreaterOrEqual(
eventDividers[i].startTime, eventDividers[i - 1].startTime,
'Event divider timestamps should be monotonically non-decreasing');
TestRunner.completeTest();
}
}
</script>
</head>
<body onload="runTest()">
<p>
Tests the load event.
</p>
</body>
</html>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Tests the load event.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
UI.panels.timeline._disableCaptureJSProfileSetting.set(true);
await PerformanceTestRunner.startTimeline();
await TestRunner.reloadPagePromise();
await TestRunner.evaluateInPagePromise(`
function display() {
return new Promise(resolve => {
testRunner.setCanOpenWindows(true);
var popup = window.open("resources/hello.html");
popup.onload = () => requestAnimationFrame(() => testRunner.capturePixelsAsyncThen(resolve));
});
}
`);
await TestRunner.callFunctionInPageAsync('display');
await PerformanceTestRunner.stopTimeline();
TestRunner.addResult('Model records:');
PerformanceTestRunner.printTimelineRecords('MarkDOMContent');
PerformanceTestRunner.printTimelineRecords('MarkLoad');
TestRunner.addResult('Timestamp records:');
PerformanceTestRunner.printTimestampRecords('MarkDOMContent');
PerformanceTestRunner.printTimestampRecords('MarkLoad');
PerformanceTestRunner.printTimestampRecords('MarkFirstPaint');
const eventDividers = PerformanceTestRunner.timelineModel().eventDividers();
eventDividers.reduce((prev, current) => {
TestRunner.assertGreaterOrEqual(current.startTime, prev.startTime,
'Event divider timestamps should be monotonically non-decreasing');
return current;
});
TestRunner.completeTest();
})();
......@@ -13,9 +13,6 @@
element.innerHTML = "Test data";
document.body.appendChild(element);
}
if (!window.testRunner)
setTimeout(performActions, 2000);
`);
PerformanceTestRunner.performActionsAndPrint('performActions()', 'ParseHTML');
......
<html>
<head>
<script src="../../../inspector/inspector-test.js"></script>
<script src="../../../inspector/console-test.js"></script>
<script src="../../../inspector/timeline-test.js"></script>
<script>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
function test() {
var panel = UI.panels.timeline;
(async function() {
TestRunner.addResult(`Test recording page reload works in Timeline.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
TestRunner.resourceTreeModel.addEventListener(SDK.ResourceTreeModel.Events.Load, TestRunner.pageLoaded);
var panel = UI.panels.timeline;
PerformanceTestRunner.runWhenTimelineIsReady(recordingStopped);
panel._millisecondsToRecordAfterLoadEvent = 1;
......@@ -17,13 +18,4 @@ function test() {
TestRunner.addResult('Recording stopped');
TestRunner.completeTest();
}
}
</script>
</head>
<body onload="runTest()">
<p>Test recording page reload works in Timeline.</p>
</body>
</html>
})();
......@@ -23,7 +23,7 @@
`);
await TestRunner.NetworkAgent.setCacheDisabled(true);
await new Promise(fulfill => PerformanceTestRunner.invokeAsyncWithTimeline('performActions', fulfill));
await PerformanceTestRunner.invokeAsyncWithTimeline('performActions');
var model = PerformanceTestRunner.timelineModel();
var linkifier = new Components.Linkifier();
......
<html>
<head>
<script src="../../../inspector/inspector-test.js"></script>
<script src="../../../inspector/timeline-test.js"></script>
<script>
function addImage(url, width, height)
{
var img = document.createElement('img');
img.style.position = "absolute";
img.style.top = "100px";
img.style.left = "0px";
img.style.width = width;
img.style.height = height;
img.src = url;
document.body.appendChild(img);
}
function addCSSImage(url, width, height)
{
var img = document.createElement('div');
img.style.position = "absolute";
img.style.top = "100px";
img.style.left = "100px";
img.style.width = width;
img.style.height = height;
img.style.background = `url(${JSON.stringify(url)})`;
document.body.appendChild(img);
}
function display()
{
addImage("../resources/test.png", "40px", "30px");
addCSSImage("//:0", "30px", "20px"); // should be ignored, see https://crbug.com/776940
addCSSImage("../resources/test.png", "30px", "20px");
return waitForFrame();
}
function test()
{
InspectorTest.invokeAsyncWithTimeline("display", step1);
function step1()
{
var events = InspectorTest.timelineModel().mainThreadEvents()
.filter(e => e.name === TimelineModel.TimelineModel.RecordType.PaintImage);
InspectorTest.assertEquals(events.length, 2, "PaintImage records not found");
events.forEach(e => InspectorTest.printTraceEventProperties(e));
InspectorTest.completeTest();
}
}
</script>
</head>
<body onload="runTest()">
<p>
Tests the Timeline API instrumentation of a paint image event
</p>
</body>
</html>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Tests the Timeline API instrumentation of a paint image event\n\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.evaluateInPagePromise(`
function addImage(url, width, height)
{
var img = document.createElement('img');
img.style.position = "absolute";
img.style.top = "100px";
img.style.left = "0px";
img.style.width = width;
img.style.height = height;
img.src = url;
document.body.appendChild(img);
}
function addCSSImage(url, width, height)
{
var img = document.createElement('div');
img.style.position = "absolute";
img.style.top = "100px";
img.style.left = "100px";
img.style.width = width;
img.style.height = height;
img.style.background = \`url(\${JSON.stringify(url)})\`;
document.body.appendChild(img);
}
function display()
{
addImage("../resources/test.png", "40px", "30px");
addCSSImage("//:0", "30px", "20px"); // should be ignored, see https://crbug.com/776940
addCSSImage("../resources/test.png", "30px", "20px");
return waitForFrame();
}
`);
await PerformanceTestRunner.invokeAsyncWithTimeline('display');
const events = PerformanceTestRunner.timelineModel().mainThreadEvents()
.filter(e => e.name === TimelineModel.TimelineModel.RecordType.PaintImage);
TestRunner.assertEquals(events.length, 2, 'PaintImage records not found');
events.forEach(e => PerformanceTestRunner.printTraceEventProperties(e));
TestRunner.completeTest();
})();
......@@ -25,9 +25,6 @@
}
return promise;
}
if (!window.testRunner)
setTimeout(performActions, 3000);
`);
UI.viewManager.showView('timeline');
......
......@@ -17,7 +17,7 @@
}
`);
await new Promise(resolve => PerformanceTestRunner.invokeAsyncWithTimeline('performActions', resolve));
await PerformanceTestRunner.invokeAsyncWithTimeline('performActions');
const events = new Set([TimelineModel.TimelineModel.RecordType.CompileModule, TimelineModel.TimelineModel.RecordType.EvaluateModule]);
const tracingModel = PerformanceTestRunner.tracingModel();
......
<html>
<head>
<script src="../../../inspector/inspector-test.js"></script>
<script src="../../../inspector/timeline-test.js"></script>
<style>
.test-style {
color: red;
}
</style>
<script>
function forceStyle()
{
var element = document.createElement("div");
element.className = "test-style";
element.innerHTML = "<span>Test data</span>";
document.querySelector('section > div').appendChild(element);
var unused = element.offsetWidth;
}
function performActions()
{
wrapCallFunctionForTimeline(forceStyle);
}
function test() {
PerformanceTestRunner.performActionsAndPrint('performActions()', 'UpdateLayoutTree');
}
</script>
</head>
<body onload="runTest()">
<p>
Tests the Timeline API instrumentation of a style recalculation event
</p>
<section>
<div></div>
</section>
</body>
</html>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Tests the Timeline API instrumentation of a style recalculation event\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.loadHTML(`
<style>
.test-style {
color: red;
}
</style>
<section>
<div></div>
</section>
`);
await TestRunner.evaluateInPagePromise(`
function forceStyle()
{
const element = document.createElement("div");
element.className = "test-style";
element.innerHTML = "<span>Test data</span>";
document.querySelector('section > div').appendChild(element);
var unused = element.offsetWidth;
}
function performActions()
{
wrapCallFunctionForTimeline(forceStyle);
}
`);
TestRunner.addResult(`Test data`);
PerformanceTestRunner.performActionsAndPrint('performActions()', 'UpdateLayoutTree');
})();
......@@ -11,9 +11,6 @@
{
console.timeStamp("TIME STAMP");
}
if (!window.testRunner)
setTimeout(performActions, 2000);
`);
PerformanceTestRunner.performActionsAndPrint('performActions()', 'TimeStamp', true);
......
CONSOLE WARNING: line 1: 'console.markTimeline' is deprecated. Please use 'console.timeStamp' instead.
Tests the Timeline API instrumentation of a TimerFired events inside evaluated scripts.
TimerFire fromEval.js:2
......
<html>
<head>
<script src="../../../inspector/inspector-test.js"></script>
<script src="../../../inspector/timeline-test.js"></script>
<script>
// Copyright 2017 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
(async function() {
TestRunner.addResult(`Tests the Timeline API instrumentation of a TimerFired events inside evaluated scripts.\n`);
await TestRunner.loadModule('performance_test_runner');
await TestRunner.showPanel('timeline');
await TestRunner.evaluateInPagePromise(`
function performActions()
{
var promise = new Promise((fulfill) => window.callWhenDone = fulfill);
var content = "" +
"var fn2 = function() {" +
" console.markTimeline(\"Script evaluated\");" +
" console.markTimeline(\\"Script evaluated\\");" +
" window.callWhenDone();" +
"};\\n" +
"};\\\\n" +
"var fn1 = function() {" +
" window.setTimeout(fn2, 1);" +
"};\\n" +
"window.setTimeout(fn1, 1);\\n" +
"};\\\\n" +
"window.setTimeout(fn1, 1);\\\\n" +
"//# sourceURL=fromEval.js";
content = "eval('" + content + "');";
var scriptElement = document.createElement('script');
......@@ -25,34 +28,18 @@ function performActions()
document.body.removeChild(scriptElement);
return promise;
}
`);
function test() {
PerformanceTestRunner.invokeAsyncWithTimeline('performActions', finish);
await PerformanceTestRunner.invokeAsyncWithTimeline('performActions');
function finish() {
var events = PerformanceTestRunner.timelineModel().mainThreadEvents();
for (var i = 0; i < events.length; ++i) {
if (events[i].name !== TimelineModel.TimelineModel.RecordType.TimerFire)
continue;
var functionCallChild =
PerformanceTestRunner.findChildEvent(events, i, TimelineModel.TimelineModel.RecordType.FunctionCall);
var fnCallSite = functionCallChild.args['data'];
TestRunner.addResult(`${events[i].name} ${fnCallSite.url}:${fnCallSite.lineNumber + 1}`);
}
TestRunner.completeTest();
var events = PerformanceTestRunner.timelineModel().mainThreadEvents();
for (var i = 0; i < events.length; ++i) {
if (events[i].name !== TimelineModel.TimelineModel.RecordType.TimerFire)
continue;
var functionCallChild =
PerformanceTestRunner.findChildEvent(events, i, TimelineModel.TimelineModel.RecordType.FunctionCall);
var fnCallSite = functionCallChild.args['data'];
TestRunner.addResult(`${events[i].name} ${fnCallSite.url}:${fnCallSite.lineNumber + 1}`);
}
}
if (!window.testRunner)
setTimeout(performActions, 3000);
</script>
</head>
<body onload="runTest()">
<p>
Tests the Timeline API instrumentation of a TimerFired events inside evaluated scripts.
</p>
</body>
</html>
TestRunner.completeTest();
})();
......@@ -24,9 +24,6 @@
}
return promise;
}
if (!window.testRunner)
setTimeout(performActions, 2000);
`);
UI.panels.timeline._disableCaptureJSProfileSetting.set(true);
......
......@@ -12,9 +12,6 @@
var ws = new WebSocket("ws://127.0.0.1:8880/simple");
return new Promise((fulfill) => ws.onclose = fulfill);
}
if (!window.testRunner)
setTimeout(performActions, 2000);
`);
PerformanceTestRunner.invokeAsyncWithTimeline('performActions', finish);
......
......@@ -136,35 +136,39 @@ PerformanceTestRunner.runWhenTimelineIsReady = function(callback) {
};
PerformanceTestRunner.startTimeline = function(callback) {
var panel = UI.panels.timeline;
TestRunner.addSniffer(panel, '_recordingStarted', callback);
panel._toggleRecording();
return new Promise(resolve => {
var panel = UI.panels.timeline;
TestRunner.addSniffer(panel, '_recordingStarted', () => {
resolve();
if (callback)
callback();
});
panel._toggleRecording();
});
};
PerformanceTestRunner.stopTimeline = function(callback) {
PerformanceTestRunner.runWhenTimelineIsReady(callback);
UI.panels.timeline._toggleRecording();
};
PerformanceTestRunner.evaluateWithTimeline = function(actions, doneCallback) {
PerformanceTestRunner.startTimeline(step1);
async function step1() {
await TestRunner.evaluateInPageAnonymously(actions);
PerformanceTestRunner.stopTimeline(doneCallback);
}
};
PerformanceTestRunner.invokeAsyncWithTimeline = function(functionName, doneCallback) {
PerformanceTestRunner.startTimeline(step1);
function step1() {
TestRunner.callFunctionInPageAsync(functionName).then(step2);
}
function step2() {
PerformanceTestRunner.stopTimeline(TestRunner.safeWrap(doneCallback));
}
return new Promise(resolve => {
PerformanceTestRunner.runWhenTimelineIsReady(() => {
resolve();
if (callback)
callback();
});
UI.panels.timeline._toggleRecording();
});
};
// TODO(alph): Replace callback with promise in all the tests.
PerformanceTestRunner.evaluateWithTimeline = async function(actions, doneCallback) {
await PerformanceTestRunner.startTimeline();
await TestRunner.evaluateInPageAnonymously(actions);
await PerformanceTestRunner.stopTimeline(doneCallback);
};
PerformanceTestRunner.invokeAsyncWithTimeline = async function(functionName, doneCallback) {
await PerformanceTestRunner.startTimeline();
await TestRunner.callFunctionInPageAsync(functionName);
await PerformanceTestRunner.stopTimeline(doneCallback);
};
PerformanceTestRunner.performActionsAndPrint = function(actions, typeName, includeTimeStamps) {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment