# Playwright Basics

这个目录是你的第二阶段练习。

目标不是立刻重写整个项目，而是先把 `Playwright Python` 最常用的几个能力拆开练一遍，再回头和现在的 `DrissionPage` 实现对照。

这里的文件故意保留了 `TODO`，你需要自己把它们补完整。

## 建议学习顺序

1. `01_open_page.py`
2. `02_persistent_context.py`
3. `03_wait_and_locate.py`
4. `04_listen_response.py`
5. `05_download_video.py`

## 开始前先准备

在项目根目录执行：

```bash
python3 -m venv .venv
source .venv/bin/activate
pip install requests playwright
./.venv/bin/python -m playwright install chromium
```

## 练习原则

- 不要一开始就追求“项目可直接替换”
- 每次只补一个文件
- 跑起来后优先 `print()` 看页面对象、locator、response、json 数据长什么样
- 先写最小可运行版本，再慢慢整理函数
- 如果遇到元素定位失败，先确认页面是不是你以为的那个页面

## 每个文件你应该关注什么

### `01_open_page.py`

- 学会 `sync_playwright()`
- 学会 `browser = playwright.chromium.launch(...)`
- 学会 `page.goto(url)`
- 学会打印标题和 URL

运行：

```bash
./.venv/bin/python learning/playwright_basics/01_open_page.py
```

### `02_persistent_context.py`

- 学会 `launch_persistent_context(user_data_dir=...)`
- 理解“浏览器用户目录”和“保留登录态”的关系
- 学会复用同一个 Playwright 浏览器资料目录

运行：

```bash
./.venv/bin/python learning/playwright_basics/02_persistent_context.py
```

### `03_wait_and_locate.py`

- 学会 `locator(...)`
- 学会 `get_by_role(...)`
- 学会等待元素出现后再读文本
- 学会先确认页面结构，再决定怎么定位

运行：

```bash
./.venv/bin/python learning/playwright_basics/03_wait_and_locate.py
```

### `04_listen_response.py`

- 学会 `page.on("response", ...)`
- 学会只关注你想看的接口 URL
- 学会打印 `response.status`、`response.url`
- 学会尝试 `response.json()` 看接口结构

运行：

```bash
./.venv/bin/python learning/playwright_basics/04_listen_response.py
```

### `05_download_video.py`

- 学会把 Playwright 监听到的接口 JSON 接到下载逻辑
- 学会把浏览器控制和文件下载拆成两段
- 学会把结果保存到 `learning/playwright_basics/output/`

运行：

```bash
./.venv/bin/python learning/playwright_basics/05_download_video.py
```

## 推荐你的手动练法

1. 先补 `01`，只做到“能打开页面”
2. 再补 `02`，只做到“能复用同一个用户目录”
3. 再补 `03`，只做到“能定位到一个稳定元素并打印文本”
4. 再补 `04`，只做到“能看到目标响应并打印部分 JSON”
5. 最后补 `05`，把一个真实视频链接下载到本地

## 练完后建议你对照这些内容

- [Douyin.py](/Users/wangshaoqing/Desktop/MiaoSi/Study/douyin-crawler-poc/Douyin.py)
- [learning/drissionpage_basics/03_listen_api.py](/Users/wangshaoqing/Desktop/MiaoSi/Study/douyin-crawler-poc/learning/drissionpage_basics/03_listen_api.py)
- [learning/drissionpage_basics/05_download_video.py](/Users/wangshaoqing/Desktop/MiaoSi/Study/douyin-crawler-poc/learning/drissionpage_basics/05_download_video.py)

你重点对照的是：

- `DrissionPage` 的附着方式和 `Playwright` 的持久化上下文有什么差别
- `page.listen.wait(...)` 和 `page.on("response", ...)` / `expect_response(...)` 的心智模型有什么差别
- 为什么下载文件时经常还是会回到 `requests`