Player not loading? Watch on YouTube
This tutorial connects Playwright MCP with GitHub Copilot in Visual Studio Code for browser automation and JavaScript test generation. The setup covers Node.js installation, checking it with node -v, and initializing a Playwright project. The presenter chooses JavaScript, a test folder, and browser installation options. A Windows environment-variable step appears in the walkthrough, while the VS Code download instructions refer to choosing the appropriate operating system.
The presenter installs the MCP server through VS Code, starts it from the command palette, and enables its tools in Copilot agent mode. A prompt asks the coding assistant to open the OrangeHRM demo website and log in with valid credentials. The demonstration encounters a "page is not defined" error before reporting a successful login.
Further prompts generate a Playwright login test and convert it to the Page Object Model pattern. The presenter requests a test based on the page object files and points out assertions that Copilot added without an explicit request. Follow-up prompts may be needed to get the intended result; the generated folder layout also differs from the presenter's preference. The walkthrough uses a locally configured browser tool, but does not demonstrate offline model inference or a self-hosted model.