# Приклади автоматизації (CDP)

Коли ваш агент створить профіль MoreLogin за допомогою навичок, він отримає `debugPort`. Цей порт можна використовувати для прямого підключення до екземпляра браузера за допомогою **CDP (Chrome DevTools Protocol)**, оминаючи потребу в WebDriver.

Ви можете наказати своєму агенту Hermes або OpenClaw писати та виконувати сценарії за такими шаблонами.

## 1. Підключення до Puppeteer

```javascript
// Get debugPort from:
// openclaw morelogin browser status --env-id <envId>
const puppeteer = require('puppeteer-core');

async function main() {
  const browser = await puppeteer.connect({
    browserURL: 'http://127.0.0.1:9222', // replace 9222 with actual debugPort
    defaultViewport: null
  });

  const pages = await browser.pages();
  const page = pages[0];
  await page.goto('https://example.com');
  
  // Scrape data or perform actions
  const title = await page.title();
  console.log('Title:', title);
  
  // NOTE: Do not call browser.close() unless you want to destroy the MoreLogin process
  await browser.disconnect();
}
main();
```

## 2. Заповніть і надішліть форму

```javascript
const puppeteer = require('puppeteer-core');

async function main() {
  const browser = await puppeteer.connect({
    browserURL: 'http://127.0.0.1:<debugPort>'
  });
  
  const page = await browser.newPage();
  await page.goto('https://example.com/login');
  
  // Fill form
  await page.type('#username', 'myuser');
  await page.type('#password', 'mypassword');
  
  // Click submit
  await page.click('button[type="submit"]');
  
  // Wait for navigation
  await page.waitForNavigation();
  
  // Verify login
  const isLoggedIn = await page.$('.user-profile');
  console.log('Login successful:', !!isLoggedIn);
  
  await browser.disconnect();
}
main();
```

## 3. Збирання даних

```javascript
const puppeteer = require('puppeteer-core');
const fs = require('fs');

async function main() {
  const browser = await puppeteer.connect({
    browserURL: 'http://127.0.0.1:<debugPort>'
  });
  
  const page = await browser.newPage();
  await page.goto('https://example.com/products');
  
  // Scrape data
  const products = await page.evaluate(() => {
    return Array.from(document.querySelectorAll('.product')).map(el => ({
      name: el.querySelector('.name')?.textContent,
      price: el.querySelector('.price')?.textContent,
      url: el.querySelector('a')?.href
    }));
  });
  
  // Save to file
  fs.writeFileSync('products.json', JSON.stringify(products, null, 2));
  console.log(`Scraped ${products.length} products`);
  
  await browser.disconnect();
}
main();
```

## 4. Операції з кількома вкладками

```javascript
const puppeteer = require('puppeteer-core');

async function main() {
  const browser = await puppeteer.connect({
    browserURL: 'http://127.0.0.1:<debugPort>'
  });
  
  // Open multiple tabs
  const page1 = await browser.newPage();
  const page2 = await browser.newPage();
  
  await page1.goto('https://example.com');
  await page2.goto('https://github.com');
  
  // Parallel operations
  await Promise.all([
    page1.screenshot({ path: 'page1.png' }),
    page2.screenshot({ path: 'page2.png' })
  ]);
  
  console.log('Screenshots completed');
  
  await browser.disconnect();
}
main();
```

## Усунення несправностей

- **Помилка: `connect ECONNREFUSED`**: переконайтеся, що профіль запущений і `debugPort` правильний. Ви можете перевірити порти за допомогою `lsof -i :<port>`.
- **Браузер аварійно завершує роботу під час з’єднання**: використовуйте `puppeteer-core` замість `puppeteer` і переконайтеся, що ви викликаєте `browser.disconnect()` замість `browser.close()`, коли ваш сценарій завершиться.