@dyyz1993/agent-browser 0.9.2 → 0.11.1

package/skills/agent-browser/templates/network-intercept-crawl.sh

@@ -0,0 +1,256 @@
+#!/bin/bash
+# Network Interception Data Collection Template
+set -euo pipefail
+# Usage: ./network-intercept-crawl.sh <url> <output-dir> [max-scrolls]
+#
+# This script demonstrates how to capture API data using network interception.
+# It handles infinite scroll pages that load data via AJAX/fetch calls.
+#
+# Prerequisites:
+#   - agent-browser installed and in PATH
+#   - jq for JSON processing
+#
+# Environment Variables:
+#   SCROLL_CONTAINER - CSS selector for scroll container (default: auto-detect)
+#   SCROLL_DELAY     - Seconds to wait after scroll (default: 2)
+#   MAX_NO_NEW       - Stop after N scrolls with no new data (default: 3)
+#
+# Examples:
+#   ./network-intercept-crawl.sh https://example.com/feed ./output 20
+#   SCROLL_CONTAINER=".feed-list" ./network-intercept-crawl.sh https://example.com/products ./data
+
+set -e
+
+# Configuration
+TARGET_URL="${1:-https://example.com}"
+OUTPUT_DIR="${2:-./collected-data}"
+MAX_SCROLLS="${3:-20}"
+SCROLL_CONTAINER="${SCROLL_CONTAINER:-}"  # CSS selector for scroll container (empty = auto-detect)
+SCROLL_DELAY="${SCROLL_DELAY:-2}"          # Seconds to wait after scroll
+MAX_NO_NEW="${MAX_NO_NEW:-3}"              # Stop after N scrolls with no new data
+
+mkdir -p "$OUTPUT_DIR"
+
+echo "=========================================="
+echo "  Network Interception Data Collection"
+echo "=========================================="
+echo "  URL: $TARGET_URL"
+echo "  Output: $OUTPUT_DIR"
+echo "  Max scrolls: $MAX_SCROLLS"
+echo "=========================================="
+
+# Cleanup function
+cleanup() {
+    echo ""
+    echo "[Cleanup] Closing browser..."
+    agent-browser kill 2>/dev/null || true
+}
+trap cleanup EXIT
+
+# Step 1: Start fresh
+echo ""
+echo "[Step 1] Starting browser session..."
+agent-browser kill 2>/dev/null || true
+sleep 1
+
+# Step 2: Enable network interception
+echo "[Step 2] Enabling network request capture..."
+agent-browser network requests --capture-response
+
+# Step 3: Navigate to target page
+echo "[Step 3] Opening target URL..."
+agent-browser open "$TARGET_URL"
+agent-browser wait --load networkidle
+sleep 2
+
+# Step 4: Auto-detect scroll container if not specified
+if [ -z "$SCROLL_CONTAINER" ]; then
+    echo "[Step 4] Auto-detecting scroll container..."
+    DETECTED_CONTAINER=$(agent-browser eval --stdin <<'EOF'
+(() => {
+    // Check for common scroll container patterns
+    const selectors = [
+        '.simulation-area',
+        '.feed-container',
+        '.scroll-container',
+        '[class*="scroll"]',
+        '[class*="feed"]',
+        '[class*="list"]',
+        '.content',
+        'main'
+    ];
+
+    for (const sel of selectors) {
+        const el = document.querySelector(sel);
+        if (el && el.scrollHeight > el.clientHeight) {
+            return sel;
+        }
+    }
+    return '';  // Use window scroll
+})()
+EOF
+)
+    # Extract container from JSON response
+    SCROLL_CONTAINER=$(echo "$DETECTED_CONTAINER" | jq -r '.' 2>/dev/null || echo "")
+
+    if [ -n "$SCROLL_CONTAINER" ] && [ "$SCROLL_CONTAINER" != "null" ] && [ "$SCROLL_CONTAINER" != "" ]; then
+        echo "  Detected container: $SCROLL_CONTAINER"
+    else
+        echo "  No container detected, using window scroll"
+        SCROLL_CONTAINER=""
+    fi
+else
+    echo "[Step 4] Using specified container: $SCROLL_CONTAINER"
+fi
+
+# Step 5: Extract initial data
+echo "[Step 5] Extracting initial captured requests..."
+
+# Function to get all captured requests
+get_all_requests() {
+    agent-browser network requests --capture-response --type json --json 2>/dev/null
+}
+
+# Function to count requests with response bodies
+count_valid_requests() {
+    local json_data="$1"
+    echo "$json_data" | jq '.data.requests | map(select(.responseBody != null)) | length' 2>/dev/null || echo "0"
+}
+
+# Function to count unique IDs in data
+count_unique_ids() {
+    local json_data="$1"
+    local id_field="${2:-id}"
+    echo "$json_data" | jq -c "[.data.requests[].responseBody | select(. != null) | .[]?.${id_field}] | unique | length" 2>/dev/null || echo "0"
+}
+
+# Initialize tracking - cumulative approach (no clearing!)
+ALL_DATA_FILE="$OUTPUT_DIR/all-captures.json"
+PROCESSED_COUNT=0  # Track how many requests we've already processed
+
+# Get initial data
+get_all_requests > "$ALL_DATA_FILE"
+TOTAL_REQUESTS=$(count_valid_requests "$(cat "$ALL_DATA_FILE")")
+INITIAL_IDS=$(count_unique_ids "$(cat "$ALL_DATA_FILE")")
+PROCESSED_COUNT=$TOTAL_REQUESTS
+
+echo "  Initial capture: $TOTAL_REQUESTS requests, ~$INITIAL_IDS unique items"
+echo "  Using cumulative mode (no data loss from clearing)"
+
+# Step 6: Scroll to load more data
+echo ""
+echo "[Step 6] Scrolling to load more data..."
+
+NO_NEW_COUNT=0
+SCROLL_COUNT=0
+
+while [ $SCROLL_COUNT -lt $MAX_SCROLLS ]; do
+    SCROLL_COUNT=$((SCROLL_COUNT + 1))
+
+    # Perform scroll
+    if [ -n "$SCROLL_CONTAINER" ]; then
+        # Scroll within specific container
+        agent-browser eval --stdin <<EOF
+(() => {
+    const container = document.querySelector('$SCROLL_CONTAINER');
+    if (container) {
+        container.scrollTop = container.scrollHeight;
+        return { scrolled: true, scrollTop: container.scrollTop };
+    }
+    return { scrolled: false, error: 'Container not found' };
+})()
+EOF
+    else
+        # Scroll the page
+        agent-browser scroll down 1000
+    fi
+
+    # Wait for new requests
+    sleep "$SCROLL_DELAY"
+
+    # Get ALL requests (cumulative, no clearing!)
+    get_all_requests > "$ALL_DATA_FILE"
+
+    # Count total requests now
+    NEW_TOTAL=$(count_valid_requests "$(cat "$ALL_DATA_FILE")")
+
+    # Calculate how many new requests we got (offset from last processed)
+    NEW_COUNT=$((NEW_TOTAL - PROCESSED_COUNT))
+
+    if [ "$NEW_COUNT" -le 0 ]; then
+        echo "  Scroll $SCROLL_COUNT: No new requests captured (total: $NEW_TOTAL)"
+        NO_NEW_COUNT=$((NO_NEW_COUNT + 1))
+
+        if [ $NO_NEW_COUNT -ge $MAX_NO_NEW ]; then
+            echo ""
+            echo "  [Stop] Consecutive $MAX_NO_NEW scrolls with no new data"
+            break
+        fi
+    else
+        echo "  Scroll $SCROLL_COUNT: Captured $NEW_COUNT new requests (total: $NEW_TOTAL)"
+
+        # Extract only NEW requests using offset
+        if [ $PROCESSED_COUNT -gt 0 ]; then
+            jq ".data.requests[$PROCESSED_COUNT:]" "$ALL_DATA_FILE" > "$OUTPUT_DIR/scroll-${SCROLL_COUNT}-new.json" 2>/dev/null || true
+        else
+            jq '.data.requests' "$ALL_DATA_FILE" > "$OUTPUT_DIR/scroll-${SCROLL_COUNT}-new.json" 2>/dev/null || true
+        fi
+
+        # Update processed count
+        PROCESSED_COUNT=$NEW_TOTAL
+        NO_NEW_COUNT=0
+    fi
+done
+
+# Step 7: Extract and save final data
+echo ""
+echo "[Step 7] Processing collected data..."
+
+# Extract response bodies from all captured requests
+OUTPUT_DATA="$OUTPUT_DIR/collected-data.json"
+jq '
+    .data.requests |
+    map(select(.responseBody != null)) |
+    map({
+        url: .url,
+        method: .method,
+        status: .status,
+        contentType: .contentType,
+        timestamp: .timestamp,
+        data: .responseBody
+    })
+' "$ALL_DATA_FILE" > "$OUTPUT_DATA" 2>/dev/null || echo "[]" > "$OUTPUT_DATA"
+
+TOTAL_ITEMS=$(jq 'map(select(.data != null and .data != [])) | length' "$OUTPUT_DATA")
+UNIQUE_IDS=$(count_unique_ids "$(cat "$ALL_DATA_FILE")")
+
+echo "  Total API responses captured: $TOTAL_ITEMS"
+echo "  Unique items identified: $UNIQUE_IDS"
+
+# Save summary
+SUMMARY_FILE="$OUTPUT_DIR/summary.json"
+jq -n "
+{
+    collectedAt: \"$(date -Iseconds)\",
+    targetUrl: \"$TARGET_URL\",
+    scrollContainer: \"$SCROLL_CONTAINER\",
+    totalScrolls: $SCROLL_COUNT,
+    totalRequests: $TOTAL_ITEMS,
+    uniqueItems: $UNIQUE_IDS,
+    mode: \"cumulative-no-clear\",
+    outputFiles: [
+        \"collected-data.json\",
+        \"all-captures.json\"
+    ]
+}
+" > "$SUMMARY_FILE"
+
+echo ""
+echo "=========================================="
+echo "  Collection Complete"
+echo "=========================================="
+echo "  Output directory: $OUTPUT_DIR"
+echo "  Total responses: $TOTAL_ITEMS"
+echo "  Files created:"
+ls -la "$OUTPUT_DIR"
+echo "=========================================="

