### Initialize and use pear3 browser

Source: https://developerkubilay.github.io/pear3

A basic example demonstrating how to launch a browser instance, navigate to a URL, perform input actions, and capture a screenshot.

```javascript
const Pear = require("pear3");

async function main() {
  const browser = await Pear({
    viewport: { width: 1280, height: 800 },
    headless: false
  });

  const page = await browser.newPage();
  await page.goto("https://google.com");
  
  await page.directType('textarea', 'Hello Pear!');
  await page.keypress('Enter');
  
  const screenshot = await page.screenshot();
  
  await browser.close();
}

main().catch(console.error);
```

--------------------------------

### Install pear3 via npm

Source: https://developerkubilay.github.io/pear3

The standard command to install the pear3 library into a Node.js project.

```bash
npm install pear3
```

--------------------------------

### Browser Initialization

Source: https://developerkubilay.github.io/pear3

Initialize a new pear3 browser instance with custom configuration options.

```APIDOC
## POST /browser/initialize

### Description
Initializes a new browser instance using the pear3 constructor. This sets up the WebSocket connection and launches the browser process.

### Method
POST

### Parameters
#### Request Body
- **browserPath** (string) - Optional - Custom Chrome executable path
- **profileDir** (string) - Optional - Chrome user data directory
- **args** (array) - Optional - Additional Chrome arguments
- **userAgent** (string) - Optional - Custom user agent string
- **viewport** (object) - Optional - Viewport dimensions {width, height}
- **headless** (boolean) - Optional - Run in headless mode
- **proxy** (string) - Optional - Proxy server URL
- **endpoint** (string) - Optional - WebSocket host
- **port** (number) - Optional - WebSocket port

### Request Example
{
  "headless": false,
  "viewport": { "width": 1280, "height": 800 },
  "port": 8191
}

### Response
#### Success Response (200)
- **browser** (object) - Browser instance object

#### Response Example
{
  "status": "connected",
  "browserId": "uuid-12345"
}
```

--------------------------------

### Configure pear3 browser options

Source: https://developerkubilay.github.io/pear3

Demonstrates the various configuration parameters available during browser initialization, including custom paths, proxy settings, and WebSocket endpoints.

```javascript
const browser = await Pear({
  browserPath: "/path/to/chrome",
  profileDir: "./chrome-profile",
  args: ["--disable-gpu"],
  userAgent: "Custom User Agent",
  viewport: { width: 1280, height: 720 },
  incognito: false,
  headless: false,
  disableGpu: false,
  nosandbox: false,
  proxy: "http://proxy:8080",
  muteaudio: false,
  cookies: cookieArray,
  endpoint: "http://localhost",
  port: 8191
});
```

--------------------------------

### Keyboard Interaction API

Source: https://developerkubilay.github.io/pear3

Simulate keyboard events including keypress, keydown, and keyup actions.

```APIDOC
## POST /page/keyboard

### Description
Simulates keyboard events on the active page or specific elements.

### Parameters
#### Request Body
- **key** (string) - Required - The key to press (e.g., 'Enter', 'a')
- **selector** (string) - Optional - Target element selector
- **options** (object) - Optional - Modifier keys (ctrlKey, shiftKey, altKey)

### Request Example
{
  "key": "a",
  "selector": "#input",
  "options": { "ctrlKey": true }
}

### Response
#### Success Response (200)
- **status** (string) - "success"
```

--------------------------------

### Multi-tab Management with Pear3.js

Source: https://developerkubilay.github.io/pear3

Illustrates how to manage multiple browser tabs simultaneously using Pear3.js. This includes opening new tabs, navigating them concurrently, taking screenshots, closing specific tabs, and continuing operations on remaining tabs.

```javascript
const Pear = require("pear3");

async function multiTabExample() {
  const browser = await Pear();
  
  const page1 = await browser.newPage();
  const page2 = await browser.newPage();
  const page3 = await browser.newPage();
  
  await Promise.all([
    page1.goto("https://site1.com"),
    page2.goto("https://site2.com"),
    page3.goto("https://site3.com")
  ]);
  
  const screenshots = await Promise.all([
    page1.screenshot(),
    page2.screenshot(),
    page3.screenshot()
  ]);
  
  const fs = require('fs');
  screenshots.forEach((screenshot, index) => {
    fs.writeFileSync(`tab-${index + 1}.png`, screenshot);
  });
  
  await page2.close();
  await page3.close();
  
  await page1.type('#search', 'final search');
  
  await browser.close();
}

multiTabExample().catch(console.error);
```

