chore: optimize report logic

Author: zhoushaw

packages/visualizer/src/component/sidebar.tsx

@@ -186,7 +186,7 @@ const Sidebar = (props: { hideLogo?: boolean }): JSX.Element => {
   return (
     <div className="side-bar">
       <div className="top-controls">
-        <div className="brand" onClick={reset} style={{ display: props?.hideLogo ? 'none' : 'block' }}>
+        <div className="brand" onClick={reset} style={{ display: props?.hideLogo ? 'none' : 'flex' }}>
           <Logo
             style={{ width: 70, height: 70, margin: 'auto' }}
             // onClick={() => {

packages/web-integration/src/playwright/index.ts

@@ -39,10 +39,11 @@ export const PlaywrightAiFixture = () => {
 
   return {
     ai: async ({ page }: any, use: any, testInfo: TestInfo) => {
-      await use(async (taskPrompt: string, type = 'action') => {
+      await use(async (taskPrompt: string, opts?: { type?: 'action' | 'query' }) => {
         const { groupName, caseName } = groupAndCaseForTest(testInfo);
         const agent = agentForPage(page, testInfo.testId);
-        const result = await agent.ai(taskPrompt, type, caseName, groupName);
+        const actionType = opts?.type || 'action';
+        const result = await agent.ai(taskPrompt, actionType, caseName, groupName);
         if (agent.dumpFile) {
           testInfo.annotations.push({
             type: 'PLAYWRIGHT_AI_ACTION',
@@ -93,7 +94,7 @@ export const PlaywrightAiFixture = () => {
 };
 
 export type PlayWrightAiFixtureType = {
-  ai: <T = any>(prompt: string, type?: 'action' | 'query') => Promise<T>;
+  ai: <T = any>(prompt: string, opts?: { type?: 'action' | 'query' }) => Promise<T>;
   aiAction: (taskPrompt: string) => ReturnType<PageTaskExecutor['action']>;
   aiQuery: <T = any>(demand: any) => Promise<T>;
 };

packages/web-integration/tests/e2e/ai-auto-todo.spec.ts

@@ -1,24 +1,24 @@
-// import { expect } from 'playwright/test';
+import { expect } from 'playwright/test';
 import { test } from './fixture';
 
 test.beforeEach(async ({ page }) => {
   await page.goto('https://todomvc.com/examples/react/dist/');
 });
 
-test('ai todo', async ({ ai, aiQuery: _test }) => {
+test('ai todo', async ({ ai, aiQuery }) => {
   await ai('Enter "Learn JS today" in the task box, then press Enter to create');
-  //   await ai('Enter "Learn Rust tomorrow" in the task box, then press Enter to create');
-  //   await ai('Enter "Learning AI the day after tomorrow" in the task box, then press Enter to create');
-  //   await ai(
-  //     'Move your mouse over the second item in the task list and click the Delete button to the right of the second task',
-  //   );
-  //   await ai('Click the check button to the left of the second task');
-  //   await ai('Click the completed Status button below the task list');
+  await ai('Enter "Learn Rust tomorrow" in the task box, then press Enter to create');
+  await ai('Enter "Learning AI the day after tomorrow" in the task box, then press Enter to create');
+  await ai(
+    'Move your mouse over the second item in the task list and click the Delete button to the right of the second task',
+  );
+  await ai('Click the check button to the left of the second task');
+  await ai('Click the completed Status button below the task list');
 
-  //   const taskList = await aiQuery<string[]>('string[], tasks in the list');
-  //   expect(taskList.length).toBe(1);
-  //   expect(taskList[0]).toBe('Learning AI the day after tomorrow');
+  const taskList = await aiQuery<string[]>('string[], tasks in the list');
+  expect(taskList.length).toBe(1);
+  expect(taskList[0]).toBe('Learning AI the day after tomorrow');
 
-  //   const placeholder = await ai('string, return the placeholder text in the input box', 'query');
-  //   expect(placeholder).toBe('What needs to be done?');
+  const placeholder = await ai('string, return the placeholder text in the input box', { type: 'query' });
+  expect(placeholder).toBe('What needs to be done?');
 });