E2E Tests for Product Search and Filtering

Problem/Feature Description

An online store has a product catalog page with search and filtering capabilities. Write Playwright E2E tests.

The app runs on http://localhost:3000 with this page:

• /products -- displays a grid of product cards with:
  • A search input at the top (placeholder: "Search products...")
  • Category filter dropdown (options: All, Electronics, Clothing, Home)
  • Sort dropdown (options: Price low-high, Price high-low, Newest, Name A-Z)
  • Product cards showing name, price, category, and an "Add to cart" button
  • "Load more" button at the bottom for pagination
  • A cart icon in the header showing item count

API endpoints:

• GET /api/products?q=&category=&sort=&page= -- returns paginated products
• POST /api/cart -- adds item to cart

The page loads 12 products initially and 12 more on each "Load more" click.

Output Specification

Produce:

• playwright.config.ts -- Playwright configuration
• e2e/products.spec.ts -- E2E test file
• package.json -- with @playwright/test dependency listed

You may create additional files for good test organization.