Browser Automation

const result = await morph.browser.execute({
  task: "Test the login flow with test@example.com / password123",
  url: "https://myapp.vercel.app"
});

if (result.success) {
  console.log('✅ Test passed');
} else {
  console.error('❌ Test failed:', result.error);
  console.log('Failed at:', result.urls[result.urls.length - 1]);
}

// Returns in ~2s with live URL
const task = await morph.browser.createTask({
  task: "Test checkout flow with cart persistence",
  url: "https://shop.example.com"
});

console.log('👁️  Watch live:', task.debugUrl);
// Open URL in browser to watch from start

// Wait for completion
const result = await task.complete();

const result = await morph.browser.execute({
  task: "Resize to mobile (375x667) and verify the hamburger menu appears",
  url: "https://myapp.com"
});

const result = await morph.browser.execute({
  task: "Log in with x_user and x_pass, then verify the dashboard loads",
  url: "https://myapp.com/login",
  auth: {
    username: "test@example.com",
    password: "secret123"
  }
});

const repos = await morph.browser.profiles.listRepos();
// Pick by full name
const repo = repos.find(r => r.repoFullName === 'owner/repo');
if (!repo) throw new Error('Repo not found');

const setup = await morph.browser.profiles.createProfile({
  name: 'Staging',
  repoId: repo.repoId
});

console.log('Open to sign in:', setup.session.debugUrl);
// User signs in, then persist the state:
await setup.save();

console.log('Profile ID:', setup.profile.id);

const result = await morph.browser.execute({
  task: "Go to the dashboard and verify it loads",
  url: "https://staging.myapp.com",
  profileId: setup.profile.id
});

const edit = await morph.browser.profiles.updateProfile(setup.profile.id);
console.log('Open to sign in:', edit.session.debugUrl);
await edit.save();

const profiles = await morph.browser.profiles.listProfiles(repo.repoId);
await morph.browser.profiles.deleteProfile(profiles[0].id);

const result = await morph.browser.execute({
  task: "Complete the checkout flow",
  url: "https://shop.example.com",
  recordVideo: true,
  maxSteps: 20
});

if (!result.success && result.recordingId) {
  const rec = await morph.browser.getRecording(result.recordingId);
  console.log('📹 Video:', rec.videoUrl);
  console.log('🌐 Network:', rec.networkUrl);
  console.log('📊 Console:', rec.consoleUrl);
}

const result = await morph.browser.execute({
  task: "Verify homepage loads correctly",
  url: process.env.PREVIEW_URL,
  externalId: process.env.GITHUB_PR_NUMBER,
  repoFullName: process.env.GITHUB_REPOSITORY, // "owner/repo"
  commitId: process.env.GITHUB_SHA,
  recordVideo: true
});

// Link results back to your PR/build system

const task = await morph.browser.createTask({
  task: "Test the payment flow",
  url: "https://myapp.com"
});

// Available immediately (~2s)
console.log('Watch live:', task.debugUrl);
// Share with team, embed in dashboard, or monitor yourself

const result = await task.complete();

const task = await morph.browser.createTask({
  task: "Monitor production health check",
  url: "https://myapp.com"
});

// Read-only viewer
const viewer = task.getLiveIframe?.('readonly');
document.getElementById('monitor').innerHTML = viewer;

// Interactive control (human takeover)
const controller = task.getLiveIframe?.({
  interactive: true,
  height: '800px',
  width: '100%'
});

const result = await morph.browser.execute({
  task: "Resize to iPhone 12 size (390x844) and verify the mobile nav works",
  url: "https://myapp.com"
});

const result = await morph.browser.execute({
  task: "Test the checkout flow",
  url: "https://shop.example.com",
  recordVideo: true
});

if (result.recordingId) {
  const recording = await morph.browser.getRecording(result.recordingId);
  
  console.log('📹 Video:', recording.videoUrl);       // MP4/WebM playback
  console.log('🔄 Interactive:', recording.replayUrl); // rrweb DOM replay
  console.log('🌐 Network:', recording.networkUrl);    // All HTTP requests
  console.log('📊 Console:', recording.consoleUrl);    // JS console logs
}

