In playwright using JS, need to add product to cart from list of product

exports.ProductListing = class ProductListing {
constructor(page) {

            this.page = page;
            this.productLocator = page.locator("xpath=(//*[@class='inventory_item'])");
            this.addToCartButton = page.getByRole("button", {name: "Add to cart"})
        }
    
        async addProductToCart(productName) {
            await this.productLocator
                .filter({ hasText: productName })
                .locator(await this.addToCartButton)
                .click();
        }
    }
    

what is wrong with this code?, I’m getting timeout error everytime

Test timeout of 90000ms exceeded.
Error: locator.click: Test timeout of 90000ms exceeded.
Call log:

• waiting for locator(‘xpath=(//*[@class=’inventory_item’])’).filter({ hasText: ‘Sauce Labs Onesie’ }).locator(getByRole(‘button’, { name: ‘Add to cart’ }))

at ..Pagesproductspage.js:13

11 | .filter({ hasText: productName })
12 | .locator(await this.addToCartButton)

13 | .click();
| ^
14 | }
15 | }
16 |