package/skills/agent-browser/templates/recorder-workflow.sh

@@ -0,0 +1,51 @@
+#!/usr/bin/env bash
+# Template: Recorder Workflow
+# Purpose: Record browser actions, save as YAML, replay later
+# Usage: ./recorder-workflow.sh [url] [output.yaml]
+#
+# Records your interactions into a replayable YAML workflow file.
+# Useful for test automation, demo creation, and regression testing.
+
+set -euo pipefail
+
+URL="${1:?https://example.com/form}"
+OUTPUT="${2:-recording-$(date +%Y%m%d-%H%M%S).yaml}"
+SESSION="record-$(date +%s)"
+
+echo "=== Recorder Workflow: $URL ==="
+
+# Step 1: Start recording
+agent-browser recorder start --session "$SESSION"
+echo "Recording started on session: $SESSION"
+
+# Step 2: Navigate and perform workflow
+agent-browser --session "$SESSION" open "$URL"
+agent-browser --session "$SESSION" wait --load networkidle
+
+echo ""
+echo "Form structure (copy refs from below):"
+agent-browser --session "$SESSION" snapshot -i
+
+# Step 3: Perform your actions here (uncomment/customize):
+#
+# agent-browser --session "$SESSION" fill @e1 "user@example.com"
+# agent-browser --session "$SESSION" fill @e2 "password123"
+# agent-browser --session "$SESSION" click @e3
+# agent-browser --session "$SESSION" wait --load networkidle
+# agent-browser --session "$SESSION" snapshot -i  # Verify
+
+echo ""
+echo "Waiting ${TIMEOUT:-10}s before stopping recording..."
+sleep "${TIMEOUT:-10}"
+
+# Step 4: Stop recording and save
+agent-browser recorder stop --session "$SESSION" --output "$OUTPUT"
+echo ""
+echo "Saved recording to: $OUTPUT"
+echo ""
+echo "To replay:"
+echo "  agent-browser recorder replay $OUTPUT"
+
+# Cleanup
+agent-browser --session "$SESSION" close
+echo "Done"

