[Playwright] JavaScript, TypeScript 환경에서 Playwright 설치하기

나는 Python을 선호해서 pip install로만 설치해봤는데,

Playwright는 Node.js 기반으로 먼저 나왔고 나중에 Pyhon, Java, .NET 버전이 추가된 것이라고 한다.

 

JavaScript, TypeScript를 사용할 환경에서는 아래 방법을 따라서 Playwright를 설치하면 된다.

 

참고!

- Node.js는 자바스크립트를 서버에서도 사용할 수 있도록 하는 서버사이드 스크립트 언어다.
- 확장성 있는 네트워크 애플리케이션을 개발하기 위해 사용되는 소프트웨어 플래폼으로, V8엔진 위에서 동작한다.

 

---

 

✔️ JavaScript, TypeScript 환경에서 Playwright 설치 방법

 

1. Node.js 설치 (Node.js 기반 Playwright를 사용하는 경우에만 해당)

- Playwright는 Node.js 기반의 E2E 테스트 프레임워크다.

- 따라서 Playwright를 사용하려면 Node.js 실행 환경이 필요하기에, Node.js를 먼저 설치해야 한다.

- Node.js LTS(Long-Term Support)버전은 18.X / 20.X / 22.X 이런 식으로 올라간다. (짝수만 LTS, 홀수는 Current로 단기지원)

- 나는 Python을 사용할거라서 Node.js 설치는 Skip 하겠다.

curl -fsSL https://deb.nodesource.com/setup_22.x | sudo bash -
sudo apt-get install -y nodejs

# 설치 및 버전 확인
node -v
npm -v

 

수동 설치 방법

- 외부 통신이 안될 경우 패키지를 직접 다운로드 받아서 서버에 SFTP로 넣어주면 된다.

 

👇패키지 다운로드는 아래 공식 홈페이지에서 가능

https://nodejs.org/ko/download

Node.js — Node.js® 다운로드

 

# 패키지 압축 해제
tar -xvf ~/node-v22.17.1-linux-x64.tar.xz

# 디렉토리 이름 변경 (필수 아님, 관리하기 편하라고 설정함)
mv node-v22.17.1-linux-x64 nodejs

# 경로 등록 (PATH 환경변수에 추가)
## root 권한으로 시스템 전체 적용하는 방법 (나는 이걸로)
echo 'export PATH=/home/automation/nodejs/bin:$PATH' > /etc/profile.d/node.sh
chmod +x /etc/profile.d/node.sh
source /etc/profile.d/node.sh

## 현재 사용자만 적용하는 방법
echo 'export PATH=/home/automation/nodejs/bin:$PATH' >> ~/.bashrc
source ~/.bashrc

# 설치 및 버전 확인
node -v
npm -v

 

 

 

2. Playwright 설치 (Node.js 기반 Playwright를 사용하는 경우에만 해당)

 

- 프로젝트 초기화

# 디렉토리 생성 및 이동
mkdir -p ~/playwright-tests
cd ~/playwright-tests

# Node.js 프로젝트 초기화
npm init -y

 

-  Playwright 설치

# Node.js 프로젝트에 Playwright를 개발 의존성으로 설치
npm install --save-dev playwright

- Ubuntu인 경우, 아래 명령어로 브라우저 설치 시, 리눅스 의존성 패키지를 함께 설치할 수 있다.

# 브라우저 설치 시, 의존성 패키지 함께 설치
npx playwright install --with-deps

- RHEL 계열의 경우, 수동으로 브라우저 의존성을 설치해야 한다.

- 그 뒤에 브라우저(Chromium, Firefox, WebKit) 설치

# RHEL 계열 리눅스일 경우, 수동 의존성 설치
sudo dnf install -y \
  wget unzip \
  libX11 libXcomposite libXcursor libXdamage libXext libXfixes libXi libXtst \
  cups-libs libXScrnSaver libXrandr alsa-lib atk at-spi2-atk at-spi2-core \
  cairo dbus-glib gtk3 gtk4 pango gdk-pixbuf
  
  # --with-deps 제거하고 수동 설치
  npx playwright install

 

 

이렇게 하면 Node.js 및 Playwright 설치 완료!