Improved displaying step names in test report

Author: BakkappaN

playwright.config.js

@@ -10,7 +10,9 @@ require('dotenv').config();
 module.exports = defineConfig({
   // test timeout
   timeout: 5 * 60 * 1000,
-  
+  expect: {
+    timeout: 2 * 60 * 1000
+  },
   testDir: './tests',
   /* Run tests in files in parallel */
   fullyParallel: false,

tests/apitest.spec.js

@@ -7,63 +7,71 @@ test.use({
   baseURL: process.env.API_BASE_URI.toString()
 })
 
-test("End to End api test in playwright", async ({ request }) => {
-  // create post api request using playwright
-  const postAPIResponse = await request.post("/booking", {
-    data: postRequest,
+test("End to End API testing using playwright", async ({ request }) => {
+
+  const tokenNo = null;
+
+  const postAPIResponse = await test.step('Create booking', async () => {
+    return await request.post("/booking", {
+      data: postRequest,
+    });
   });
 
   const bookingId = await postAPIResponse.json();
   const bId = bookingId.bookingid;
 
-  // create GET api request using playwright
-  const getAPIResponse = await request.get("/booking/", {
-    params: {
-      firstname: "testers talk playwright",
-      lastname: "testers talk api testing",
-    },
+  let getAPIResponse = await test.step('Get booking details', async () => {
+    return await request.get("/booking/", {
+      params: {
+        firstname: "testers talk playwright",
+        lastname: "testers talk api testing",
+      },
+    });
   });
 
-  // validate status code
-  console.log(await getAPIResponse.json());
-  expect(getAPIResponse.ok()).toBeTruthy();
-  expect(getAPIResponse.status()).toBe(200);
-
-  // generate token
-  const tokenAPIResponse = await request.post("/auth", {
-    data: tokenRequest,
+  await test.step('Validate status code', async () => {
+    console.log(await getAPIResponse.json());
+    expect(getAPIResponse.ok()).toBeTruthy();
+    expect(getAPIResponse.status()).toBe(200);
   });
-  expect(tokenAPIResponse.ok()).toBeTruthy();
-  expect(tokenAPIResponse.status()).toBe(200);
 
-  console.log(await tokenAPIResponse.json());
-  const tokenResponseBody = await tokenAPIResponse.json();
-  const tokenNo = tokenResponseBody.token;
+  const tokenAPIResponse = await test.step('Generate token & Validate status code', async () => {
+    return await request.post("/auth", {
+      data: tokenRequest,
+    });
+    expect(tokenAPIResponse.ok()).toBeTruthy();
+    expect(tokenAPIResponse.status()).toBe(200);
 
-  // partial update booking details
-  const patchAPIResponse = await request.patch(`/booking/${bId}`, {
-    headers: {
-      "Content-Type": "application/json",
-      Cookie: `token=${tokenNo}`,
-    },
-    data: {
-      firstname: "testers talk postman",
-      lastname: "testers talk rest assured",
-    },
+    console.log(await tokenAPIResponse.json());
+    const tokenResponseBody = await tokenAPIResponse.json();
+    tokenNo = tokenResponseBody.token;
   });
 
-  console.log(await patchAPIResponse.json());
-  expect(patchAPIResponse.ok()).toBeTruthy();
-  expect(patchAPIResponse.status()).toBe(200);
+  const patchAPIResponse = await test.step('Partial update booking details & Validate status code', async () => {
+    return await request.patch(`/booking/${bId}`, {
+      headers: {
+        "Content-Type": "application/json",
+        Cookie: `token=${tokenNo}`,
+      },
+      data: {
+        firstname: "testers talk postman",
+        lastname: "testers talk rest assured",
+      },
+    });
+
+    console.log(await patchAPIResponse.json());
+    expect(patchAPIResponse.ok()).toBeTruthy();
+    expect(patchAPIResponse.status()).toBe(200);
+  });
 
-  // DELETE api request
-  // partial update booking details
-  const deleteAPIResponse = await request.delete(`/booking/${bId}`, {
-    headers: {
-      "Content-Type": "application/json",
-      "Cookie": `token=${tokenNo}`,
-    },
+  const deleteAPIResponse = await test.step('Delete booking & Validate status code', async () => {
+    return await request.delete(`/booking/${bId}`, {
+      headers: {
+        "Content-Type": "application/json",
+        "Cookie": `token=${tokenNo}`,
+      },
+    });
+    expect(deleteAPIResponse.status()).toBe(201);
+    expect(deleteAPIResponse.statusText()).toBe("Created");
   });
-  expect(deleteAPIResponse.status()).toBe(201);
-  expect(deleteAPIResponse.statusText()).toBe("Created");
 });

tests/uitest.spec.js

@@ -1,5 +1,5 @@
 // Include playwright module
-const {test, expect} = require('@playwright/test');
+const { test, expect } = require('@playwright/test');
 const { HomePage } = require('../pages/homepage');
 const { ResultPage } = require('../pages/resultpage');
 const { PlaylistPage } = require('../pages/playlistpage');
@@ -8,34 +8,36 @@ import { stageTestData } from "../test-data/stage/google.json";
 
 let testData = null;
 
-test.beforeAll('Running before all tests', ()=>{
-    if(process.env.ENV == 'qa'){
+test.beforeAll('Running before all tests', () => {
+    if (process.env.ENV == 'qa') {
         testData = qaTestData;
-    }else{
+    } else {
         testData = stageTestData;
     }
 })
 
 // Write a test
-test('Ui automation test in playwright', async({page}) =>{
-    // Go to URL
-    const homepage = new HomePage(page);
-    await homepage.goto();
-   
-    // Search with keywords
-    homepage.searchKeywords(testData.skill1);
+test('UI automation test using playwright', async ({ page }) => {
 
-    // Click on playlist
+    const homepage = new HomePage(page);
     const resultpage = new ResultPage(page);
-    resultpage.clickOnPlaylist();
+    const playlistpage = new PlaylistPage(page);
 
-    await page.waitForTimeout(4000);
+    await test.step('Go to URL', async () => {
+        await homepage.goto();
+    });
 
-    // Click on video
-    const playlistpage = new PlaylistPage(page);
-    playlistpage.clickOnVideo();
+    await test.step('Search with keywords', async () => {
+        await homepage.searchKeywords(testData.skill1);
+    });
 
-    await page.waitForTimeout(8000);
-})
+    await test.step('Click on playlist', async () => {
+        await resultpage.clickOnPlaylist();
+        await page.waitForTimeout(4000);
+    });
 
-    
+    await test.step('Click on video', async () => {
+        await playlistpage.clickOnVideo();
+        await page.waitForTimeout(8000);
+    });
+})