package/skills/agent-browser/templates/viewer-remote.sh

@@ -0,0 +1,41 @@
+#!/usr/bin/env bash
+# Template: Viewer Remote Control Workflow
+# Purpose: Open browser, start viewer, interact remotely via streaming UI
+# Usage: ./viewer-remote.sh [url] [timeout-seconds]
+#
+# The viewer streams real-time browser frames to your local browser.
+# On touch devices, you get touchpad + input panel for mobile control.
+
+set -euo pipefail
+
+URL="${1:?https://www.baidu.com}"
+TIMEOUT="${2:-300}"
+SESSION="viewer-$(date +%s)"
+
+echo "=== Viewer Remote Control: $URL ==="
+
+# Step 1: Launch browser (headed so you can see it locally too)
+agent-browser --session "$SESSION" --headed open "$URL"
+agent-browser --session "$SESSION" wait --load networkidle
+
+# Step 2: Start viewer and get connection URL
+VIEWER_INFO=$(agent-browser --session "$SESSION" viewer --json)
+echo "Viewer info: $VIEWER_INFO"
+
+# Extract URL (requires jq)
+VIEWER_URL=$(echo "$VIEWER_INFO" | jq -r '.url // 2>/dev/null || echo "Check port 5005 manually")
+echo ""
+echo "Open this URL in your browser:"
+echo "  $VIEWER_URL"
+echo ""
+echo "Tips:"
+echo "  - Desktop: Click/drag/scroll on the streamed screen area"
+echo "  - Mobile: Use touchpad at bottom for cursor, tap inputs for text panel"
+echo "  - Tap a remote input field to open mobile text input"
+echo ""
+echo "Viewer will auto-close after ${TIMEOUT}s..."
+sleep "$TIMEOUT"
+
+# Cleanup
+agent-browser --session "$SESSION" close
+echo "Done"

package/dist/__tests__/test-iframe.d.ts

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=test-iframe.d.ts.map

package/dist/__tests__/test-iframe.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"test-iframe.d.ts","sourceRoot":"","sources":["../../src/__tests__/test-iframe.ts"],"names":[],"mappings":""}

