Add option endpointURL for debug with playwright

README.md

@@ -130,6 +130,34 @@ await agent.closeAgent();
 
 ## Usage Guide
 
+### Config Browser with playwright endpointURL
+
+- **`endpointURL`**: A CDP WebSocket endpoint or HTTP URL to connect to. For example, `http://localhost:9222/` or `ws://127.0.0.1:9222/devtools/browser/387adf4c-243f-4051-a181-46798f4a46f4`.
+- **`slowMo`**: Slows down operations by the specified number of milliseconds for debugging purposes.
+- **`args`**: An array of custom arguments to pass to the browser instance.
+
+These options provide flexibility for connecting to remote browsers or customizing the browser's behavior during automation.
+
+```typescript
+import { HyperAgent } from "@hyperbrowser/agent";
+
+const agent = new HyperAgent({
+  options: {
+    endpointURL: "ws://localhost:3000", // or http://localhost:9222 Connect to a remote browser
+    slowMo: 50, // Slow down operations for debugging
+  },
+});
+
+// Use the agent as usual
+const result = await agent.executeTask(
+  "Navigate to example.com and extract the page title"
+);
+console.log(result.output);
+
+// Clean up
+await agent.closeAgent();
+```
+
 ### Multi-Page Management
 
 ```typescript

src/agent/index.ts

@@ -104,7 +104,8 @@ export class HyperAgent<T extends BrowserProviders = "Local"> {
   public async initBrowser(): Promise<Browser> {
     if (!this.browser) {
       this.browser = await this.browserProvider.start();
-      this.context = await this.browser.newContext({
+      const defaltContext =  this.browser.contexts().at(0)
+      this.context = defaltContext || await this.browser.newContext({
         viewport: null,
       });
 

src/browser-providers/local.ts

@@ -1,15 +1,23 @@
-import { chromium, Browser, LaunchOptions } from "playwright";
+import { chromium, Browser, LaunchOptions, ConnectOptions } from "playwright";
 import BrowserProvider from "@/types/browser-providers/types";
 
 export class LocalBrowserProvider extends BrowserProvider<Browser> {
-  options: Omit<Omit<LaunchOptions, "headless">, "channel"> | undefined;
+  options: (Omit<Omit<LaunchOptions, "headless">, "channel"> & { endpointURL?: string,args? : []}) | ConnectOptions  & { endpointURL?: string,args? : []} | undefined;
   session: Browser | undefined;
-  constructor(options?: Omit<Omit<LaunchOptions, "headless">, "channel">) {
+  constructor(options?: Omit<Omit<LaunchOptions, "headless">, "channel"> & { endpointURL?: string,args? : []}) {
     super();
     this.options = options;
   }
   async start(): Promise<Browser> {
-    const launchArgs = this.options?.args ?? [];
+
+    if (this.options && 'endpointURL' in this.options && this.options.endpointURL) {
+      const browser = await chromium.connectOverCDP(this.options.endpointURL,{
+        ...this.options
+      });
+      this.session = browser;
+      return this.session;
+    }
+    const launchArgs = this.options?.args || [];
     const browser = await chromium.launch({
       ...(this.options ?? {}),
       channel: "chrome",