Chromium Code Reviews| Index: tracing/tracing/ui/extras/side_panel/fame_data_side_panel_test.html |
| diff --git a/tracing/tracing/ui/extras/side_panel/fame_data_side_panel_test.html b/tracing/tracing/ui/extras/side_panel/fame_data_side_panel_test.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..9c2956c6e275f3cceffeaf47a7a544dd8f890ffd |
| --- /dev/null |
| +++ b/tracing/tracing/ui/extras/side_panel/fame_data_side_panel_test.html |
| @@ -0,0 +1,221 @@ |
| +<!DOCTYPE html> |
|
Xiaocheng
2016/05/31 12:01:10
Incorrect file name.
|
| +<!-- |
| +Copyright 2016 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. |
| +--> |
| + |
| +<link rel="import" href="/tracing/core/test_utils.html"> |
| +<link rel="import" href="/tracing/extras/chrome/blame_context/frame_tree_node.html"> |
| +<link rel="import" href="/tracing/extras/chrome/blame_context/render_frame.html"> |
| +<link rel="import" href="/tracing/extras/chrome/blame_context/top_level.html"> |
| +<link rel="import" href="/tracing/extras/importer/trace_event_importer.html"> |
| +<link rel="import" href="/tracing/model/model.html"> |
| +<link rel="import" href="/tracing/model/scoped_id.html"> |
| +<link rel="import" href="/tracing/ui/extras/side_panel/frame_data_side_panel.html"> |
| + |
| +<script> |
| +'use strict'; |
| + |
| +tr.b.unittest.testSuite(function() { |
| + function topLevelEvent(pid, id) { |
| + return { |
| + pid: pid, |
| + id: id, |
| + tid: 1, |
| + ts: 0, |
| + ph: 'O', |
| + cat: 'blink', |
| + scope: 'PlatformThread', |
| + name: 'TopLevel', |
| + args: {snapshot: {}} |
| + }; |
| + } |
| + |
| + function renderFrameEvent(pid, id, parent) { |
| + return { |
| + pid: pid, |
| + id: id, |
| + tid: 1, |
| + ts: 0, |
| + ph: 'O', |
| + cat: 'blink', |
| + scope: 'RenderFrame', |
| + name: 'RenderFrame', |
| + args: {snapshot: {parent: { |
| + id_ref: parent.id, |
| + scope: parent.scope |
| + }}} |
| + }; |
| + } |
| + |
| + function frameTreeNodeEvent(pid, id, opt_renderFrame, opt_parentId) { |
| + var ans = { |
| + pid: pid, |
| + id: id, |
| + tid: 1, |
| + ts: 0, |
| + ph: 'O', |
| + cat: 'navigation', |
| + scope: 'FrameTreeNode', |
| + name: 'FrameTreeNode', |
| + args: {snapshot: {}} |
| + }; |
| + if (opt_renderFrame) { |
| + ans.args.snapshot.RenderFrame = { |
| + id_ref: opt_renderFrame.id, |
| + pid_ref: opt_renderFrame.pid, |
| + scope: 'RenderFrame' |
| + }; |
| + } |
| + if (opt_parentId) { |
| + ans.args.snapshot.parent = { |
| + id_ref: opt_parentId, |
| + scope: 'FrameTreeNode' |
| + }; |
| + } |
| + return ans; |
| + } |
| + |
| + /** |
| + * Creates some independent contexts. Checks if all are present in the panel. |
| + */ |
| + test('basic', function() { |
| + var events = [ |
| + topLevelEvent(1, '0x1'), |
| + renderFrameEvent(1, '0x2', {id: '0x1', scope: 'PlatformThread'}), |
| + frameTreeNodeEvent(2, '0x3') |
| + ]; |
| + var panel = document.createElement('tr-ui-e-s-frame-data-side-panel'); |
| + panel.model = tr.c.TestUtils.newModelWithEvents([events]); |
| + assert.lengthOf(panel.$.table.tableRows, 3); |
| + |
| + this.addHTMLOutput(panel); |
| + }); |
| + |
| + /** |
| + * Creates a FrameTreeNode in the browser process and a RenderFrame in a |
| + * renderer process that are the same frame. Checks if they are merged into |
| + * one row in the panel. |
| + */ |
| + test('mergeCrossProcessFrameBlameContexts', function() { |
| + var events = [ |
| + topLevelEvent(1, '0x1'), |
| + renderFrameEvent(1, '0x2', {id: '0x1', scope: 'PlatformThread'}), |
| + frameTreeNodeEvent(2, '0x3', {id: '0x2', pid: 1}) |
| + ]; |
| + var panel = document.createElement('tr-ui-e-s-frame-data-side-panel'); |
| + panel.model = tr.c.TestUtils.newModelWithEvents([events]); |
| + assert.lengthOf(panel.$.table.tableRows, 2); |
| + |
| + this.addHTMLOutput(panel); |
| + }); |
| + |
| + function sliceEvent(pid, start, duration) { |
| + return { |
| + pid: pid, |
| + ts: start, |
| + dur: duration, |
| + tid: 1, |
| + ph: 'X', |
| + cat: 'cat', |
| + name: 'a', |
| + args: {} |
| + }; |
| + } |
| + |
| + function enterTopLevelEvent(pid, ts, id) { |
| + return { |
| + pid: pid, |
| + ts: ts, |
| + id: id, |
| + tid: 1, |
| + ph: '(', |
| + cat: 'blink', |
| + name: 'FrameBlameContext', |
| + scope: 'PlatformThread' |
| + }; |
| + } |
| + |
| + function leaveTopLevelEvent(pid, ts, id) { |
| + return { |
| + pid: pid, |
| + ts: ts, |
| + id: id, |
| + tid: 1, |
| + ph: ')', |
| + cat: 'blink', |
| + name: 'FrameBlameContext', |
| + scope: 'PlatformThread' |
| + }; |
| + } |
| + |
| + function getTopLevelSnapshot(process, id) { |
| + return process.objects.getSnapshotAt( |
| + new tr.model.ScopedId('PlatformThread', id), 0); |
| + } |
| + |
| + /** |
| + * Changes the range of interest. Checks if the panel updates correspondingly. |
| + */ |
| + test('respondToRangeOfInterest', function() { |
| + var events = [ |
| + topLevelEvent(1, '0x1'), |
| + enterTopLevelEvent(1, 1000, '0x1'), |
| + sliceEvent(1, 1500, 500), |
| + sliceEvent(1, 2500, 500), |
| + leaveTopLevelEvent(1, 3500, '0x1') |
| + ]; |
| + var model = tr.c.TestUtils.newModelWithEvents([events]); |
| + var topLevel = getTopLevelSnapshot(model.processes[1], '0x1'); |
| + var slice1 = model.processes[1].threads[1].sliceGroup.slices[0]; |
| + var slice2 = model.processes[1].threads[1].sliceGroup.slices[1]; |
| + |
| + var panel = document.createElement('tr-ui-e-s-frame-data-side-panel'); |
| + panel.model = model; |
| + |
| + // The default range of interest contains both slices. |
| + assert.isTrue(panel.$.table.tableRows[0].eventsOfInterest.equals( |
| + new tr.model.EventSet([topLevel, slice1, slice2]))); |
| + |
| + // The new range of interest contains only slice2. |
| + panel.rangeOfInterest = tr.b.Range.fromExplicitRange(slice2.start, |
| + slice2.end); |
| + assert.isTrue(panel.$.table.tableRows[0].eventsOfInterest.equals( |
| + new tr.model.EventSet([topLevel, slice2]))); |
| + |
| + this.addHTMLOutput(panel); |
| + }); |
| + |
| + /** |
| + * Selects a row in the panel. Checks if the context(s) of the row and the |
| + * slices attributed to the row are selected. |
| + */ |
| + test('selectAttributedEvents', function() { |
| + var events = [ |
| + topLevelEvent(1, '0x1'), |
| + enterTopLevelEvent(1, 1000, '0x1'), |
| + sliceEvent(1, 1500, 500), |
| + leaveTopLevelEvent(1, 2500, '0x1') |
| + ]; |
| + var model = tr.c.TestUtils.newModelWithEvents([events]); |
| + var topLevel = getTopLevelSnapshot(model.processes[1], '0x1'); |
| + var slice = model.processes[1].threads[1].sliceGroup.slices[0]; |
| + |
| + var panel = document.createElement('tr-ui-e-s-frame-data-side-panel'); |
| + panel.model = model; |
| + |
| + var selectionChanged = false; |
| + panel.addEventListener('requestSelectionChange', function(e) { |
| + selectionChanged = true; |
| + assert.isTrue( |
| + e.selection.equals(new tr.model.EventSet([topLevel, slice]))); |
| + }); |
| + panel.$.table.selectedTableRow = panel.$.table.tableRows[0]; |
| + assert.isTrue(selectionChanged); |
| + |
| + this.addHTMLOutput(panel); |
| + }); |
| + |
|
petrcermak
2016/05/31 09:57:24
nit: remove blank line.
Xiaocheng
2016/05/31 12:01:10
Done.
|
| +}); |
| +</script> |