const recording = await morph.browser.getRecording(result.recordingId);

const { webpUrl } = await recording.getWebp({
  width: 780,
  fps: 10,
  quality: 65,
  maxDuration: 15
});

console.log(`![Recording](${webpUrl})`);

const { webpUrl } = await recording.getWebp({
  maxSizeMb: 2.0  // Output guaranteed ≤ 2MB
});

const recording = await morph.browser.getRecording(result.recordingId);

const { errors, totalErrors } = await recording.getErrors();

errors.forEach(err => {
  console.log(`[${err.type}] ${err.message}`);
  if (err.screenshotUrl) {
    console.log(`Screenshot: ${err.screenshotUrl}`);
  }
});

const result = await morph.browser.execute({
  task: "Test the checkout flow",
  url: "https://myapp.com",
  model: "morph-computer-use-v1"  // or "morph-computer-use-v0", "gemini-3-flash-preview"
});

const result = await morph.browser.execute({
  // Required
  task: string,              // Natural language description
  
  // Optional
  url?: string,              // Starting URL
  model?: string,            // See "Choosing a Model" below
  maxSteps?: number,         // 1-50 (default: 10)
  recordVideo?: boolean,     // Enable recording (default: false)
  viewportWidth?: number,    // Browser width (default: 1280)
  viewportHeight?: number,   // Browser height (default: 720)
  externalId?: string,       // Your tracking ID
  repoFullName?: string,     // Repository full name ("owner/repo")
  repoId?: string,           // Repository UUID (if you already have it)
  commitId?: string,         // Commit/version identifier
  
  // Authentication
  auth?: {                   // Global credentials
    username?: string,
    password?: string,
    cookies?: any            // Cookie array for pre-authenticated sessions
  } | Record<string, AuthCredentials>  // Per-domain credentials
});

{
  success: boolean,          // Agent self-assessment
  result?: string,           // Task result/findings
  error?: string,            // Error message if failed
  stepsTaken: number,        // Actions executed
  executionTimeMs: number,
  
  // Debugging
  urls: (string | null)[],   // All URLs visited
  actionNames: string[],     // All actions taken
  errors: (string | null)[], // Per-step errors
  
  // Recording
  recordingId?: string,
  recordingStatus?: string,  // PENDING | RUNNING | PROCESSING | COMPLETED | ERROR
  debugUrl?: string          // Live session URL
}

const task = await morph.browser.createTask({
  // Same parameters as execute()
  task: "Test the login flow",
  url: "https://myapp.com"
});

console.log(task.debugUrl);    // Watch live
const result = await task.complete(); // Wait for completion

from browser_use import Agent, ChatOpenAI
import os

llm = ChatOpenAI(
    model="morph-computer-use-v1",  # or "morph-computer-use-v0", "gemini-3-flash-preview"
    api_key="YOUR_API_KEY",
    base_url="https://api.morphllm.com/v1"
)

agent = Agent(
    task="Navigate to amazon.com and get the first product title",
    llm=llm
)

result = await agent.run(max_steps=10)

# Vercel Dashboard → Settings → Environment Variables

# Production: Use production auth instance
CLERK_SECRET_KEY=sk_live_xxx  (Production only)

# Preview: Use development auth instance
CLERK_SECRET_KEY=sk_test_xxx  (Preview only)
TEST_USER_EMAIL=test@yourdomain.com  (Preview only)
TEST_USER_PASSWORD=xxx  (Preview only)

const result = await morph.browser.execute({
  task: "Log in with x_user and x_pass, verify dashboard",
  url: "https://preview-abc.vercel.app/login",
  auth: {
    username: process.env.TEST_USER_EMAIL,
    password: process.env.TEST_USER_PASSWORD
  }
});