🧠 核心差異（一句話）

• user-data-dir 👉 整個瀏覽器 profile（像 Chrome 使用者）
• save-storage 👉 只存登入狀態（cookie + localStorage）

---

🔍 詳細比較

1️⃣ --user-data-dir

👉 使用「完整瀏覽器資料夾」

--user-data-dir=./user-data

會包含：

• cookies

• localStorage

• IndexedDB

• 登入狀態

• 瀏覽器設定（像：

  • extensions
  • theme
  • cache
  • history）

👉 等於：整個 Chrome profile clone ([Playwright][1])

特性

• ✅ 跟你平常用 Chrome 一樣
• ✅ 可以直接保持登入（GitHub / Google）
• ❌ 很肥（資料很多）
• ❌ 不好版本控制
• ❌ CI/CD 不好用

---

2️⃣ --save-storage

--save-storage=auth.json

只會存：

• cookies
• localStorage
• IndexedDB ([Playwright][1])

👉 存成一個 JSON：

auth.json

特性

• ✅ 很輕量
• ✅ 可 commit / 管理（通常不建議）
• ✅ 適合自動化測試
• ✅ CI/CD 友善
• ❌ 不包含瀏覽器設定

---

3️⃣ 搭配 --load-storage

--load-storage=auth.json

👉 直接「免登入」進入系統 ([Playwright][1])

---

⚔️ 實戰差異（超重要）

用途	user-data-dir	save-storage
手動錄製	✅ 很適合	⚠️ 普通
自動化測試	❌ 不推薦	✅ 最佳
CI/CD	❌	✅
多帳號切換	❌ 麻煩	✅ 很好
可攜性	❌	✅
大小	很大	很小

---

💡 你這個情境（看你的截圖）

你是在做： 👉 Playwright + GitHub settings / 自動化

👉 建議你：

✔ 如果只是「錄製 + debug」

👉 用 user-data-dir

npx playwright codegen --user-data-dir=./user-data

👉 因為：

• 不用一直登入 GitHub
• 很直覺

---

✔ 如果是「正式 automation / pipeline」

👉 用 save-storage

npx playwright codegen --save-storage=auth.json

之後：

--load-storage=auth.json

👉 這才是正統做法（官方推薦）

---

🚨 一個很多人會踩的坑

👉 user-data-dir ≠ 可移植登入

原因：

• Chrome 136 之後限制 profile 存取 ([Playwright][1])
• 不同機器會壞掉

👉 save-storage 才能跨環境用

---

🎯 總結（幫你記）

👉 如果你只記一件事：

• 🧪 測試 / CI 👉 用 save-storage
• 🧑‍💻 本地開發 👉 用 user-data-dir