| User Manual | API Reference | Blog | Forum |

The PlayCanvas Editor is a visual editing environment for building WebGL/WebGPU/WebXR apps. It can be accessed at https://playcanvas.com.

You can see more projects built using the Editor on the PlayCanvas website.

To initialize a local development environment for the Editor Frontend, ensure you have Node.js 18 or later installed. Follow these steps:

1. Clone the repository:

   git clone https://github.com/playcanvas/editor.git
   cd editor

2. Install dependencies:

   npm install

3. Build the Editor frontend and start a local web server:

   npm run develop

4. Open the Editor at playcanvas.com and append the query parameter use_local_frontend to load the development build:

   https://playcanvas.com/editor/scene/<YOUR_SCENE_ID>?use_local_frontend
   

   This will load the Editor frontend from http://localhost:3487 instead of the production build.

The Editor is built on the following open source libraries:

To test the integration of these libraries, use npm link. Follow these steps:

1. Create a global link from source

   cd <library>
   npm link

2. Create a link to the global link

   cd editor
   npm link <library>

The test suite for the PlayCanvas Editor uses Playwright for end-to-end testing.

Tests are split into two categories:

• test-suite/test/api - tests for the Editor API behavior
• test-suite/test/ui - tests for the Editor UI behavior

To run the test suite ensure you have Docker installed. Follow these steps:

1. Create a .env file based on the template

   PC_HOST=playcanvas.com
   PC_LOGIN_HOST=login.playcanvas.com
   PC_LAUNCH_HOST=launch.playcanvas.com
   PC_LOCAL_FRONTEND=<true|false>
   PC_COOKIE_NAME=pc_auth
   PC_COOKIE_VALUE=<playcanvas-cookie>

2. Run the container with Docker compose

   docker compose up

3. Stop the container with Docker compose

   docker compose down --remove-orphans

To create new tests, ensure you have Node.js 18 or later installed. Follow these steps:

1. Install dependencies:

   cd test-suite
   npx playwright install --with-deps
   npm install

2. Create tests and put them into the respective folders. For dynamic recording of tests run this command:

   npm run codegen