tests: Add basic playwright tests

[SwikritiT]

Description

While searching for some playwright set-up issues I came across this one and I gave it a try so I'm presenting this PR. I have setup basic tests With Playwright in JavaScript following #1790. The following changes have been made:

1. Playwright Setup: Configured Playwright in the project to enable automated end-to-end testing.
2. CI Integration: Integrated Playwright tests into the CI pipeline, ensuring tests run automatically on each build.
3. Page Object Model (POM) Implementation: Followed the POM design pattern for organizing test scripts, enhancing maintainability and readability.
4. Test Coverage: Implemented and covered the tests mentioned in the Basic playwright tests in curriculum #1790 except for the last one

Changes

1. Added Playwright configuration files and dependencies.
2. Added data-testid to certain elements that didn't have unique selectors but were crucial to the test
3. Created POM-based test scripts for the specified tests.
4. Updated CI configuration to include Playwright test execution.

Issue Reference

#1790

TODO

The test that needs to be added after this

• do a challenge and pass tests

Testing:

• All Playwright tests have been run locally and on the CI server, confirming they passed successfully.
• Link to successful CI builds: https://github.com/SwikritiT/curriculum/actions/runs/9251718293/job/25447816347#step:7:1

How to Run the Tests:

1. Install Dependencies: Ensure you have all necessary dependencies installed by running:

   npm install

2. Start the Web Server: Before running the tests, start the web server.

   npm start

   Ensure the web server is running and accessible.

3. Run Tests Locally: To execute the tests locally, use the following command:

   npm run test:e2e #run tests in headed mode
   PLAYWRIGHT_HEADLESS=true npm run test:e2e #run tests in headless mode

   Note: if your base URL is other than default "localhost:3000" you need to provide an additional env variable BASE_URL=<your-base-url> for tests to run as expected. In headed mode the tests might run too fast with multiple workers in parallel, if you want to see each test running then you can set WORKERS=1 env var to 1. Furthermore, if the test execution is very fast for the eye you can also set env var SLOW_MO=10000 to a certain time.

4. Run Tests in CI: The tests are configured to run automatically in the CI pipeline on each build. You can verify this by checking the CI logs for the test execution results.

note: the tests currently only run with Chromium browser in both CI and Local environment but this can be configured as needed

Request for Review

I would be grateful if you could take a look at this PR and review the changes if this PR meets your expectations.