web-show-recommender VS Playwright

Make sure to update CSS on the App.css file from here: https://github.com/ayush2390/web-show-recommender/blob/main/src/App.css

Playwright enables reliable end-to-end testing for modern web apps.

/*Importing test which help you to write test cases */ /*Importing expect which help to validate expected result */ const { test, expect } = require('@playwright/test'); /* Open Playwright url*/ test('has title', async ({ page }) => { await page.goto('https://playwright.dev/'); // Expect a title "to contain" a substring. await expect(page).toHaveTitle(/Playwright/); }); test('get started link', async ({ page }) => { await page.goto('https://playwright.dev/'); // Click the get started link. await page.getByRole('link', { name: 'Get started' }).click(); // Expects page to have a heading with the name of Installation. await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible(); });

In this tutorial, we can extract data from the HTML structure, so we will go with Cheerio, but for extracting data from SPAs or JavaScript-rendered websites, Crawlee also supports headless browser libraries like Playwright and Puppeteer

Playwright is an end-to-end testing framework developed by Microsoft and available in multiple programming languages. Its focus is on cross-browser testing, using Chromium as the default browser. To perform the test logic on a Chromium-based browser, it controls and instructs a browser instance to perform desired actions via the DevTools Protocol.

Playwright documentation

In Crawlee, you can scrape JavaScript rendered websites using the built-in headless Puppeteer and Playwright browsers. It is important to note that, by default, Crawlee scrapes in headless mode. If you don't want headless, then just set headless: false.

Playwright, an end-to-end test runner;

We start with a project that was bootstrapped with npx create-next-app. For the E2E test we use Playwright and set it up as described in the testing guide provided by Next.js.