chore(html): render locator.fill value (#35457)

packages/playwright/src/index.ts

@@ -753,14 +753,20 @@ class ArtifactsRecorder {
   }
 }
 
-const paramsToRender = ['url', 'selector', 'text', 'key'];
-
+function paramsToRender(apiName: string) {
+  switch (apiName) {
+    case 'locator.fill':
+      return ['value'];
+    default:
+      return ['url', 'selector', 'text', 'key'];
+  }
+}
 function renderApiCall(apiName: string, params: any) {
   if (apiName === 'tracing.group')
     return params.name;
   const paramsArray = [];
   if (params) {
-    for (const name of paramsToRender) {
+    for (const name of paramsToRender(apiName)) {
       if (!(name in params))
         continue;
       let value;

tests/playwright-test/test-step.spec.ts

@@ -1169,7 +1169,7 @@ test('should report api steps', async ({ runInlineTest, server }) => {
         let myPage;
         test.beforeAll(async ({ browser }) => {
           myPage = await browser.newPage();
-          await myPage.setContent('<button></button>');
+          await myPage.setContent('<button></button><input/>');
         });
 
         test('pass1', async () => {
@@ -1178,6 +1178,9 @@ test('should report api steps', async ({ runInlineTest, server }) => {
         test('pass2', async () => {
           await myPage.click('button');
         });
+        test('pass3', async () => {
+          await myPage.getByRole('textbox').fill('foo');
+        });
 
         test.afterAll(async () => {
           await myPage.close();
@@ -1197,8 +1200,11 @@ hook      |After Hooks
 hook      |Before Hooks
 pw:api    |page.click(button) @ a.test.ts:25
 hook      |After Hooks
-hook      |  afterAll hook @ a.test.ts:28
-pw:api    |    page.close @ a.test.ts:29
+hook      |Before Hooks
+pw:api    |locator.fill(foo) @ a.test.ts:28
+hook      |After Hooks
+hook      |  afterAll hook @ a.test.ts:31
+pw:api    |    page.close @ a.test.ts:32
 hook      |Before Hooks
 fixture   |  fixture: browser
 pw:api    |    browserType.launch