[{"_1":2,"_181":-5,"_182":-5},"loaderData",{"_3":4,"_93":94},"root",{"_5":6,"_36":37,"_66":67},"ctx",{"_7":8,"_23":-5,"_24":25,"_26":27,"_28":20,"_29":20,"_30":20,"_31":-5,"_32":33,"_34":20,"_35":20},"auth",{"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":20,"_21":22},"sessionClaims","sessionId","sessionStatus","userId","actor","orgId","orgRole","orgSlug","orgPermissions","factorVerificationAge","isAuthenticated",false,"tokenType","session_token","user","preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesChatPanelState","notificationCount",0,"flagDenols","isTeamOrgMember","ENV",{"_38":39,"_40":41,"_42":43,"_44":45,"_46":47,"_48":49,"_50":51,"_52":53,"_54":55,"_56":57,"_58":59,"_60":61,"_62":63,"_64":65},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","VAL_RUNTIME_NAME","prod","RENDER_GIT_COMMIT","7c5bc882bceb0a55efc9fc584fee6b89303eee47","RENDER_GIT_BRANCH","main","CLERK_PUBLISHABLE_KEY","pk_live_Y2xlcmsudmFsLnRvd24k","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","API_URL","https://api.val.town","clerkState",{"_68":69},"__internal_clerk_state",{"_70":71,"_72":47,"_73":74,"_75":74,"_76":20,"_77":74,"_78":74,"_79":74,"_80":74,"_81":82,"_91":20,"_92":20},"__clerk_ssr_state",{"_21":22,"_9":-5,"_10":-5,"_11":-5,"_12":-5,"_13":-5,"_14":-5,"_15":-5,"_16":-5,"_17":-5,"_18":-5,"_19":20},"__publishableKey","__proxyUrl","","__domain","__isSatellite","__signInUrl","__signUpUrl","__afterSignInUrl","__afterSignUpUrl","__clerk_debug",{"_83":20,"_19":20,"_84":74,"_85":86,"_87":74,"_88":47,"_89":20,"_90":74},"isSignedIn","proxyUrl","reason","session-token-and-uat-missing","message","publishableKey","isSatellite","domain","__telemetryDisabled","__telemetryDebug","routes/embed.x.$handle.$name.$",{"_95":96,"_97":98,"_99":100,"_101":102,"_159":160,"_177":178,"_179":180},"handle","minhmmo","name","browserflow-engine","path","engine.ts","project",{"_103":104,"_97":98,"_105":106,"_107":-5,"_108":20,"_109":110,"_111":112,"_113":-5,"_12":114,"_115":116,"_117":118,"_119":-5,"_120":-5,"_121":33,"_14":122,"_123":124,"_125":126,"_127":-5,"_128":129,"_130":129,"_131":132,"_133":132,"_134":132,"_135":129,"_136":129,"_23":137,"_140":141,"_145":146,"_158":20},"id","85943de4-204c-11f1-94bd-42dde27851f2","createdAt",["D",1773564845585],"deletedAt","legacyEnvVars","privacy","public","description","Browser automation engine giống Browserflow, chạy trên Kernel.sh","imageUrl","019ced01-90af-7019-a349-1b32c2e46191","pinnedFileId","1a923ef0-204d-11f1-a860-42dde27851f2","pinPreview",true,"pinMigrated","screenshotVersion","likeCount","019ced04-6266-748c-a6bb-b70a7446d59e","tursoName","85943de4204c11f194bd42dde27851f2","tursoHostname","85943de4204c11f194bd42dde27851f2-val-town.aws-us-east-2.turso.io","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm",{"_95":96,"_138":139},"profileImageUrl","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/0cef36b0-8080-4c50-5206-197543f8c300/square512","org",{"_95":96,"_142":139,"_12":-5,"_143":144},"avatar","tier","pro","branch",{"_147":148,"_97":45,"_103":149,"_150":104,"_151":-5,"_152":-5,"_153":-5,"_154":-5,"_155":-5,"_156":98,"_157":96},"version",39,"859495f0-204c-11f1-94bd-42dde27851f2","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","isOwned","file",{"_103":161,"_97":100,"_162":163,"_164":-5,"_165":149,"_166":167,"_168":118,"_105":169,"_147":170,"_171":159,"_172":173,"_174":20,"_175":-5,"_99":176},"b53989ae-2052-11f1-82e9-42dde27851f2","fileId","f52e6d8c-204c-11f1-8e02-42dde27851f2","parentId","branchId","branchVersion",26,"latest",["D",1773567502494],13,"fileType","content","// ============================================================\n// FLOW ENGINE v2 - Kernel.sh REST API + Playwright CDP\n// Base URL confirmed: https://api.onkernel.com (từ official docs)\n// ============================================================\n\n// StubFS: bắt buộc trên Val Town để playwright-core không crash\nimport \"https://esm.town/v/wolf/StubFS/stubFs.ts\";\n\nimport type {\n Flow, Block, FlowContext, BlockResult, RunFlowOptions, RunFlowResult, LogEntry\n} from \"./types.ts\";\nimport { executeInteractBlock } from \"./blocks/interact.ts\";\nimport { executeExtractBlock } from \"./blocks/extract.ts\";\nimport { executeNavigateBlock } from \"./blocks/navigate.ts\";\nimport { executeControlFlowBlock } from \"./blocks/controlflow.ts\";\nimport { executeUtilityBlock } from \"./blocks/utilities.ts\";\nimport { executeSpreadsheetBlock } from \"./blocks/spreadsheet.ts\";\n\n// ─── Block groups ─────────────────────────────────────────\nconst INTERACT_BLOCKS = new Set([\n \"click\", \"type_text\", \"press_key\", \"scroll\", \"hover\",\n \"select_option\", \"set_date_input\", \"upload_file\", \"handle_dialog\"\n]);\nconst EXTRACT_BLOCKS = new Set([\n \"get_element_text\", \"get_link_url\", \"get_page_url\", \"get_element_attribute\",\n \"get_element_html\", \"get_clipboard\", \"save_file\", \"take_screenshot\", \"generate_pdf\"\n]);\nconst NAVIGATE_BLOCKS = new Set([\"visit\", \"go_back\", \"go_forward\", \"reload_page\"]);\nconst CONTROLFLOW_BLOCKS = new Set([\n \"loop\", \"loop_elements\", \"loop_list_items\", \"loop_pages\",\n \"if\", \"else\", \"while\", \"end\", \"break\"\n]);\nconst SPREADSHEET_BLOCKS = new Set([\n \"loop_spreadsheet_rows\", \"add_spreadsheet_row\", \"update_spreadsheet_row\", \"find_spreadsheet_row\"\n]);\n\n// ─── Kernel API types ─────────────────────────────────────\nconst KERNEL_BASE = \"https://api.onkernel.com\";\n\ninterface KernelSession {\n session_id: string;\n cdp_ws_url: string;\n browser_live_view_url?: string;\n}\n\n// ─── Kernel REST: tạo browser session ─────────────────────\nasync function createKernelSession(apiKey: string): Promise {\n const res = await fetch(`${KERNEL_BASE}/browsers`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"Authorization\": `Bearer ${apiKey}`,\n },\n body: JSON.stringify({\n headless: false,\n timeout_seconds: 300, // 5 phút\n }),\n signal: AbortSignal.timeout(20_000),\n });\n\n const text = await res.text();\n console.log(`[KERNEL] POST /browsers → ${res.status}: ${text.slice(0, 300)}`);\n\n if (!res.ok) {\n throw new Error(`Kernel API ${res.status}: ${text.slice(0, 200)}`);\n }\n\n const data = JSON.parse(text) as any;\n const session_id: string = data.session_id ?? \"\";\n const cdp_ws_url: string = data.cdp_ws_url ?? \"\";\n\n if (!session_id) throw new Error(`Kernel: no session_id. Got: ${text.slice(0, 100)}`);\n if (!cdp_ws_url) throw new Error(`Kernel: no cdp_ws_url. Got: ${text.slice(0, 100)}`);\n\n return { session_id, cdp_ws_url, browser_live_view_url: data.browser_live_view_url };\n}\n\n// ─── Kernel REST: xóa session ─────────────────────────────\nasync function deleteKernelSession(apiKey: string, sessionId: string): Promise {\n if (!sessionId) return;\n try {\n const res = await fetch(`${KERNEL_BASE}/browsers/${sessionId}`, {\n method: \"DELETE\",\n headers: { \"Authorization\": `Bearer ${apiKey}` },\n signal: AbortSignal.timeout(8_000),\n });\n console.log(`[KERNEL] DELETE /browsers/${sessionId} → ${res.status}`);\n } catch (e: any) {\n console.warn(`[KERNEL] Delete session warning: ${e.message}`);\n }\n}\n\n// ─── Retry với exponential backoff ────────────────────────\nasync function withRetry(\n fn: () => Promise,\n maxAttempts = 3,\n baseDelayMs = 2000,\n label = \"op\"\n): Promise {\n let lastError: Error = new Error(\"Unknown\");\n for (let i = 1; i <= maxAttempts; i++) {\n try {\n return await fn();\n } catch (err: any) {\n lastError = err;\n if (i < maxAttempts) {\n const delay = Math.min(baseDelayMs * Math.pow(2, i - 1), 30_000);\n console.warn(`[RETRY] ${label} attempt ${i}/${maxAttempts} failed: ${err.message}. Retry in ${delay}ms`);\n await new Promise(r => setTimeout(r, delay));\n }\n }\n }\n throw lastError;\n}\n\n// ─── Engine chính ──────────────────────────────────────────\nexport async function runFlow(options: RunFlowOptions): Promise {\n const { flow, kernelApiKey } = options;\n if (!flow) return { success: false, variables: {}, logs: [], error: \"No flow provided\" };\n\n // Logger dùng closure — không pass như arg để tránh \"log is not a function\"\n const logs: LogEntry[] = [];\n function emitLog(level: LogEntry[\"level\"], message: string, blockId?: string, blockType?: string, data?: unknown): void {\n const entry: LogEntry = {\n timestamp: new Date().toISOString(),\n level,\n message,\n blockId,\n blockType,\n data,\n };\n logs.push(entry);\n console.log(`[${level.toUpperCase()}][${blockType ?? \"engine\"}] ${message}`);\n }\n\n let browser: any = null;\n let sessionId = \"\";\n\n // ─── Phase 1: Tạo Kernel session ───────────────────────\n try {\n emitLog(\"info\", \"🚀 Tạo Kernel browser session...\");\n\n const ks = await withRetry(\n () => createKernelSession(kernelApiKey),\n 3, 2000, \"kernel-create\"\n );\n sessionId = ks.session_id;\n emitLog(\"info\", `✅ Session: ${sessionId}`);\n emitLog(\"info\", `🔗 CDP: ${ks.cdp_ws_url}`);\n if (ks.browser_live_view_url) {\n emitLog(\"info\", `🖥️ Live view: ${ks.browser_live_view_url}`);\n }\n\n // ─── Phase 2: Connect Playwright ──────────────────────\n emitLog(\"info\", \"🎭 Connecting Playwright via CDP...\");\n const { chromium } = await import(\"npm:playwright-core@1.49.1\");\n\n browser = await withRetry(\n () => chromium.connectOverCDP(ks.cdp_ws_url, { timeout: 30_000 }),\n 3, 2000, \"cdp-connect\"\n );\n emitLog(\"info\", \"✅ Playwright connected\");\n\n } catch (err: any) {\n emitLog(\"error\", `❌ Init failed: ${err.message}`);\n if (sessionId) await deleteKernelSession(kernelApiKey, sessionId);\n return { success: false, variables: {}, logs, error: err.message };\n }\n\n // ─── Phase 3: Khởi tạo Page ──────────────────────────\n let mainPage: any;\n try {\n const contexts = browser.contexts();\n const ctx0 = contexts.length > 0 ? contexts[0] : await browser.newContext();\n const pages = ctx0.pages();\n mainPage = pages.length > 0 ? pages[0] : await ctx0.newPage();\n emitLog(\"info\", \"✅ Page ready\");\n } catch (err: any) {\n emitLog(\"error\", `❌ Page init failed: ${err.message}`);\n await browser.close().catch(() => {});\n await deleteKernelSession(kernelApiKey, sessionId);\n return { success: false, variables: {}, logs, error: err.message };\n }\n\n const initialTabId = \"tab_main\";\n const tabs = new Map();\n tabs.set(initialTabId, mainPage);\n\n const flowCtx: FlowContext = {\n variables: { ...(flow.variables ?? {}), ...(options.variables ?? {}) },\n tabs,\n activeTabId: initialTabId,\n loopStack: [],\n browser,\n kernelSessionId: sessionId,\n logs,\n shouldBreak: false,\n };\n\n // ─── Phase 4: Thực thi blocks ────────────────────────\n let blockIndex = 0;\n const blocks = flow.blocks ?? [];\n let runSuccess = true;\n let runError = \"\";\n\n while (blockIndex < blocks.length) {\n const block = blocks[blockIndex];\n if (!block) { blockIndex++; continue; }\n\n // Skip comment blocks\n if (block.type === \"comment\") {\n emitLog(\"debug\", `💬 ${block.params?.text ?? \"\"}`, block.id, \"comment\");\n blockIndex++;\n continue;\n }\n\n const t0 = Date.now();\n emitLog(\"info\", `▶ [${blockIndex}] ${block.type}`, block.id, block.type, block.params);\n\n let result: BlockResult;\n try {\n if (INTERACT_BLOCKS.has(block.type)) {\n result = await executeInteractBlock(block, flowCtx);\n } else if (EXTRACT_BLOCKS.has(block.type)) {\n result = await executeExtractBlock(block, flowCtx);\n } else if (NAVIGATE_BLOCKS.has(block.type)) {\n result = await executeNavigateBlock(block, flowCtx);\n } else if (CONTROLFLOW_BLOCKS.has(block.type)) {\n result = await executeControlFlowBlock(block, flowCtx, blockIndex, blocks);\n } else if (SPREADSHEET_BLOCKS.has(block.type)) {\n result = await executeSpreadsheetBlock(block, flowCtx, blockIndex);\n } else if (block.type === \"run_flow\") {\n result = await runSubFlow(block, flowCtx, kernelApiKey);\n } else {\n result = await executeUtilityBlock(block, flowCtx);\n }\n } catch (err: any) {\n result = { success: false, error: err.message };\n }\n\n const ms = Date.now() - t0;\n\n if (!result.success) {\n const msg = `❌ [${block.type}] ${result.error ?? \"Unknown error\"} (${ms}ms)`;\n emitLog(\"error\", msg, block.id, block.type);\n\n // Auto-screenshot on error\n try {\n const buf = await mainPage.screenshot({ type: \"png\", fullPage: false });\n const b64 = btoa(String.fromCharCode(...new Uint8Array(buf)));\n emitLog(\"debug\", `📸 screenshot:data:image/png;base64,${b64}`, block.id, block.type);\n } catch (_) { /* ignore */ }\n\n if (block.params?.continueOnError) {\n emitLog(\"warn\", `⚠️ continueOnError=true, continuing`, block.id, block.type);\n blockIndex++;\n continue;\n }\n runSuccess = false;\n runError = msg;\n break;\n }\n\n emitLog(\"info\", `✅ [${block.type}] done (${ms}ms)`, block.id, block.type,\n result.output !== undefined ? result.output : undefined);\n\n // Điều hướng index\n if (flowCtx.shouldBreak) {\n flowCtx.shouldBreak = false;\n blockIndex = findNextEnd(blocks, blockIndex) + 1;\n continue;\n }\n if (result.jumpToIndex !== undefined) {\n blockIndex = result.jumpToIndex;\n continue;\n }\n if (result.skipToEnd) {\n blockIndex = findNextEndOrElse(blocks, blockIndex) + 1;\n continue;\n }\n\n blockIndex++;\n }\n\n // ─── Cleanup ─────────────────────────────────────────\n emitLog(\"info\", \"🧹 Cleaning up...\");\n try { await browser.close(); } catch (_) { /* ignore */ }\n await deleteKernelSession(kernelApiKey, sessionId);\n emitLog(\"info\", \"✅ Done\");\n\n return {\n success: runSuccess,\n variables: flowCtx.variables,\n logs,\n error: runError || undefined,\n };\n}\n\n// ─── Sub-flow runner ─────────────────────────────────────\nasync function runSubFlow(block: Block, ctx: FlowContext, kernelApiKey: string): Promise {\n const flowId: string = block.params?.flowId ?? \"\";\n if (!flowId) return { success: false, error: \"run_flow: missing flowId\" };\n try {\n const { getFlow } = await import(\"./storage.ts\");\n const subFlow = await getFlow(flowId);\n if (!subFlow) return { success: false, error: `Flow not found: ${flowId}` };\n const result = await runFlow({ flow: subFlow, kernelApiKey, variables: ctx.variables });\n Object.assign(ctx.variables, result.variables);\n return { success: result.success, output: result.variables, error: result.error };\n } catch (err: any) {\n return { success: false, error: err.message };\n }\n}\n\n// ─── Index helpers ───────────────────────────────────────\nconst LOOP_TYPES = [\"loop\", \"loop_elements\", \"loop_list_items\", \"loop_pages\", \"loop_spreadsheet_rows\", \"if\", \"while\"];\n\nfunction findNextEnd(blocks: Block[], from: number): number {\n let depth = 1;\n for (let i = from + 1; i < blocks.length; i++) {\n if (LOOP_TYPES.includes(blocks[i].type)) depth++;\n if (blocks[i].type === \"end\") { if (--depth === 0) return i; }\n }\n return blocks.length - 1;\n}\n\nfunction findNextEndOrElse(blocks: Block[], from: number): number {\n let depth = 1;\n for (let i = from + 1; i < blocks.length; i++) {\n const t = blocks[i].type;\n if (LOOP_TYPES.includes(t)) depth++;\n if (t === \"end\") { if (--depth === 0) return i; }\n if (t === \"else\" && depth === 1) return i;\n }\n return blocks.length - 1;\n}\n","deleted","label",[100],"permalink","https://www.val.town/x/minhmmo/browserflow-engine/code/engine.ts","extension","ts","actionData","errors"]