⏳ This skill is pending AI review.
Scores will appear once the review pipeline completes.
ccf-playwright-browser
Stealth browser automation using Playwright with snapshot-based environment restoration. Use when browser automation needs anti-bot evasion, snapshot or cookie restoration, proxy support, or human-like navigation behavior.
Choose how to use this skill
You do not need every option. Choose the path your AI client supports. The stable page stays the same; versioned files are immutable.
1. Native installer
This listing has no registered native installer command. Use the complete package or source fallback below, depending on what your client supports.
Do not guess an installer command or replace an existing version without reviewing the diff.
2. Complete package recommended
Download the ZIP when available. It includes SKILL.md plus the references, security notes and version metadata.
No complete ProSkills package is published for this listing yet.3. Prompt-only
Copy the prompt above when the agent can read the stable page or when you want to adopt the workflow without installing a skill.
Need only the instruction file?
Download SKILL.md only if your client requires a single file. The complete ZIP is safer for a full installation because it preserves the references and release context.
No path installs or executes anything by itself. Your agent still needs access to the project files. Before updating, compare the installed version and review the diff.
// RATINGS
Not yet listed on ClawHub or SkillsMP
// README
🎭 ccf-playwright-browser
🚀 Playwright AI skills combined with a Chrome extension for seamless browser automation with real user sessions
English | 🌐 中文
✨ Features
| Feature | Description |
|---|---|
| 🔐 Session Injection | Easily inject your own login sessions for OpenClaw automation |
| 🛡️ Anti-Detection | Bypass browser detection with advanced stealth techniques |
| 🍪 Cookie Extraction | Capture all cookies including HttpOnly cookies |
| 🌐 Environment Mimicry | Replicate real browser environment (UA, locale, timezone, screen size) |
| 📦 One-Click Export | Chrome extension for instant session extraction |
📁 Project Structure
ccf-playwright-browser/
├── 📂 chrome-extension/ # Chrome extension for session extraction
│ ├── manifest.json # Extension manifest
│ ├── popup.html # Extension popup UI
│ ├── popup.js # Popup logic
│ ├── background.js # Service worker for data collection
│ └── README.md # Extension documentation
├── 📂 scripts/ # Playwright automation scripts
│ ├── init_browser.js # Browser initialization with stealth
│ └── snapshot.json # Sample snapshot file
├── LICENSE # MIT License
└── README.md # This file
🚀 Quick Start
1️⃣ Install Chrome Extension
- Open Chrome and navigate to
chrome://extensions - Enable "Developer mode" in the top right corner
- Click "Load unpacked" and select the
chrome-extensiondirectory - The extension icon will appear in your toolbar ✅
2️⃣ Extract Login State
- Navigate to any website you want to extract login state from
- Log in to your account (if required) 🔐
- Click the extension icon in the toolbar
- Click "Extract Login State" to collect:
- 🍪 Cookies (including HttpOnly)
- 🌍 Browser environment
- 📋 Request headers
- 💾 Storage data
- Click "Copy to Clipboard" 📋
3️⃣ Use with Playwright
// Save the copied JSON to snapshot.json
// Then run the initialization script
node scripts/init_browser.js scripts/snapshot.json
💡 Usage Example
After copying the JSON data from the extension, use it like this:
请使用下面的 browser snapshot 启用 ccf-playwright-browser，
并加载 cookies、headers、storage 和浏览器环境。
然后打开网页 `https://<your-website-url>/`，3秒后截图：
<copied json data>
🔧 Technical Details
🛡️ Stealth Features
The init_browser.js script includes advanced anti-detection measures:
- ✅ Removes
navigator.webdriverflag - ✅ Masks automation indicators
- ✅ Spoofs WebGL renderer info
- ✅ Randomizes canvas fingerprint
- ✅ Modifies audio context
- ✅ Custom permission queries
- ✅ Font checking bypass
🍪 Cookie Handling
- Automatically normalizes cookie expiration timestamps
- Supports all cookie attributes (Secure, HttpOnly, SameSite)
- Handles oversized values gracefully
🌐 Environment Capture
| Data Type | Captured Info |
|---|---|
| Navigator | User-Agent, Platform, Language, Hardware specs |
| Screen | Width, Height, Color depth, Available space |
| Intl | Locale, Timezone, Number format |
| Storage | localStorage, sessionStorage |
| Headers | Observed request headers |
📋 Requirements
- 🟢 Node.js 16+
- 🟢 Playwright
- 🟢 Chrome Browser (for extension)
📦 Installation
# Clone the repository
git clone https://github.com/yourusername/ccf-playwright-browser.git
# Install Playwright
npm install playwright
# Install Playwright browsers
npx playwright install chromium
🤝 Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
📄 License
This project is licensed under the MIT License - see the LICENSE file for details.
🙏 Acknowledgments
- Playwright - Web testing and automation framework
- Chrome Extensions API - For browser data access
⭐ Star this repo if you find it helpful! ⭐
Made with ❤️ for the automation community
// HOW IT'S BUILT
KEY FILES