firsttris/Ubuntu-Node-Playwright-Distrobox.md

## Ubuntu-Node-Playwright-Distrobox.md

      
    Raw
  

              Ubuntu-Node-Playwright-Distrobox.md
            
          
    Setting up an Ubuntu Distrobox for Node.js & Playwright

This guide covers the creation of a specialized Ubuntu container for web development, including Node Version Manager (NVM), Node.js 24, and Playwright with all necessary system dependencies.

1. Create the Distrobox

First, create the container using the Ubuntu 24.04 image and include essential terminal tools.
distrobox create \
  --name ubuntu-node-dev \
  --image ubuntu:24.04 \
  --additional-packages "fish curl git wget nano"

Enter the container:
distrobox enter ubuntu-node-dev


2. Install Node.js via NVM

Inside the Distrobox, install NVM to manage your Node.js versions.
Download and run the installer

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash

Refresh your Shell

To start using NVM immediately without logging out, restart your shell or source your config:

For Bash: source ~/.bashrc
For Fish: (you need to install fisher and nvm.fish)

curl -sL https://raw.githubusercontent.com/jorgebucaran/fisher/main/functions/fisher.fish | source && fisher install jorgebucaran/fisher
fisher install jorgebucaran/nvm.fish

Install Node.js 24

nvm install 24

Verify Installation

node -v # Expected: v24.x.x
npm -v  # Expected: 10.x.x or 11.x.x


3. Setup Playwright

Playwright requires specific system libraries (browsers, fonts, and dependencies) to run correctly.
Install Playwright and System Dependencies

Run this command inside your project folder (or a temp folder) to install the necessary browsers and their OS-level dependencies:
npx playwright install --with-deps


4. Running Tests

You can now run your End-to-End tests. Since Distrobox shares the host's X11/Wayland server, the UI mode will work out of the box.
npm run test:e2e:ui
No results found