1// Copyright (C) 2024 The Android Open Source Project 2// 3// Licensed under the Apache License, Version 2.0 (the "License"); 4// you may not use this file except in compliance with the License. 5// You may obtain a copy of the License at 6// 7// http://www.apache.org/licenses/LICENSE-2.0 8// 9// Unless required by applicable law or agreed to in writing, software 10// distributed under the License is distributed on an "AS IS" BASIS, 11// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12// See the License for the specific language governing permissions and 13// limitations under the License. 14 15import {test, Page, expect} from '@playwright/test'; 16import {PerfettoTestHelper} from './perfetto_ui_test_helper'; 17 18test.describe.configure({mode: 'serial'}); 19 20let pth: PerfettoTestHelper; 21let page: Page; 22 23test.beforeAll(async ({browser}, _testInfo) => { 24 page = await browser.newPage(); 25 pth = new PerfettoTestHelper(page); 26 await pth.openTraceFile('api34_startup_cold.perfetto-trace'); 27}); 28 29test('omnibox query', async () => { 30 const omnibox = page.locator('input[ref=omnibox]'); 31 await omnibox.focus(); 32 await omnibox.fill('foo'); 33 await omnibox.selectText(); 34 await omnibox.press(':'); 35 await pth.waitForPerfettoIdle(); 36 await omnibox.fill( 37 'select id, ts, dur, name, track_id from slices limit 100', 38 ); 39 await pth.waitForPerfettoIdle(); 40 await omnibox.press('Enter'); 41 42 await pth.waitForIdleAndScreenshot('query mode.png'); 43 44 page.locator('.pf-query-table').getByText('17806091326279').click(); 45 await pth.waitForIdleAndScreenshot('row 1 clicked.png'); 46 47 page.locator('.pf-query-table').getByText('17806092405136').click(); 48 await pth.waitForIdleAndScreenshot('row 2 clicked.png'); 49 50 // Clear the omnibox 51 await omnibox.selectText(); 52 for (let i = 0; i < 2; i++) { 53 await omnibox.press('Backspace'); 54 await pth.waitForPerfettoIdle(); 55 } 56 await pth.waitForIdleAndScreenshot('omnibox cleared.png', { 57 clip: {x: 0, y: 0, width: 1920, height: 100}, 58 }); 59}); 60 61test('query page', async () => { 62 await pth.navigate('#!/query'); 63 await pth.waitForPerfettoIdle(); 64 const textbox = page.locator('.pf-editor div[role=textbox]'); 65 for (let i = 1; i <= 3; i++) { 66 await textbox.focus(); 67 await textbox.clear(); 68 await textbox.fill(`select id, ts, dur, name from slices limit ${i}`); 69 await textbox.press('ControlOrMeta+Enter'); 70 await textbox.blur(); 71 await pth.waitForIdleAndScreenshot(`query limit ${i}.png`); 72 } 73 74 // Now test the query history. 75 page.locator('.query-history .history-item').nth(0).click(); 76 await pth.waitForPerfettoIdle(); 77 expect(await textbox.textContent()).toEqual( 78 'select id, ts, dur, name from slices limit 3', 79 ); 80 81 page.locator('.query-history .history-item').nth(2).click(); 82 await pth.waitForPerfettoIdle(); 83 expect(await textbox.textContent()).toEqual( 84 'select id, ts, dur, name from slices limit 1', 85 ); 86 87 // Double click on the 2nd one and expect the query is re-ran. 88 page.locator('.query-history .history-item').nth(1).dblclick(); 89 await pth.waitForPerfettoIdle(); 90 expect(await page.locator('.pf-query-table tbody tr').count()).toEqual(2); 91}); 92