--------------------------------

### Perform Mouse Interactions with Pear3

Source: https://developerkubilay.github.io/pear3

Demonstrates various mouse event simulations including clicks, movement, and scrolling. These methods allow for precise interaction with page elements using selectors and optional coordinates.

```javascript
// Click types
await page.leftclick('#button');        // Left click
await page.rightclick('#menu-trigger');  // Right click (context menu)
await page.middleclick('#link');         // Middle click (new tab)
await page.dblclick('#file');            // Double click

// Mouse actions
await page.mousedown('#draggable');      // Mouse down
await page.mouseup('#draggable');        // Mouse up
await page.mousemove('#target');         // Move mouse to element

// With custom coordinates
await page.leftclick('#element', { x: 10, y: 20 });

// Scroll actions
await page.scroll(null, { x: 0, y: 500 });  // Scroll window
await page.scroll('#container', { y: -200 }); // Scroll element up
```

--------------------------------

### Execute Text Input Methods

Source: https://developerkubilay.github.io/pear3

Shows two approaches for inputting text: type() for realistic keyboard event simulation and directType() for high-performance bulk entry.

```javascript
// Realistic typing
await page.type('#username', 'john_doe');

// Fast direct assignment
await page.directType('#message', 'This is a long message...');
```

--------------------------------

### Page Navigation API

Source: https://developerkubilay.github.io/pear3

Methods for navigating and interacting with web pages within the browser instance.

```APIDOC
## GET /page/navigation

### Description
Methods to control page navigation and retrieve page state.

### Methods
- **goto(url)**: Navigate to a URL
- **url()**: Get current URL
- **reload()**: Reload current page
- **content()**: Get page HTML
- **close()**: Close page

### Request Example
await page.goto("https://example.com");

### Response
#### Success Response (200)
- **content** (string) - HTML content of the page
```

--------------------------------

### Capture Screenshots and Upload Files

Source: https://developerkubilay.github.io/pear3

Utilities for capturing page visual state as a buffer and uploading files to input elements.

```javascript
const screenshotBuffer = await page.screenshot();
const fs = require('fs');
fs.writeFileSync('screenshot.png', screenshotBuffer);

await page.uploadFile('#file-input', 'https://example.com/image.jpg');
```

--------------------------------

### Web Scraping with Mouse Interactions using Pear3.js

Source: https://developerkubilay.github.io/pear3

Demonstrates web scraping techniques involving mouse interactions like hovering, right-clicking, and scrolling to reveal or interact with dynamic content. Uses 'pear3' and can run in non-headless mode.

```javascript
const Pear = require("pear3");

async function scrapeWithInteraction() {
  const browser = await Pear({ headless: false });
  const page = await browser.newPage();
  
  await page.goto("https://example-spa.com");
  
  await page.waitForSelector('.content-loaded');
  
  await page.mousemove('.menu-trigger');
  await page.waitForSelector('.dropdown-menu');
  
  await page.rightclick('.data-item');
  await page.leftclick('.context-export');
  
  for (let i = 0; i < 5; i++) {
    await page.scroll(null, { y: 500 });
    await page.waitForSelector(`.item-${i + 6}`, { timeout: 2000 });
  }
  
  const content = await page.content();
  // Process content...
  
  await browser.close();
}

scrapeWithInteraction().catch(console.error);
```

--------------------------------

### Configure custom WebSocket endpoint

Source: https://developerkubilay.github.io/pear3

Shows how to connect pear3 to a remote or custom WebSocket server by specifying host and port.

```javascript
const browser = await Pear({
  endpoint: "http://192.168.1.100",
  port: 9000
});
```

--------------------------------

### Simulate keyboard interactions

Source: https://developerkubilay.github.io/pear3

Methods for simulating keyboard events such as key presses, holding keys down, and releasing keys, with support for target elements and modifier keys.

```javascript
await page.keypress('Enter');
await page.keydown('Shift');
await page.keyup('Shift');
await page.keypress('a', '#input', { 
  ctrlKey: true,
  shiftKey: false 
});
```

--------------------------------

