diff --git a/docs/docs/develop/react-frontend.md b/docs/docs/develop/react-frontend.md index 1c4a525a76..ab841e9008 100644 --- a/docs/docs/develop/react-frontend.md +++ b/docs/docs/develop/react-frontend.md @@ -1,11 +1,20 @@ --- -title: Platform UI / React +title: React Frontend Development --- ## Setup -The new React-based UI will not be available by default. In order to set your development environment up to view the frontend, follow this guide. -The new UI requires a separate frontend server to run to serve data for the new Frontend. +The following documentation details how to setup and run a development installation of the InvenTree frontend user interface. + +### Prerequisites + +To run the frontend development server, you will need to have the following installed: + +- Node.js +- Yarn + +!!! note "Devcontainer" + The [devcontainer](./devcontainer.md) setup already includes all prerequisite packages, and is ready to run the frontend server. ### Install @@ -79,3 +88,27 @@ When running the frontend development server, some features may not work entirel #### SSO Login When logging into the frontend dev server via SSO, the redirect URL may not redirect correctly. + +## Testing + +The frontend codebase it tested using [Playwright](https://playwright.dev/). There are a large number of tests that cover the frontend codebase, which are run automatically as part of the CI pipeline. + +### Install Playwright + +To install the required packages to run the tests, you can use the following command: + +```bash +cd src/frontend +npx playwright install +``` + +### Running Tests + +To run the tests locally, in an interactive editor, you can use the following command: + +```bash +cd src/frontend +npx playwright test --ui +``` + +This will first launch the backend server (at `http://localhost:8000`), and then run the tests against the frontend server (at `http://localhost:5173`). An interactive browser window will open, and you can run the tests individually or as a group.