Base setup for Playwright tests

[Janni2006]

This pull request introduces end-to-end testing for the frontend using Playwright as mentiones in #446.

Playwright Setup and Configuration:

• Added a GitHub Actions workflow (.github/workflows/playwright.yml) to run Playwright tests on push and pull request events, including steps for installing dependencies, setting up browsers, and uploading test reports.
• Created playwright.config.ts to configure Playwright with parallel test execution, browser projects (Chromium, Firefox, WebKit), and a local development server for testing.

Project Updates:

• Updated package.json to include Playwright as a development dependency (@playwright/test) and added new scripts for running Playwright tests (test:e2e and test:e2e:headless).

Test Implementation:

• Added a sample test suite in webtests/header.spec.ts to verify the visibility of header elements and functionality of the language dropdown.

Documentation:

• Added webtests/writing_tests.md to provide an overview of Playwright, instructions for running tests locally, and references to official Playwright documentation.

[github-actions]

Hi @Janni2006
Thank you for contributing to the Opencast Admin UI.
We noticed that you have not yet filed an Individual Contributor License Agreement. Doing that (once) helps us to ensure that Opencast stays free for all. If you make your contribution on behalf of an institution, you might also want to file a Corporate Contributor License Agreement (giving you as individual contributor a bit more security as well). It can take a while for this bot to find out about new filings, so if you just filed one or both of the above do not worry about this message!
Please let us know if you have any questions regarding the CLA.

[github-actions]

Use docker or podman to test this pull request locally.

Run test server using develop.opencast.org as backend:

podman run --rm -it -p 127.0.0.1:3000:3000 ghcr.io/opencast/opencast-admin-interface:pr-1255

Specify a different backend like stable.opencast.org:

podman run --rm -it -p 127.0.0.1:3000:3000 -e PROXY_TARGET=https://stable.opencast.org ghcr.io/opencast/opencast-admin-interface:pr-1255

It may take a few seconds for the interface to spin up.
It will then be available at http://127.0.0.1:3000.
For more options you can pass on to the proxy, take a look at the README.md.

[github-actions]

This pull request is deployed at test.admin-interface.opencast.org/1255/2025-05-21_14-30-57/ .
It might take a few minutes for it to become available.

[github-actions]

This pull request has conflicts ☹
Please resolve those so we can review the pull request.
Thanks.

[luniki]

I have checked out your branch and started the test npm run test:e2e:headless which opened a browser tab of the admin UI but then nothing happened.

What am I missing?

[luniki]

 npm run test:e2e:headless

> [email protected] test:e2e:headless
> playwright test

Error: Timed out waiting 60000ms from config.webServer.

To open last HTML report run:

  npx playwright show-report

[Arnei]

I am also running into this timeout.

[gregorydlogan]

This works for me, except for the tests in Edge since I'm not on a windows box.

[Janni2006]

I was not able to replicate your issues locally, therefor my conclusions are only drawn from the issues with the github actions.
The error you mentioned @luniki indicates that the browsers inside of the playwright test environment could not connect to the local webserver running the frontend application. In case of the github worflow the solution was to specify localhost as the server instead of 127.0.0.1. I hope the solution works for you aswell.

[Janni2006]

This works for me, except for the tests in Edge since I'm not on a windows box.

Sorry, I forgot to add the installation instructions. You can run npx playwright install --with-deps to install all browser binaries needed for playwright. As far as I know it install the dependencies for Edge under Linux as well.

[Arnei]

It seems Fedora is not officially supported by playwright and I don't feel like hunting down the required deps myself, so I'll leave this review to someone else ^^'

[github-actions]

This pull request has conflicts ☹
Please resolve those so we can review the pull request.
Thanks.

[github-actions]

This pull request has conflicts ☹
Please resolve those so we can review the pull request.
Thanks.