### Configure WebSocket Connection

Source: https://developerkubilay.github.io/pear3

Sets up the connection between the Node.js application and the browser extension using default or custom host and port configurations.

```javascript
// Default configuration
const browser = await Pear();

// Custom endpoint
const browser = await Pear({
  endpoint: "http://192.168.1.100",
  port: 9000
});
```

--------------------------------

### Form Automation with Pear3.js

Source: https://developerkubilay.github.io/pear3

Automates filling out a web form, including typing text, selecting dropdown options, uploading files, and submitting the form. Uses 'pear3' and handles form submissions with confirmation waits.

```javascript
const Pear = require("pear3");

async function fillForm() {
  const browser = await Pear();
  const page = await browser.newPage();
  
  await page.goto("https://example.com/contact-form");
  
  await page.type('#name', 'John Doe');
  await page.type('#email', 'john@example.com');
  await page.directType('#message', `
    This is a longer message that I'm typing
    into the contact form using directType
    for better performance.
  `);
  
  await page.leftclick('#country');
  await page.waitForSelector('#country option[value="US"]');
  await page.leftclick('#country option[value="US"]');
  
  await page.uploadFile('#attachment', 'https://example.com/document.pdf');
  
  await page.leftclick('#submit-button');
  
  await page.waitForSelector('.success-message');
  console.log('Form submitted successfully!');
  
  await browser.close();
}

fillForm().catch(console.error);
```

--------------------------------

### Google Search Automation with Pear3.js

Source: https://developerkubilay.github.io/pear3

Automates a Google search by navigating to Google, typing a query into the search box, and taking a screenshot of the results. Requires the 'pear3' module.

```javascript
const Pear = require("pear3");

async function googleSearch() {
  const browser = await Pear({
    viewport: { width: 1280, height: 800 }
  });

  const page = await browser.newPage();
  await page.goto("https://google.com");
  
  await page.waitForSelector('textarea[name="q"]');
  await page.type('textarea[name="q"]', 'pear browser automation');
  await page.keypress('Enter');
  
  await page.waitForSelector('#search');
  const screenshot = await page.screenshot();
  
  require('fs').writeFileSync('search-results.png', screenshot);
  console.log('Search completed and screenshot saved!');
  
  await browser.close();
}

googleSearch().catch(console.error);
```

--------------------------------

### Perform page navigation and content retrieval

Source: https://developerkubilay.github.io/pear3

Common methods for interacting with a page, including navigation, URL retrieval, reloading, and fetching HTML content.

```javascript
await page.goto("https://example.com");
const currentUrl = await page.url();
await page.reload();
const html = await page.content();
await page.close();
await page.setTimeout(2000);
```

--------------------------------

### Interact with Page Elements

Source: https://developerkubilay.github.io/pear3

Standard methods for clicking elements, retrieving attributes, and extracting text content from the DOM.

```javascript
await page.click('#submit-btn');
const href = await page.getAttribute('a#main-link', 'href');
const buttonText = await page.getText('#submit-btn');
```

--------------------------------

### Wait for Element Selector with Options

Source: https://developerkubilay.github.io/pear3

Waits for a specified element to appear in the DOM. Supports custom timeouts and check intervals for flexible waiting strategies. A timeout of 0 waits indefinitely.

```javascript
await page.waitForSelector('.loading-complete');

await page.waitForSelector('#dynamic-content', {
  timeout: 10000,
  checkInterval: 200
});

await page.waitForSelector('.element', { timeout: 0 });
```

--------------------------------

### Access Shadow DOM Elements

Source: https://developerkubilay.github.io/pear3

Specialized methods to query, click, and retrieve attributes from elements encapsulated within Shadow DOM roots.

```javascript
await page.shadowClick('#shadow-host', 'button.submit-btn');
const elementInfo = await page.shadowQuerySelector('#shadow-host', '.shadow-button');
const href = await page.shadowGetAttribute('#shadow-host', 'a.shadow-link', 'href');
```

--------------------------------

### Evaluate JavaScript in Page Context

Source: https://developerkubilay.github.io/pear3

Executes custom JavaScript functions within the browser page context, supporting arguments and complex return objects.

```javascript
const title = await page.evaluate(() => document.title);
const result = await page.evaluate((a, b) => a + b, [5, 10]);
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.