add code to the hook so it can actually save a screenshot on error & …

…create a 2nd feature file

features/ErrorValidations.feature

@@ -0,0 +1,14 @@
+Feature: Ecommerce2 validations
+
+    Scenario: Placing the Order
+        Given a login to Ecommerce2 application with "[email protected]" and "Password1"
+        Then Verify Error Message is displayed
+
+#          await page.goto("https://rahulshettyacademy.com/loginpagePractise/");
+#    await userNameInput.fill("rahulshe");
+#    await page.locator("[type='password']").fill("learning");
+#    await signInButton.click();
+#         # //no explicit wait needed like selenium (takes one from config 30s) 
+#     console.log(await page.locator("[style*='block']").textContent()); // grab text
+#     await expect(page.locator("[style*='block']")).toContainText('Incorrect'); //no need to have all text, just one word in this case
+

features/support/hooks.js

@@ -1,6 +1,6 @@
 const playwright =  require('playwright/test');
 const { POManager } = require("../../pageObjects/POManager");
-const { Before, After } = require ('@cucumber/cucumber');
+const { Before, After, BeforeStep, AfterStep, Status } = require ('@cucumber/cucumber');
 
 
 Before(async function() {
@@ -16,8 +16,10 @@ Before(async function() {
 BeforeStep(function(){
 
 });
-AfterStep(function({result}){
-
+AfterStep(async function({result}){
+    if(result.status === Status.FAILED){
+        await this.page.screenshot({path: 'screenshot1.png'});
+    }
 });
 
 After (function(){