0

I am working on default nop Commerce 4.50 automation for my work. I am mainly facing problem when trying to add 2 products to compare list one after another. There is a loading icon when pressing the add to compare button. I have tried Playwright

page.waitForLoadState(LoadState.DOMCONTENTLOADED); method before and after the clicks but it does not add any product to the compare list. Here is the element's code I am trying to handle HTML of add to compare button

I have tried this in Playwright Java

public void clickOnFirstProductAddToCompareButton() {
        page.waitForLoadState(LoadState.DOMCONTENTLOADED);
        page.click(firstProductHomepageAddToCompare);
        page.waitForLoadState(LoadState.DOMCONTENTLOADED);
    }

    public void clickOnSecondProductAddToCompareButton() {
        page.waitForLoadState(LoadState.DOMCONTENTLOADED);
        page.click(secondProductHomepageAddToCompare);
        page.waitForLoadState(LoadState.DOMCONTENTLOADED);
    }

When the program runs it does not the product in compare list. But if I use breakpoint and debug the code it adds the product to the compare list. please any Playwright expert help me.

alfah
  • 77
  • 5
  • 1
    Did you try this: https://playwright.dev/docs/api/class-page#page-wait-for-selector. You can wait for the loading icon to be hidden when you click on the product to be added – itronic1990 Oct 12 '22 at 12:12
  • 1
    yes, this worked using this wait for selector now. Thank you so much. – alfah Oct 13 '22 at 06:23

1 Answers1

1

Thanks to @itronic1990 this problem was solved. Mainly using Playwright's page.waitForSelector(selector);

method you can capture the notification that declares the successful addition of the product to the compare which initiated the Ajax call. Waiting for the selector of the notification has enough waiting time to get the Assertion.

alfah
  • 77
  • 5