package/dist/__tests__/test-iframe.js

@@ -1,52 +0,0 @@
-import { chromium } from 'playwright-core';
-async function test() {
-    const browser = await chromium.launch({ headless: true });
-    const context = await browser.newContext();
-    const page = await context.newPage();
-    // Listen for frame navigated events
-    page.on('framenavigated', (frame) => {
-        console.log('Frame navigated:', frame.url());
-    });
-    // Listen for console events
-    page.on('console', (msg) => {
-        console.log('Console:', msg.type(), msg.text());
-    });
-    // Listen for page errors
-    page.on('pageerror', (error) => {
-        console.log('Page error:', error.message);
-    });
-    // Listen for request failed
-    page.on('requestfailed', (request) => {
-        console.log('Request failed:', request.url(), request.failure()?.errorText);
-    });
-    await page.goto('https://www.example.com');
-    // Check CSP headers
-    const response = await page.evaluate(() => {
-        return {
-            csp: document.querySelector('meta[http-equiv="Content-Security-Policy"]')?.getAttribute('content'),
-            xFrameOptions: document.querySelector('meta[http-equiv="X-Frame-Options"]')?.getAttribute('content'),
-        };
-    });
-    console.log('CSP info:', response);
-    // Create iframe using DOM methods
-    await page.evaluate(() => {
-        const iframe = document.createElement('iframe');
-        iframe.id = 'cross-frame';
-        iframe.src = 'https://www.iana.org/domains/example';
-        iframe.width = '800';
-        iframe.height = '400';
-        document.body.appendChild(iframe);
-    });
-    // Wait for frame to be attached
-    await page.waitForSelector('#cross-frame');
-    // Wait longer
-    await page.waitForTimeout(5000);
-    // Check all frames
-    console.log('\n=== All frames ===');
-    const mainFrame = page.mainFrame();
-    console.log('Main frame URL:', mainFrame.url());
-    console.log('Child frames:', mainFrame.childFrames().map(f => ({ url: f.url(), name: f.name() })));
-    await browser.close();
-}
-test().catch(console.error);
-//# sourceMappingURL=test-iframe.js.map

package/dist/__tests__/test-iframe.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"test-iframe.js","sourceRoot":"","sources":["../../src/__tests__/test-iframe.ts"],"names":[],"mappings":"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"}

package/dist/cli-new.d.ts

@@ -1,3 +0,0 @@
-#!/usr/bin/env npx tsx
-export {};
-//# sourceMappingURL=cli-new.d.ts.map

package/dist/cli-new.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"cli-new.d.ts","sourceRoot":"","sources":["../src/cli-new.ts"],"names":[],"mappings":""}