BrowserFlow Engine

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_276":277,"_278":279},"routes/_app.x.$handle.$name",{"_105":104,"_38":51,"_114":95,"_33":115,"_13":14,"_116":-5,"_11":117,"_118":119,"_120":121,"_122":123,"_124":125,"_26":-5,"_126":-5,"_127":-5,"_128":31,"_129":130,"_131":64,"_132":-5,"_133":-5,"_134":135},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_49":50,"_38":51,"_44":52,"_53":-5,"_54":31,"_55":56,"_57":56,"_58":59,"_60":-5,"_19":61,"_62":37,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":72,"_73":74,"_75":76,"_77":-5,"_78":79,"_80":79,"_81":82,"_83":82,"_84":82,"_85":79,"_86":79,"_87":88,"_89":90,"_91":92,"_93":31},"version",13,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","50ec92fc-a746-4aea-89d5-3aac4df3c067","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":29,"_30":31,"_32":31,"_33":34,"_35":34},"file",{"_36":37,"_38":34,"_39":40,"_41":43,"_44":45,"_46":14,"_47":48,"_30":31},"previous",{"_36":37,"_38":34,"_39":40,"_41":42},"deleted",false,"deletedHere","path","main.ts","latestPath","fileId","1a923ef0-204d-11f1-a860-42dde27851f2","name","fileType","http","content","// ============================================================\n// MAIN HTTP API + UI SERVER\n// ============================================================\n\nimport { runFlow } from \"./engine.ts\";\nimport {\n saveFlow, getFlow, listFlows, deleteFlow,\n saveFlowRun, getFlowRun, listFlowRuns\n} from \"./storage.ts\";\nimport type { Flow } from \"./types.ts\";\n\nconst CORS_HEADERS = {\n \"Access-Control-Allow-Origin\": \"*\",\n \"Access-Control-Allow-Methods\": \"GET, POST, PUT, DELETE, OPTIONS\",\n \"Access-Control-Allow-Headers\": \"Content-Type, Authorization, X-Kernel-API-Key\",\n};\n\nfunction json(data: any, status = 200) {\n return new Response(JSON.stringify(data, null, 2), {\n status,\n headers: { ...CORS_HEADERS, \"Content-Type\": \"application/json\" }\n });\n}\n\nfunction error(msg: string, status = 400) {\n return json({ error: msg }, status);\n}\n\n// Load UI HTML\nasync function serveUI(): Promise {\n try {\n const html = await fetch(import.meta.resolve(\"./ui.html\")).then(r => r.text());\n return new Response(html, {\n headers: { \"Content-Type\": \"text/html; charset=utf-8\" }\n });\n } catch (e) {\n return new Response(\"UI not found\", { status: 404 });\n }\n}\n\nexport default async function handler(req: Request): Promise {\n if (req.method === \"OPTIONS\") {\n return new Response(null, { headers: CORS_HEADERS });\n }\n\n const url = new URL(req.url);\n const path = url.pathname;\n const method = req.method;\n\n // ── Serve UI at root ──\n if (path === \"/\" && method === \"GET\") {\n return serveUI();\n }\n\n // ── API AUTH ──\n const authHeader = req.headers.get(\"Authorization\") || \"\";\n const apiKey = authHeader.replace(\"Bearer \", \"\").trim() || url.searchParams.get(\"api_key\") || \"\";\n const envApiKey = Deno.env.get(\"BROWSERFLOW_API_KEY\") || \"\";\n if (envApiKey && apiKey !== envApiKey) {\n // Allow UI to pass through without auth (UI handles its own key storage)\n if (!path.startsWith(\"/flows\") && !path.startsWith(\"/runs\") && !path.startsWith(\"/run\") && !path.startsWith(\"/blocks\")) {\n // skip\n } else {\n return error(\"Unauthorized\", 401);\n }\n }\n\n const kernelApiKey = req.headers.get(\"X-Kernel-API-Key\") ||\n Deno.env.get(\"KERNEL_API_KEY\") || \"\";\n\n try {\n // GET /flows\n if (path === \"/flows\" && method === \"GET\") {\n const flows = await listFlows();\n return json({ flows, total: flows.length });\n }\n\n // POST /flows\n if (path === \"/flows\" && method === \"POST\") {\n const body = await req.json() as Flow;\n if (!body.name) return error(\"Missing flow name\");\n if (!body.blocks || !Array.isArray(body.blocks)) return error(\"Missing blocks array\");\n if (!body.id) body.id = `flow_${Date.now()}_${Math.random().toString(36).slice(2, 8)}`;\n await saveFlow(body);\n return json({ success: true, flowId: body.id, flow: body });\n }\n\n // GET /flows/:id\n const flowMatch = path.match(/^\\/flows\\/([^\\/]+)$/);\n if (flowMatch && method === \"GET\") {\n const flow = await getFlow(flowMatch[1]);\n if (!flow) return error(\"Flow not found\", 404);\n return json(flow);\n }\n\n // DELETE /flows/:id\n if (flowMatch && method === \"DELETE\") {\n await deleteFlow(flowMatch[1]);\n return json({ success: true });\n }\n\n // POST /flows/:id/run\n const runMatch = path.match(/^\\/flows\\/([^\\/]+)\\/run$/);\n if (runMatch && method === \"POST\") {\n const flowId = runMatch[1];\n const flow = await getFlow(flowId);\n if (!flow) return error(\"Flow not found\", 404);\n\n const effectiveKernelKey = req.headers.get(\"X-Kernel-API-Key\") ||\n Deno.env.get(\"KERNEL_API_KEY\") || \"\";\n if (!effectiveKernelKey) return error(\"Missing Kernel API Key\");\n\n const body = await req.json().catch(() => ({}));\n const runId = `run_${Date.now()}_${Math.random().toString(36).slice(2, 8)}`;\n const startedAt = new Date().toISOString();\n\n await saveFlowRun({ id: runId, flowId, status: \"running\", startedAt });\n\n const result = await runFlow({\n flow,\n variables: body.variables || {},\n kernelApiKey: effectiveKernelKey\n });\n\n const finishedAt = new Date().toISOString();\n await saveFlowRun({\n id: runId, flowId,\n status: result.success ? \"success\" : \"failed\",\n startedAt, finishedAt,\n variables: result.variables,\n logs: result.logs,\n error: result.error\n });\n\n return json({ runId, ...result, startedAt, finishedAt });\n }\n\n // POST /run (inline)\n if (path === \"/run\" && method === \"POST\") {\n const effectiveKernelKey = req.headers.get(\"X-Kernel-API-Key\") ||\n Deno.env.get(\"KERNEL_API_KEY\") || \"\";\n if (!effectiveKernelKey) return error(\"Missing Kernel API Key\");\n\n const body = await req.json() as { flow: Flow; variables?: Record };\n if (!body.flow) return error(\"Missing flow in request body\");\n\n const result = await runFlow({\n flow: body.flow,\n variables: body.variables || {},\n kernelApiKey: effectiveKernelKey\n });\n return json(result);\n }\n\n // GET /runs\n if (path === \"/runs\" && method === \"GET\") {\n const flowId = url.searchParams.get(\"flowId\") || undefined;\n const runs = await listFlowRuns(flowId);\n return json({ runs });\n }\n\n // GET /runs/:id\n const runDetailMatch = path.match(/^\\/runs\\/([^\\/]+)$/);\n if (runDetailMatch && method === \"GET\") {\n const run = await getFlowRun(runDetailMatch[1]);\n if (!run) return error(\"Run not found\", 404);\n return json(run);\n }\n\n // GET /blocks\n if (path === \"/blocks\" && method === \"GET\") {\n return json(BLOCK_CATALOG);\n }\n\n // GET /health\n if (path === \"/health\" && method === \"GET\") {\n return json({ name: \"BrowserFlow Engine\", version: \"1.0.0\", status: \"ok\" });\n }\n\n return error(\"Not found\", 404);\n } catch (err: any) {\n console.error(\"API Error:\", err);\n return error(err.message, 500);\n }\n}\n\n// ── Block Catalog ──────────────────────────────────────────\nconst BLOCK_CATALOG = {\n interact: [\n { type: \"click\", params: { selector: \"string\", button: \"left|right|middle\", clickCount: \"number\", timeout: \"number\", waitAfter: \"number\" } },\n { type: \"type_text\", params: { selector: \"string\", text: \"string\", clearFirst: \"boolean\", delay: \"number\" } },\n { type: \"press_key\", params: { key: \"string (Enter/Tab/Escape...)\", selector: \"string?\" } },\n { type: \"scroll\", params: { selector: \"string?\", x: \"number\", y: \"number\", distance: \"number\" } },\n { type: \"hover\", params: { selector: \"string\", timeout: \"number\" } },\n { type: \"select_option\", params: { selector: \"string\", value: \"string\", byLabel: \"boolean\", byIndex: \"number\" } },\n { type: \"set_date_input\", params: { selector: \"string\", date: \"string (YYYY-MM-DD)\" } },\n { type: \"upload_file\", params: { selector: \"string\", filePath: \"string\" } },\n { type: \"handle_dialog\", params: { action: \"accept|dismiss\", promptText: \"string\" } },\n ],\n extract: [\n { type: \"get_element_text\", params: { selector: \"string\", saveAs: \"string\", multiple: \"boolean\" } },\n { type: \"get_link_url\", params: { selector: \"string\", saveAs: \"string\" } },\n { type: \"get_page_url\", params: { saveAs: \"string\" } },\n { type: \"get_element_attribute\", params: { selector: \"string\", attribute: \"string\", saveAs: \"string\" } },\n { type: \"get_element_html\", params: { selector: \"string\", saveAs: \"string\", outer: \"boolean\" } },\n { type: \"get_clipboard\", params: { saveAs: \"string\" } },\n { type: \"save_file\", params: { url: \"string\", saveAs: \"string\" } },\n { type: \"take_screenshot\", params: { saveAs: \"string\", selector: \"string?\", fullPage: \"boolean\" } },\n { type: \"generate_pdf\", params: { saveAs: \"string\", format: \"A4|Letter\", printBackground: \"boolean\" } },\n ],\n navigate: [\n { type: \"visit\", params: { url: \"string\", waitUntil: \"load|domcontentloaded|networkidle\", saveAs: \"string\" } },\n { type: \"go_back\", params: {} },\n { type: \"go_forward\", params: {} },\n { type: \"reload_page\", params: {} },\n ],\n spreadsheet: [\n { type: \"loop_spreadsheet_rows\", params: { spreadsheetId: \"string\", sheetName: \"string\", accessToken: \"string\", rowVar: \"string\", indexVar: \"string\" } },\n { type: \"add_spreadsheet_row\", params: { spreadsheetId: \"string\", sheetName: \"string\", accessToken: \"string\", values: \"object|array\" } },\n { type: \"update_spreadsheet_row\", params: { spreadsheetId: \"string\", sheetName: \"string\", accessToken: \"string\", rowNumber: \"number\", values: \"object|array\" } },\n { type: \"find_spreadsheet_row\", params: { spreadsheetId: \"string\", sheetName: \"string\", accessToken: \"string\", column: \"string\", value: \"string\", saveAs: \"string\", saveRowNumberAs: \"string\" } },\n ],\n controlflow: [\n { type: \"loop\", params: { count: \"number\", itemVar: \"string\" } },\n { type: \"loop_elements\", params: { selector: \"string\", itemVar: \"string\", countVar: \"string\" } },\n { type: \"loop_list_items\", params: { listVar: \"string\", itemVar: \"string\", indexVar: \"string\" } },\n { type: \"loop_pages\", params: { nextSelector: \"string\", maxPages: \"number\", pageVar: \"string\" } },\n { type: \"if\", params: { condition: \"string\", variable: \"string\", operator: \"==|!=|>|<|>=|<=|contains|not_contains|is_empty|is_not_empty\", value: \"string\" } },\n { type: \"else\", params: {} },\n { type: \"while\", params: { condition: \"string\" } },\n { type: \"end\", params: {} },\n { type: \"break\", params: {} },\n ],\n tabs: [\n { type: \"create_tab\", params: { url: \"string?\", tabIdVar: \"string\" } },\n { type: \"get_active_tab_id\", params: { saveAs: \"string\" } },\n { type: \"select_tab\", params: { tabId: \"string\" } },\n { type: \"close_tab\", params: { tabId: \"string?\" } },\n ],\n utilities: [\n { type: \"run_script\", params: { script: \"string (JS)\", saveAs: \"string\" } },\n { type: \"get_date\", params: { format: \"iso|timestamp|locale|date_only|time_only\", saveAs: \"string\" } },\n { type: \"wait\", params: { duration: \"number (ms)\" } },\n { type: \"wait_for_element\", params: { selector: \"string\", timeout: \"number\", state: \"visible|hidden|attached|detached\" } },\n { type: \"show_alert\", params: { message: \"string\" } },\n { type: \"make_http_request\", params: { url: \"string\", method: \"GET|POST|PUT|DELETE\", headers: \"object\", body: \"any\", saveAs: \"string\", saveStatusAs: \"string\" } },\n { type: \"assert\", params: { condition: \"string\", message: \"string\" } },\n { type: \"run_flow\", params: { flowId: \"string\" } },\n { type: \"comment\", params: { text: \"string\" } },\n { type: \"solve_captcha\", params: { selector: \"string\", apiKey: \"string\", saveAs: \"string\" } },\n ],\n};\n","// ============================================================\n// MAIN HTTP API + UI SERVER\n// ============================================================\n\nimport { runFlow } from \"./engine.ts\";\nimport {\n saveFlow, getFlow, listFlows, deleteFlow,\n saveFlowRun, getFlowRun, listFlowRuns\n} from \"./storage.ts\";\nimport type { Flow } from \"./types.ts\";\n\nconst CORS_HEADERS = {\n \"Access-Control-Allow-Origin\": \"*\",\n \"Access-Control-Allow-Methods\": \"GET, POST, PUT, DELETE, OPTIONS\",\n \"Access-Control-Allow-Headers\": \"Content-Type, Authorization, X-Kernel-API-Key\",\n};\n\nfunction json(data: any, status = 200) {\n return new Response(JSON.stringify(data, null, 2), {\n status,\n headers: { ...CORS_HEADERS, \"Content-Type\": \"application/json\" }\n });\n}\n\nfunction err(msg: string, status = 400) {\n return json({ error: msg }, status);\n}\n\nexport default async function handler(req: Request): Promise {\n if (req.method === \"OPTIONS\") return new Response(null, { headers: CORS_HEADERS });\n\n const url = new URL(req.url);\n const path = url.pathname;\n const method = req.method;\n\n // ── Serve UI ──\n if ((path === \"/\" || path === \"\") && method === \"GET\") {\n return new Response(HTML, { headers: { \"Content-Type\": \"text/html; charset=utf-8\" } });\n }\n\n const kernelApiKey = req.headers.get(\"X-Kernel-API-Key\") || Deno.env.get(\"KERNEL_API_KEY\") || \"\";\n\n try {\n // GET /flows\n if (path === \"/flows\" && method === \"GET\") {\n const flows = await listFlows();\n return json({ flows, total: flows.length });\n }\n\n // POST /flows\n if (path === \"/flows\" && method === \"POST\") {\n const body = await req.json() as Flow;\n if (!body.name) return err(\"Missing flow name\");\n if (!Array.isArray(body.blocks)) return err(\"Missing blocks array\");\n if (!body.id) body.id = `flow_${Date.now()}_${Math.random().toString(36).slice(2, 8)}`;\n await saveFlow(body);\n return json({ success: true, flowId: body.id });\n }\n\n // GET /flows/:id\n const flowMatch = path.match(/^\\/flows\\/([^\\/]+)$/);\n if (flowMatch && method === \"GET\") {\n const flow = await getFlow(flowMatch[1]);\n if (!flow) return err(\"Flow not found\", 404);\n return json(flow);\n }\n\n // DELETE /flows/:id\n if (flowMatch && method === \"DELETE\") {\n await deleteFlow(flowMatch[1]);\n return json({ success: true });\n }\n\n // POST /flows/:id/run\n const runMatch = path.match(/^\\/flows\\/([^\\/]+)\\/run$/);\n if (runMatch && method === \"POST\") {\n const flowId = runMatch[1];\n const flow = await getFlow(flowId);\n if (!flow) return err(\"Flow not found\", 404);\n const effectiveKey = req.headers.get(\"X-Kernel-API-Key\") || Deno.env.get(\"KERNEL_API_KEY\") || \"\";\n if (!effectiveKey) return err(\"Missing Kernel API Key\");\n const body = await req.json().catch(() => ({}));\n const runId = `run_${Date.now()}_${Math.random().toString(36).slice(2, 8)}`;\n const startedAt = new Date().toISOString();\n await saveFlowRun({ id: runId, flowId, status: \"running\", startedAt });\n const result = await runFlow({ flow, variables: body.variables || {}, kernelApiKey: effectiveKey });\n const finishedAt = new Date().toISOString();\n await saveFlowRun({ id: runId, flowId, status: result.success ? \"success\" : \"failed\", startedAt, finishedAt, variables: result.variables, logs: result.logs, error: result.error });\n return json({ runId, ...result, startedAt, finishedAt });\n }\n\n // POST /run (inline)\n if (path === \"/run\" && method === \"POST\") {\n if (!kernelApiKey) return err(\"Missing Kernel API Key\");\n const body = await req.json() as { flow: Flow; variables?: Record };\n if (!body.flow) return err(\"Missing flow\");\n const result = await runFlow({ flow: body.flow, variables: body.variables || {}, kernelApiKey });\n return json(result);\n }\n\n // GET /runs\n if (path === \"/runs\" && method === \"GET\") {\n const runs = await listFlowRuns(url.searchParams.get(\"flowId\") || undefined);\n return json({ runs });\n }\n\n // GET /runs/:id\n const runDetailMatch = path.match(/^\\/runs\\/([^\\/]+)$/);\n if (runDetailMatch && method === \"GET\") {\n const run = await getFlowRun(runDetailMatch[1]);\n if (!run) return err(\"Run not found\", 404);\n return json(run);\n }\n\n // GET /health\n if (path === \"/health\") return json({ status: \"ok\", name: \"BrowserFlow Engine\", version: \"1.0.0\" });\n\n return err(\"Not found\", 404);\n } catch (e: any) {\n console.error(e);\n return err(e.message, 500);\n }\n}\n\n// ── Inline HTML UI ─────────────────────────────────────────\nconst HTML = `\n\n\n\n\nBrowserFlow Engine\n\n\n\n

⚡ BrowserFlow

\n \n \n \n \n

\n ● Connecting...\n \n

\n\n

Total Flows

Total Runs

Success

Failed

My Flows

🌊

No flows yet!

Recent Runs

\n \n \n

Flow	Status	Started	Duration	Actions
No runs yet

\n\n

\n \n

➕ Click to add block or drag from sidebar

Flow Variables

\n \n

Quick Actions

\n \n \n \n

\n\n

\n \n

Select a run to view logs

\n\n

⚙️ Settings

🔑 API Keys

Kernel.sh API Key

Get from app.kernel.sh → API Keys

BrowserFlow API Key (optional)

\n \n

🌐 Endpoint

Backend URL

\n \n

📦 Block Stats

ℹ️ About

BrowserFlow Engine v1.0.0
Powered by Kernel.sh + Playwright + Val Town

\n\n\n\n\n

🚀 Starting...

\n \n

\n\n\n\n`;\n","createdAt",["D",1773566422587],"branchVersion","branchId","859495f0-204c-11f1-94bd-42dde27851f2","id","85943de4-204c-11f1-94bd-42dde27851f2","browserflow-engine",["D",1773564845585],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Browser automation engine giống Browserflow, chạy trên Kernel.sh","imageUrl","019ced01-90af-7019-a349-1b32c2e46191","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019ced04-6266-748c-a6bb-b70a7446d59e","tursoName","85943de4204c11f194bd42dde27851f2","tursoHostname","85943de4204c11f194bd42dde27851f2-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789528252206],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_105":104,"_113":109},"org",{"_105":104,"_106":107,"_108":109,"_19":-5,"_110":111,"_112":31},"branch",{"_13":94,"_38":95,"_49":48,"_96":50,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":51,"_103":104},"isOwned",39,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","minhmmo","handle","displayName","adminh","avatar","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/0cef36b0-8080-4c50-5206-197543f8c300/square512?exp=1789559999&sig=78e9dcd29812bca849676d6ad2c88ee25b163c5e4a8744671a00d6a4f71b86ee","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_49":50,"_38":51,"_44":271,"_53":-5,"_54":31,"_55":56,"_57":56,"_58":59,"_60":-5,"_19":61,"_62":37,"_63":64,"_65":-5,"_66":-5,"_67":68,"_69":70,"_71":72,"_73":74,"_75":272,"_77":-5,"_78":79,"_80":79,"_81":82,"_83":82,"_84":82,"_85":79,"_86":79,"_87":273,"_89":274,"_91":275,"_93":31},"tree",[193,200,201,202,203,204],"files",[193,194,195,196,197,198,199,200,201,202,203,204],"counts",{"_183":68,"_184":155,"_185":68,"_186":187,"_188":189},"contents",[136,137,138,139,140,141],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_49":177,"_38":178,"_36":179,"_145":-5,"_47":48,"_46":168,"_147":64,"_44":180,"_13":68,"_39":181,"_41":-5,"_30":31,"_150":-5,"_33":182},{"_49":170,"_38":171,"_36":172,"_145":-5,"_47":48,"_46":173,"_147":31,"_44":174,"_13":68,"_39":26,"_41":175,"_30":31,"_150":-5,"_33":176},{"_49":166,"_38":34,"_36":37,"_145":-5,"_47":48,"_46":14,"_147":31,"_44":167,"_13":168,"_39":40,"_41":43,"_30":31,"_150":-5,"_33":169},{"_49":159,"_38":160,"_36":161,"_145":-5,"_47":48,"_46":162,"_147":31,"_44":163,"_13":68,"_39":26,"_41":164,"_30":31,"_150":-5,"_33":165},{"_49":152,"_38":153,"_36":154,"_145":-5,"_47":48,"_46":155,"_147":31,"_44":156,"_13":68,"_39":26,"_41":157,"_30":31,"_150":-5,"_33":158},{"_49":142,"_38":143,"_36":144,"_145":-5,"_47":48,"_46":146,"_147":64,"_44":148,"_13":68,"_39":26,"_41":149,"_30":31,"_150":-5,"_33":151},"ab291dc0-204e-11f1-96c4-42dde27851f2","ui.html","ab291e88-204e-11f1-96c4-42dde27851f2","parentId",11,"latest",["D",1773565767626],"\n\n\n\n\nBrowserFlow Engine\n\n\n\n\n\n

⚡ BrowserFlow

\n \n \n \n \n

\n ● Connecting...\n \n

\n\n\n

Total Flows

Total Runs

Success

Failed

\n\n

My Flows

🌊

No flows yet. Create your first flow!

\n\n

Recent Runs

\n \n \n \n

Flow	Status	Started	Duration	Actions
No runs yet

\n\n\n

\n \n \n\n \n

\n \n

\n ➕ Click to add block or drag from sidebar\n

\n\n \n

Flow Variables

\n \n

Selected Block

Click a block to see details

Quick Actions

\n \n \n \n

\n\n\n

\n \n

Select a run to view logs

\n\n\n

⚙️ Settings

🔑 API Keys

Kernel.sh API Key

\n \n

Get from app.kernel.sh → API Keys

BrowserFlow API Key (optional)

\n \n

Protect your API endpoint

\n \n

🌐 API Endpoint

Backend URL

\n \n

Your Val Town endpoint

\n \n

📦 Block Stats

ℹ️ About

BrowserFlow Engine v1.0.0

Browser automation platform

• Kernel.sh (Cloud Browser)

• Playwright (Browser Control)

• Val Town (Serverless)

\n\n\n\n\n\n\n\n\n\n

🚀 Starting Kernel.sh browser...

\n \n

\n\n\n

\n\n\n\n\n","label",[143],"8f080dd8-204c-11f1-9400-42dde27851f2","types.ts","8f080e96-204c-11f1-9400-42dde27851f2",1,["D",1773564861435],"// ============================================================\n// TYPES - Định nghĩa toàn bộ kiểu dữ liệu cho hệ thống\n// ============================================================\n\nexport type BlockType =\n // 🖱️ Interact\n | \"click\"\n | \"type_text\"\n | \"press_key\"\n | \"scroll\"\n | \"hover\"\n | \"select_option\"\n | \"set_date_input\"\n | \"upload_file\"\n | \"handle_dialog\"\n // 📊 Extract\n | \"get_element_text\"\n | \"get_link_url\"\n | \"get_page_url\"\n | \"get_element_attribute\"\n | \"get_element_html\"\n | \"get_clipboard\"\n | \"save_file\"\n | \"take_screenshot\"\n | \"generate_pdf\"\n // 🧭 Navigate\n | \"visit\"\n | \"go_back\"\n | \"go_forward\"\n | \"reload_page\"\n // 📑 Spreadsheet\n | \"loop_spreadsheet_rows\"\n | \"add_spreadsheet_row\"\n | \"update_spreadsheet_row\"\n | \"find_spreadsheet_row\"\n // 🔁 Control Flow\n | \"loop_elements\"\n | \"loop_pages\"\n | \"loop\"\n | \"loop_list_items\"\n | \"if\"\n | \"else\"\n | \"while\"\n | \"end\"\n | \"break\"\n // 🪟 Tabs\n | \"create_tab\"\n | \"get_active_tab_id\"\n | \"select_tab\"\n | \"close_tab\"\n // 🔧 Utilities\n | \"run_script\"\n | \"get_date\"\n | \"wait\"\n | \"wait_for_element\"\n | \"show_alert\"\n | \"make_http_request\"\n | \"assert\"\n | \"run_flow\"\n | \"comment\"\n | \"solve_captcha\";\n\nexport interface Block {\n id: string;\n type: BlockType;\n params: Record;\n comment?: string;\n}\n\nexport interface Flow {\n id: string;\n name: string;\n description?: string;\n blocks: Block[];\n variables?: Record;\n createdAt?: string;\n updatedAt?: string;\n}\n\nexport interface FlowContext {\n variables: Record;\n tabs: Map; // tabId -> page object\n activeTabId: string;\n loopStack: LoopFrame[];\n browser: any;\n kernelSessionId: string;\n logs: LogEntry[];\n shouldBreak: boolean;\n}\n\nexport interface LoopFrame {\n type: \"loop\" | \"loop_elements\" | \"loop_pages\" | \"loop_list_items\" | \"loop_spreadsheet_rows\" | \"while\";\n startIndex: number; // index của block loop trong flow\n currentIteration: number;\n maxIterations?: number;\n items?: any[];\n currentItem?: any;\n condition?: string;\n}\n\nexport interface LogEntry {\n timestamp: string;\n level: \"info\" | \"warn\" | \"error\" | \"debug\";\n blockId?: string;\n blockType?: string;\n message: string;\n data?: any;\n}\n\nexport interface BlockResult {\n success: boolean;\n output?: any;\n error?: string;\n skipToEnd?: boolean; // dùng cho break\n jumpToIndex?: number; // dùng cho loop\n}\n\nexport interface RunFlowOptions {\n flowId?: string;\n flow?: Flow;\n variables?: Record;\n kernelApiKey: string;\n}\n\nexport interface RunFlowResult {\n success: boolean;\n variables: Record;\n logs: LogEntry[];\n error?: string;\n screenshots?: string[];\n}\n",[153],"fe6df9ee-204c-11f1-8e02-42dde27851f2","storage.ts","fe6dfab6-204c-11f1-8e02-42dde27851f2",9,["D",1773565048336],"// ============================================================\n// STORAGE - Lưu/lấy Flows từ SQLite\n// ============================================================\n\nimport { sqlite } from \"https://esm.town/v/std/sqlite/main.ts\";\nimport type { Flow } from \"./types.ts\";\n\n// Khởi tạo bảng\nawait sqlite.execute(`\n CREATE TABLE IF NOT EXISTS flows (\n id TEXT PRIMARY KEY,\n name TEXT NOT NULL,\n description TEXT,\n data TEXT NOT NULL,\n created_at TEXT NOT NULL,\n updated_at TEXT NOT NULL\n )\n`);\n\nawait sqlite.execute(`\n CREATE TABLE IF NOT EXISTS flow_runs (\n id TEXT PRIMARY KEY,\n flow_id TEXT NOT NULL,\n status TEXT NOT NULL,\n started_at TEXT NOT NULL,\n finished_at TEXT,\n variables TEXT,\n logs TEXT,\n error TEXT\n )\n`);\n\n// ─── FLOWS ────────────────────────────────────────────────\nexport async function saveFlow(flow: Flow): Promise {\n const now = new Date().toISOString();\n const existing = await getFlow(flow.id);\n if (existing) {\n await sqlite.execute({\n sql: `UPDATE flows SET name=?, description=?, data=?, updated_at=? WHERE id=?`,\n args: [flow.name, flow.description || \"\", JSON.stringify(flow), now, flow.id]\n });\n } else {\n await sqlite.execute({\n sql: `INSERT INTO flows (id, name, description, data, created_at, updated_at) VALUES (?, ?, ?, ?, ?, ?)`,\n args: [flow.id, flow.name, flow.description || \"\", JSON.stringify(flow), now, now]\n });\n }\n}\n\nexport async function getFlow(id: string): Promise {\n const result = await sqlite.execute({\n sql: `SELECT data FROM flows WHERE id=?`,\n args: [id]\n });\n if (!result.rows.length) return null;\n return JSON.parse(result.rows[0].data as string);\n}\n\nexport async function listFlows(): Promise[]> {\n const result = await sqlite.execute(\n `SELECT id, name, description, created_at, updated_at FROM flows ORDER BY updated_at DESC`\n );\n return result.rows.map(row => ({\n id: row.id as string,\n name: row.name as string,\n description: row.description as string,\n blocks: [],\n createdAt: row.created_at as string,\n updatedAt: row.updated_at as string,\n }));\n}\n\nexport async function deleteFlow(id: string): Promise {\n await sqlite.execute({ sql: `DELETE FROM flows WHERE id=?`, args: [id] });\n}\n\n// ─── FLOW RUNS ─────────────────────────────────────────────\nexport async function saveFlowRun(run: {\n id: string; flowId: string; status: string;\n startedAt: string; finishedAt?: string;\n variables?: any; logs?: any; error?: string;\n}): Promise {\n await sqlite.execute({\n sql: `INSERT OR REPLACE INTO flow_runs \n (id, flow_id, status, started_at, finished_at, variables, logs, error) \n VALUES (?, ?, ?, ?, ?, ?, ?, ?)`,\n args: [\n run.id, run.flowId, run.status, run.startedAt,\n run.finishedAt || null,\n run.variables ? JSON.stringify(run.variables) : null,\n run.logs ? JSON.stringify(run.logs) : null,\n run.error || null\n ]\n });\n}\n\nexport async function getFlowRun(id: string): Promise {\n const result = await sqlite.execute({\n sql: `SELECT * FROM flow_runs WHERE id=?`,\n args: [id]\n });\n if (!result.rows.length) return null;\n const row = result.rows[0];\n return {\n ...row,\n variables: row.variables ? JSON.parse(row.variables as string) : {},\n logs: row.logs ? JSON.parse(row.logs as string) : [],\n };\n}\n\nexport async function listFlowRuns(flowId?: string): Promise {\n const result = flowId\n ? await sqlite.execute({\n sql: `SELECT id, flow_id, status, started_at, finished_at, error FROM flow_runs WHERE flow_id=? ORDER BY started_at DESC LIMIT 50`,\n args: [flowId]\n })\n : await sqlite.execute(\n `SELECT id, flow_id, status, started_at, finished_at, error FROM flow_runs ORDER BY started_at DESC LIMIT 50`\n );\n return result.rows;\n}\n",[160],"318ceaee-2050-11f1-a047-42dde27851f2",["D",1773566422587],2,[34],"f52e6ce2-204c-11f1-8e02-42dde27851f2","engine.ts","f52e6d8c-204c-11f1-8e02-42dde27851f2",8,["D",1773565032818],"// ============================================================\n// FLOW ENGINE - Trái tim của hệ thống, thực thi từng block\n// ============================================================\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// ─── Danh sách block theo nhóm ───────────────────────────\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// ─── 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 const logs: LogEntry[] = [];\n const log = (level: LogEntry[\"level\"], msg: string, blockId?: string, blockType?: string, data?: any) => {\n const entry: LogEntry = { timestamp: new Date().toISOString(), level, message: msg, blockId, blockType, data };\n logs.push(entry);\n console.log(`[${level.toUpperCase()}] [${blockType || \"engine\"}] ${msg}`);\n };\n\n // ─── Khởi tạo Kernel.sh browser ────────────────────────\n let browser: any;\n let kernelClient: any;\n let sessionId = \"\";\n\n try {\n log(\"info\", \"🚀 Khởi tạo Kernel.sh browser session...\");\n const Kernel = (await import(\"npm:@onkernel/sdk\")).default;\n const { chromium } = await import(\"npm:playwright-core\");\n\n kernelClient = new Kernel({ apiKey: kernelApiKey });\n const kernelBrowser = await kernelClient.browsers.create({\n invocation_type: \"persistent\",\n });\n sessionId = kernelBrowser.session_id;\n log(\"info\", `✅ Kernel session created: ${sessionId}`);\n\n browser = await chromium.connectOverCDP(kernelBrowser.cdp_ws_url);\n log(\"info\", \"✅ Playwright connected to Kernel browser\");\n } catch (err: any) {\n log(\"error\", `❌ Failed to connect to Kernel: ${err.message}`);\n return { success: false, variables: {}, logs, error: err.message };\n }\n\n // ─── Khởi tạo Context ────────────────────────────────────\n const mainPage = browser.contexts()[0]\n ? browser.contexts()[0].pages()[0] || await browser.contexts()[0].newPage()\n : await browser.newPage();\n\n const initialTabId = \"tab_main\";\n const tabs = new Map();\n tabs.set(initialTabId, mainPage);\n\n const ctx: 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 // ─── Thực thi từng block ─────────────────────────────────\n let blockIndex = 0;\n const blocks = flow.blocks;\n let success = true;\n let errorMessage = \"\";\n\n while (blockIndex < blocks.length) {\n const block = blocks[blockIndex];\n if (!block) { blockIndex++; continue; }\n\n // Bỏ qua comment\n if (block.type === \"comment\") {\n log(\"debug\", `💬 ${block.params?.text || \"\"}`, block.id, \"comment\");\n blockIndex++;\n continue;\n }\n\n log(\"info\", `▶️ Block [${blockIndex}] ${block.type}`, block.id, block.type, block.params);\n\n let result: BlockResult;\n\n try {\n if (INTERACT_BLOCKS.has(block.type)) {\n result = await executeInteractBlock(block, ctx);\n } else if (EXTRACT_BLOCKS.has(block.type)) {\n result = await executeExtractBlock(block, ctx);\n } else if (NAVIGATE_BLOCKS.has(block.type)) {\n result = await executeNavigateBlock(block, ctx);\n } else if (CONTROLFLOW_BLOCKS.has(block.type)) {\n result = await executeControlFlowBlock(block, ctx, blockIndex, blocks);\n } else if (SPREADSHEET_BLOCKS.has(block.type)) {\n result = await executeSpreadsheetBlock(block, ctx, blockIndex);\n } else if (block.type === \"run_flow\") {\n // Gọi sub-flow\n result = await runSubFlow(block, ctx, kernelApiKey, logs);\n } else {\n result = await executeUtilityBlock(block, ctx);\n }\n } catch (err: any) {\n result = { success: false, error: err.message };\n }\n\n // Xử lý kết quả\n if (!result.success) {\n const errMsg = `Block [${block.type}] failed: ${result.error}`;\n log(\"error\", errMsg, block.id, block.type);\n if (block.params?.continueOnError) {\n blockIndex++;\n continue;\n }\n success = false;\n errorMessage = errMsg;\n break;\n }\n\n if (result.output !== undefined) {\n log(\"debug\", `✅ Output: ${JSON.stringify(result.output).slice(0, 200)}`, block.id, block.type);\n }\n\n // Điều hướng index\n if (ctx.shouldBreak) {\n // Tìm block end tiếp theo và nhảy qua\n ctx.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 // ─── Dọn dẹp ────────────────────────────────────────────\n try {\n await browser.close();\n if (kernelClient && sessionId) {\n await kernelClient.browsers.deleteByID(sessionId);\n log(\"info\", \"🧹 Kernel session released\");\n }\n } catch (e: any) {\n log(\"warn\", `Cleanup warning: ${e.message}`);\n }\n\n return {\n success,\n variables: ctx.variables,\n logs,\n error: errorMessage || undefined,\n };\n}\n\n// ─── Helpers ────────────────────────────────────────────────\nfunction findNextEnd(blocks: Block[], fromIndex: number): number {\n let depth = 1;\n for (let i = fromIndex + 1; i < blocks.length; i++) {\n const t = blocks[i].type;\n if ([\"loop\", \"loop_elements\", \"loop_list_items\", \"loop_pages\",\n \"loop_spreadsheet_rows\", \"if\", \"while\"].includes(t)) depth++;\n if (t === \"end\") { depth--; if (depth === 0) return i; }\n }\n return blocks.length - 1;\n}\n\nfunction findNextEndOrElse(blocks: Block[], fromIndex: number): number {\n let depth = 1;\n for (let i = fromIndex + 1; i < blocks.length; i++) {\n const t = blocks[i].type;\n if ([\"loop\", \"loop_elements\", \"loop_list_items\", \"loop_pages\",\n \"loop_spreadsheet_rows\", \"if\", \"while\"].includes(t)) depth++;\n if (t === \"end\") { depth--; if (depth === 0) return i; }\n if (t === \"else\" && depth === 1) return i;\n }\n return blocks.length - 1;\n}\n\nasync function runSubFlow(\n block: Block,\n ctx: FlowContext,\n kernelApiKey: string,\n _logs: LogEntry[]\n): Promise {\n const flowId = 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",[171],"9ac61dae-204c-11f1-9400-42dde27851f2","blocks","10cec21b-bdeb-4c89-baf1-94f44f17e648",["D",1773564881135],"directory",[178],"pulls","branches","forks","envVars",{"_190":168,"_192":68},"connections",{"_190":68,"_191":68},"count","unfilledCount","emptyCount",{"_49":177,"_38":178,"_36":179,"_145":-5,"_47":48,"_46":168,"_147":64,"_44":268,"_13":68,"_39":181,"_41":-5,"_30":31,"_150":-5,"_206":269,"_33":270},{"_49":260,"_38":261,"_36":262,"_145":179,"_47":48,"_46":263,"_147":31,"_44":264,"_13":68,"_39":26,"_41":265,"_30":31,"_150":-5,"_206":266,"_33":267},{"_49":252,"_38":253,"_36":254,"_145":179,"_47":48,"_46":255,"_147":64,"_44":256,"_13":68,"_39":26,"_41":257,"_30":31,"_150":-5,"_206":258,"_33":259},{"_49":245,"_38":246,"_36":247,"_145":179,"_47":48,"_46":168,"_147":31,"_44":248,"_13":68,"_39":26,"_41":249,"_30":31,"_150":-5,"_206":250,"_33":251},{"_49":237,"_38":238,"_36":239,"_145":179,"_47":48,"_46":240,"_147":64,"_44":241,"_13":68,"_39":26,"_41":242,"_30":31,"_150":-5,"_206":243,"_33":244},{"_49":229,"_38":230,"_36":231,"_145":179,"_47":48,"_46":232,"_147":64,"_44":233,"_13":68,"_39":26,"_41":234,"_30":31,"_150":-5,"_206":235,"_33":236},{"_49":221,"_38":222,"_36":223,"_145":179,"_47":48,"_46":224,"_147":64,"_44":225,"_13":68,"_39":26,"_41":226,"_30":31,"_150":-5,"_206":227,"_33":228},{"_49":170,"_38":171,"_36":172,"_145":-5,"_47":48,"_46":173,"_147":31,"_44":218,"_13":68,"_39":26,"_41":175,"_30":31,"_150":-5,"_206":219,"_33":220},{"_49":166,"_38":34,"_36":37,"_145":-5,"_47":48,"_46":14,"_147":31,"_44":215,"_13":168,"_39":40,"_41":43,"_30":31,"_150":-5,"_206":216,"_33":217},{"_49":159,"_38":160,"_36":161,"_145":-5,"_47":48,"_46":162,"_147":31,"_44":212,"_13":68,"_39":26,"_41":164,"_30":31,"_150":-5,"_206":213,"_33":214},{"_49":152,"_38":153,"_36":154,"_145":-5,"_47":48,"_46":155,"_147":31,"_44":209,"_13":68,"_39":26,"_41":157,"_30":31,"_150":-5,"_206":210,"_33":211},{"_49":142,"_38":143,"_36":144,"_145":-5,"_47":48,"_46":146,"_147":64,"_44":205,"_13":68,"_39":26,"_41":149,"_30":31,"_150":-5,"_206":207,"_33":208},["D",1773565767626],"children",[],[143],["D",1773564861435],[],[153],["D",1773565048336],[],[160],["D",1773566422587],[],[34],["D",1773565032818],[],[171],"d17b8fbe-204c-11f1-bf0b-42dde27851f2","utilities.ts","d17b9086-204c-11f1-bf0b-42dde27851f2",6,["D",1773564972926],"// ============================================================\n// UTILITY BLOCKS - Tiện ích, Tabs, HTTP Request, v.v.\n// ============================================================\n\nimport type { Block, FlowContext, BlockResult } from \"../types.ts\";\n\nfunction resolvePlaceholders(value: any, variables: Record): any {\n if (typeof value !== \"string\") return value;\n return value.replace(/\\{\\{(\\w+)\\}\\}/g, (_, key) => variables[key] ?? `{{${key}}}`);\n}\n\nexport async function executeUtilityBlock(\n block: Block,\n ctx: FlowContext\n): Promise {\n const page = ctx.tabs.get(ctx.activeTabId);\n const p = block.params;\n const resolve = (v: any) => resolvePlaceholders(v, ctx.variables);\n\n try {\n switch (block.type) {\n // ─────────────────────────────────────────\n // 🪟 TABS\n // ─────────────────────────────────────────\n case \"create_tab\": {\n // params: url, tabIdVar (variable để lưu tabId)\n const newPage = await ctx.browser.newPage();\n const tabId = `tab_${Date.now()}`;\n ctx.tabs.set(tabId, newPage);\n ctx.activeTabId = tabId;\n if (p.url) {\n await newPage.goto(resolve(p.url), { waitUntil: \"domcontentloaded\" });\n }\n if (p.tabIdVar) ctx.variables[p.tabIdVar] = tabId;\n return { success: true, output: tabId };\n }\n\n case \"get_active_tab_id\": {\n // params: saveAs\n if (p.saveAs) ctx.variables[p.saveAs] = ctx.activeTabId;\n return { success: true, output: ctx.activeTabId };\n }\n\n case \"select_tab\": {\n // params: tabId (hoặc variable)\n const tabId = resolve(p.tabId);\n if (!ctx.tabs.has(tabId)) return { success: false, error: `Tab not found: ${tabId}` };\n ctx.activeTabId = tabId;\n return { success: true, output: `Active tab: ${tabId}` };\n }\n\n case \"close_tab\": {\n // params: tabId (optional, mặc định active tab)\n const tabId = p.tabId ? resolve(p.tabId) : ctx.activeTabId;\n const tabPage = ctx.tabs.get(tabId);\n if (tabPage) {\n await tabPage.close();\n ctx.tabs.delete(tabId);\n // Chuyển sang tab còn lại\n const remaining = Array.from(ctx.tabs.keys());\n if (remaining.length > 0) ctx.activeTabId = remaining[remaining.length - 1];\n }\n return { success: true, output: `Closed tab: ${tabId}` };\n }\n\n // ─────────────────────────────────────────\n // 🔧 UTILITIES\n // ─────────────────────────────────────────\n case \"run_script\": {\n // params: script (JS code), saveAs\n if (!page) return { success: false, error: \"No active page\" };\n const script = resolve(p.script);\n const result = await page.evaluate(new Function(`return (async () => { ${script} })()`));\n if (p.saveAs) ctx.variables[p.saveAs] = result;\n return { success: true, output: result };\n }\n\n case \"get_date\": {\n // params: format (iso/timestamp/locale), saveAs, timezone\n const now = new Date();\n let dateValue: string | number;\n switch (p.format) {\n case \"timestamp\": dateValue = now.getTime(); break;\n case \"locale\": dateValue = now.toLocaleString(p.locale || \"vi-VN\"); break;\n case \"date_only\": dateValue = now.toISOString().split(\"T\")[0]; break;\n case \"time_only\": dateValue = now.toTimeString().split(\" \")[0]; break;\n default: dateValue = now.toISOString();\n }\n if (p.saveAs) ctx.variables[p.saveAs] = dateValue;\n return { success: true, output: dateValue };\n }\n\n case \"wait\": {\n // params: duration (ms)\n const duration = parseInt(resolve(p.duration)) || 1000;\n await new Promise(r => setTimeout(r, duration));\n return { success: true, output: `Waited ${duration}ms` };\n }\n\n case \"wait_for_element\": {\n // params: selector, timeout, state (visible/hidden/attached/detached)\n if (!page) return { success: false, error: \"No active page\" };\n const selector = resolve(p.selector);\n const timeout = parseInt(p.timeout) || 30000;\n const state = p.state || \"visible\";\n await page.waitForSelector(selector, { timeout, state });\n return { success: true, output: `Element found: ${selector}` };\n }\n\n case \"show_alert\": {\n // params: message (chỉ log, vì headless không show alert thật)\n const message = resolve(p.message);\n console.log(`[ALERT] ${message}`);\n ctx.logs.push({\n timestamp: new Date().toISOString(),\n level: \"info\",\n blockId: block.id,\n blockType: block.type,\n message: `Alert: ${message}`\n });\n return { success: true, output: message };\n }\n\n case \"make_http_request\": {\n // params: url, method, headers, body, saveAs, saveStatusAs\n const url = resolve(p.url);\n const method = (p.method || \"GET\").toUpperCase();\n const headers: Record = {};\n if (p.headers) {\n for (const [k, v] of Object.entries(p.headers as Record)) {\n headers[k] = resolve(v);\n }\n }\n const fetchOptions: RequestInit = { method, headers };\n if (p.body && method !== \"GET\") {\n fetchOptions.body = typeof p.body === \"string\"\n ? resolve(p.body)\n : JSON.stringify(p.body);\n if (!headers[\"Content-Type\"]) headers[\"Content-Type\"] = \"application/json\";\n }\n const response = await fetch(url, fetchOptions);\n const status = response.status;\n let responseData: any;\n const contentType = response.headers.get(\"content-type\") || \"\";\n if (contentType.includes(\"application/json\")) {\n responseData = await response.json();\n } else {\n responseData = await response.text();\n }\n if (p.saveAs) ctx.variables[p.saveAs] = responseData;\n if (p.saveStatusAs) ctx.variables[p.saveStatusAs] = status;\n return { success: true, output: { status, data: responseData } };\n }\n\n case \"assert\": {\n // params: condition, message (optional)\n const condition = resolve(p.condition);\n let result: boolean;\n try {\n const fn = new Function(...Object.keys(ctx.variables), `return !!(${condition})`);\n result = fn(...Object.values(ctx.variables));\n } catch {\n result = false;\n }\n if (!result) {\n const msg = resolve(p.message) || `Assertion failed: ${condition}`;\n return { success: false, error: msg };\n }\n return { success: true, output: \"Assertion passed\" };\n }\n\n case \"comment\": {\n // params: text (chỉ ghi log, không làm gì)\n return { success: true, output: resolve(p.text || \"\") };\n }\n\n case \"solve_captcha\": {\n // params: selector, service (2captcha/anticaptcha), apiKey, saveAs\n // Tích hợp 2captcha đơn giản\n if (!page) return { success: false, error: \"No active page\" };\n const siteKey = await page.$eval(\n p.selector || \".g-recaptcha\",\n (el: Element) => el.getAttribute(\"data-sitekey\") || \"\"\n );\n if (!siteKey) return { success: false, error: \"No captcha sitekey found\" };\n const pageUrl = page.url();\n // Submit to 2captcha\n const apiKey = resolve(p.apiKey || \"\");\n const submitRes = await fetch(`https://2captcha.com/in.php?key=${apiKey}&method=userrecaptcha&googlekey=${siteKey}&pageurl=${pageUrl}&json=1`);\n const submitData = await submitRes.json();\n if (submitData.status !== 1) return { success: false, error: submitData.request };\n // Poll for result\n const taskId = submitData.request;\n let token = \"\";\n for (let i = 0; i < 30; i++) {\n await new Promise(r => setTimeout(r, 5000));\n const res = await fetch(`https://2captcha.com/res.php?key=${apiKey}&action=get&id=${taskId}&json=1`);\n const data = await res.json();\n if (data.status === 1) { token = data.request; break; }\n if (data.request !== \"CAPCHA_NOT_READY\") break;\n }\n if (!token) return { success: false, error: \"Captcha solve timeout\" };\n await page.evaluate((t: string) => {\n (document.getElementById(\"g-recaptcha-response\") as HTMLTextAreaElement).value = t;\n }, token);\n if (p.saveAs) ctx.variables[p.saveAs] = token;\n return { success: true, output: \"Captcha solved\" };\n }\n\n default:\n return { success: false, error: `Unknown utility block: ${block.type}` };\n }\n } catch (err: any) {\n return { success: false, error: err.message };\n }\n}\n",[],[178,222],"df177ea8-204c-11f1-9c7e-42dde27851f2","spreadsheet.ts","df177f84-204c-11f1-9c7e-42dde27851f2",7,["D",1773564995756],"// ============================================================\n// SPREADSHEET BLOCKS - Tích hợp Google Sheets\n// ============================================================\n\nimport type { Block, FlowContext, BlockResult, LoopFrame } from \"../types.ts\";\n\nfunction resolvePlaceholders(value: any, variables: Record): any {\n if (typeof value !== \"string\") return value;\n return value.replace(/\\{\\{(\\w+)\\}\\}/g, (_, key) => variables[key] ?? `{{${key}}}`);\n}\n\n// Helper: Gọi Google Sheets API\nasync function sheetsRequest(\n method: string,\n path: string,\n accessToken: string,\n body?: any\n) {\n const res = await fetch(`https://sheets.googleapis.com/v4/spreadsheets/${path}`, {\n method,\n headers: {\n Authorization: `Bearer ${accessToken}`,\n \"Content-Type\": \"application/json\",\n },\n body: body ? JSON.stringify(body) : undefined,\n });\n if (!res.ok) {\n const err = await res.text();\n throw new Error(`Sheets API error ${res.status}: ${err}`);\n }\n return res.json();\n}\n\nexport async function executeSpreadsheetBlock(\n block: Block,\n ctx: FlowContext,\n blockIndex: number\n): Promise {\n const p = block.params;\n const resolve = (v: any) => resolvePlaceholders(v, ctx.variables);\n const accessToken = resolve(p.accessToken || ctx.variables[\"__sheets_token__\"] || \"\");\n const spreadsheetId = resolve(p.spreadsheetId || ctx.variables[\"__sheets_id__\"] || \"\");\n const sheetName = resolve(p.sheetName || \"Sheet1\");\n\n try {\n switch (block.type) {\n case \"loop_spreadsheet_rows\": {\n // params: spreadsheetId, sheetName, accessToken, rowVar, indexVar, startRow\n const range = `${sheetName}!A1:ZZ`;\n const data = await sheetsRequest(\"GET\",\n `${spreadsheetId}/values/${encodeURIComponent(range)}`, accessToken\n );\n const rows: string[][] = data.values || [];\n const headers = rows[0] || [];\n const dataRows = rows.slice(parseInt(p.startRow || \"1\"));\n\n // Chuyển thành array of objects\n const items = dataRows.map(row =>\n headers.reduce((obj, header, i) => {\n obj[header] = row[i] || \"\";\n return obj;\n }, {} as Record)\n );\n\n const frame: LoopFrame = {\n type: \"loop_spreadsheet_rows\",\n startIndex: blockIndex,\n currentIteration: 0,\n maxIterations: items.length,\n items,\n currentItem: items[0],\n };\n ctx.loopStack.push(frame);\n if (p.rowVar) ctx.variables[p.rowVar] = items[0] || {};\n if (p.indexVar) ctx.variables[p.indexVar] = 0;\n ctx.variables[\"__sheets_rows__\"] = items;\n return { success: true, output: `Loop ${items.length} rows` };\n }\n\n case \"add_spreadsheet_row\": {\n // params: spreadsheetId, sheetName, accessToken, values (object hoặc array)\n let rowValues: any[];\n if (Array.isArray(p.values)) {\n rowValues = p.values.map((v: any) => resolve(v));\n } else if (typeof p.values === \"object\") {\n rowValues = Object.values(p.values).map((v: any) => resolve(String(v)));\n } else {\n rowValues = [resolve(p.values)];\n }\n const range = `${sheetName}!A1`;\n await sheetsRequest(\"POST\",\n `${spreadsheetId}/values/${encodeURIComponent(range)}:append?valueInputOption=USER_ENTERED`,\n accessToken,\n { values: [rowValues] }\n );\n return { success: true, output: \"Row added\" };\n }\n\n case \"update_spreadsheet_row\": {\n // params: spreadsheetId, sheetName, accessToken, rowNumber, values\n const rowNumber = parseInt(resolve(p.rowNumber));\n let rowValues: any[];\n if (Array.isArray(p.values)) {\n rowValues = p.values.map((v: any) => resolve(v));\n } else if (typeof p.values === \"object\") {\n rowValues = Object.values(p.values).map((v: any) => resolve(String(v)));\n } else {\n rowValues = [resolve(p.values)];\n }\n const range = `${sheetName}!A${rowNumber}`;\n await sheetsRequest(\"PUT\",\n `${spreadsheetId}/values/${encodeURIComponent(range)}?valueInputOption=USER_ENTERED`,\n accessToken,\n { values: [rowValues] }\n );\n return { success: true, output: `Row ${rowNumber} updated` };\n }\n\n case \"find_spreadsheet_row\": {\n // params: spreadsheetId, sheetName, accessToken, column, value, saveAs, saveRowNumberAs\n const range = `${sheetName}!A1:ZZ`;\n const data = await sheetsRequest(\"GET\",\n `${spreadsheetId}/values/${encodeURIComponent(range)}`, accessToken\n );\n const rows: string[][] = data.values || [];\n const headers = rows[0] || [];\n const searchColumn = resolve(p.column);\n const searchValue = resolve(p.value);\n const colIndex = headers.indexOf(searchColumn);\n if (colIndex === -1) return { success: false, error: `Column not found: ${searchColumn}` };\n\n for (let i = 1; i < rows.length; i++) {\n if (rows[i][colIndex] === searchValue) {\n const rowObj = headers.reduce((obj, h, idx) => {\n obj[h] = rows[i][idx] || \"\";\n return obj;\n }, {} as Record);\n if (p.saveAs) ctx.variables[p.saveAs] = rowObj;\n if (p.saveRowNumberAs) ctx.variables[p.saveRowNumberAs] = i + 1;\n return { success: true, output: rowObj };\n }\n }\n if (p.saveAs) ctx.variables[p.saveAs] = null;\n return { success: true, output: null };\n }\n\n default:\n return { success: false, error: `Unknown spreadsheet block: ${block.type}` };\n }\n } catch (err: any) {\n return { success: false, error: err.message };\n }\n}\n",[],[178,230],"aa05b572-204c-11f1-abf1-42dde27851f2","navigate.ts","aa05b72a-204c-11f1-abf1-42dde27851f2",4,["D",1773564906723],"// ============================================================\n// NAVIGATE BLOCKS - Điều hướng trình duyệt\n// ============================================================\n\nimport type { Block, FlowContext, BlockResult } from \"../types.ts\";\n\nfunction resolvePlaceholders(value: any, variables: Record): any {\n if (typeof value !== \"string\") return value;\n return value.replace(/\\{\\{(\\w+)\\}\\}/g, (_, key) => variables[key] ?? `{{${key}}}`);\n}\n\nexport async function executeNavigateBlock(\n block: Block,\n ctx: FlowContext\n): Promise {\n const page = ctx.tabs.get(ctx.activeTabId);\n if (!page) return { success: false, error: \"No active page/tab\" };\n\n const p = block.params;\n const resolve = (v: any) => resolvePlaceholders(v, ctx.variables);\n\n try {\n switch (block.type) {\n case \"visit\": {\n // params: url, waitUntil (load/domcontentloaded/networkidle)\n const url = resolve(p.url);\n await page.goto(url, {\n waitUntil: p.waitUntil || \"domcontentloaded\",\n timeout: p.timeout || 30000\n });\n const finalUrl = page.url();\n if (p.saveAs) ctx.variables[p.saveAs] = finalUrl;\n return { success: true, output: finalUrl };\n }\n\n case \"go_back\": {\n await page.goBack({ waitUntil: p.waitUntil || \"domcontentloaded\" });\n return { success: true, output: page.url() };\n }\n\n case \"go_forward\": {\n await page.goForward({ waitUntil: p.waitUntil || \"domcontentloaded\" });\n return { success: true, output: page.url() };\n }\n\n case \"reload_page\": {\n await page.reload({ waitUntil: p.waitUntil || \"domcontentloaded\" });\n return { success: true, output: page.url() };\n }\n\n default:\n return { success: false, error: `Unknown navigate block: ${block.type}` };\n }\n } catch (err: any) {\n return { success: false, error: err.message };\n }\n}\n",[],[178,238],"9ac5f252-204c-11f1-9400-42dde27851f2","interact.ts","9ac5f360-204c-11f1-9400-42dde27851f2",["D",1773564881135],"// ============================================================\n// INTERACT BLOCKS - Tương tác với trang web\n// ============================================================\n\nimport type { Block, FlowContext, BlockResult } from \"../types.ts\";\n\nfunction resolvePlaceholders(value: any, variables: Record): any {\n if (typeof value !== \"string\") return value;\n return value.replace(/\\{\\{(\\w+)\\}\\}/g, (_, key) => variables[key] ?? `{{${key}}}`);\n}\n\nexport async function executeInteractBlock(\n block: Block,\n ctx: FlowContext\n): Promise {\n const page = ctx.tabs.get(ctx.activeTabId);\n if (!page) return { success: false, error: \"No active page/tab\" };\n\n const p = block.params;\n const resolve = (v: any) => resolvePlaceholders(v, ctx.variables);\n\n try {\n switch (block.type) {\n case \"click\": {\n // params: selector, button (left/right/middle), clickCount, waitAfter\n const selector = resolve(p.selector);\n const button = p.button || \"left\";\n const clickCount = p.clickCount || 1;\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n await page.click(selector, { button, clickCount });\n if (p.waitAfter) await new Promise(r => setTimeout(r, p.waitAfter));\n return { success: true, output: `Clicked: ${selector}` };\n }\n\n case \"type_text\": {\n // params: selector, text, clearFirst, delay\n const selector = resolve(p.selector);\n const text = resolve(p.text);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n if (p.clearFirst) {\n await page.click(selector, { clickCount: 3 });\n await page.keyboard.press(\"Backspace\");\n }\n await page.type(selector, text, { delay: p.delay || 0 });\n return { success: true, output: `Typed \"${text}\" into ${selector}` };\n }\n\n case \"press_key\": {\n // params: key (Enter, Tab, ArrowDown, Escape, etc.), selector (optional)\n const key = resolve(p.key);\n if (p.selector) {\n await page.focus(resolve(p.selector));\n }\n await page.keyboard.press(key);\n return { success: true, output: `Pressed key: ${key}` };\n }\n\n case \"scroll\": {\n // params: selector (optional), x, y, direction (up/down/left/right), distance\n if (p.selector) {\n const selector = resolve(p.selector);\n await page.evaluate((sel: string, dist: number) => {\n const el = document.querySelector(sel);\n if (el) el.scrollBy(0, dist);\n }, selector, p.distance || 300);\n } else {\n const x = p.x || 0;\n const y = p.y || 300;\n await page.evaluate((scrollX: number, scrollY: number) => {\n window.scrollBy(scrollX, scrollY);\n }, x, y);\n }\n return { success: true, output: \"Scrolled\" };\n }\n\n case \"hover\": {\n // params: selector\n const selector = resolve(p.selector);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n await page.hover(selector);\n return { success: true, output: `Hovered: ${selector}` };\n }\n\n case \"select_option\": {\n // params: selector, value (hoặc label hoặc index)\n const selector = resolve(p.selector);\n const value = resolve(p.value);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n if (p.byLabel) {\n await page.selectOption(selector, { label: value });\n } else if (p.byIndex !== undefined) {\n await page.selectOption(selector, { index: p.byIndex });\n } else {\n await page.selectOption(selector, { value });\n }\n return { success: true, output: `Selected option: ${value}` };\n }\n\n case \"set_date_input\": {\n // params: selector, date (YYYY-MM-DD format)\n const selector = resolve(p.selector);\n const date = resolve(p.date);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n await page.fill(selector, date);\n return { success: true, output: `Set date: ${date}` };\n }\n\n case \"upload_file\": {\n // params: selector, filePath (hoặc fileUrl)\n const selector = resolve(p.selector);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n if (p.filePath) {\n await page.setInputFiles(selector, resolve(p.filePath));\n }\n return { success: true, output: `Uploaded file to: ${selector}` };\n }\n\n case \"handle_dialog\": {\n // params: action (accept/dismiss), promptText (for prompt dialogs)\n const action = p.action || \"accept\";\n const promptText = resolve(p.promptText || \"\");\n page.once(\"dialog\", async (dialog: any) => {\n if (action === \"accept\") {\n await dialog.accept(promptText);\n } else {\n await dialog.dismiss();\n }\n });\n return { success: true, output: `Dialog handler set: ${action}` };\n }\n\n default:\n return { success: false, error: `Unknown interact block: ${block.type}` };\n }\n } catch (err: any) {\n return { success: false, error: err.message };\n }\n}\n",[],[178,246],"a4c69a68-204c-11f1-9c7e-42dde27851f2","extract.ts","a4c69b30-204c-11f1-9c7e-42dde27851f2",3,["D",1773564897920],"// ============================================================\n// EXTRACT BLOCKS - Trích xuất dữ liệu từ trang web\n// ============================================================\n\nimport type { Block, FlowContext, BlockResult } from \"../types.ts\";\n\nfunction resolvePlaceholders(value: any, variables: Record): any {\n if (typeof value !== \"string\") return value;\n return value.replace(/\\{\\{(\\w+)\\}\\}/g, (_, key) => variables[key] ?? `{{${key}}}`);\n}\n\nexport async function executeExtractBlock(\n block: Block,\n ctx: FlowContext\n): Promise {\n const page = ctx.tabs.get(ctx.activeTabId);\n if (!page) return { success: false, error: \"No active page/tab\" };\n\n const p = block.params;\n const resolve = (v: any) => resolvePlaceholders(v, ctx.variables);\n\n try {\n switch (block.type) {\n case \"get_element_text\": {\n // params: selector, saveAs (variable name), multiple (boolean)\n const selector = resolve(p.selector);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n let text: string | string[];\n if (p.multiple) {\n text = await page.$$eval(selector, (els: Element[]) =>\n els.map(el => el.textContent?.trim() || \"\")\n );\n } else {\n text = await page.$eval(selector, (el: Element) => el.textContent?.trim() || \"\");\n }\n if (p.saveAs) ctx.variables[p.saveAs] = text;\n return { success: true, output: text };\n }\n\n case \"get_link_url\": {\n // params: selector, saveAs\n const selector = resolve(p.selector);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n const url = await page.$eval(selector, (el: Element) =>\n (el as HTMLAnchorElement).href || el.getAttribute(\"href\") || \"\"\n );\n if (p.saveAs) ctx.variables[p.saveAs] = url;\n return { success: true, output: url };\n }\n\n case \"get_page_url\": {\n // params: saveAs\n const url = page.url();\n if (p.saveAs) ctx.variables[p.saveAs] = url;\n return { success: true, output: url };\n }\n\n case \"get_element_attribute\": {\n // params: selector, attribute, saveAs\n const selector = resolve(p.selector);\n const attribute = resolve(p.attribute);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n const value = await page.getAttribute(selector, attribute);\n if (p.saveAs) ctx.variables[p.saveAs] = value;\n return { success: true, output: value };\n }\n\n case \"get_element_html\": {\n // params: selector, saveAs, outer (boolean - outerHTML vs innerHTML)\n const selector = resolve(p.selector);\n await page.waitForSelector(selector, { timeout: p.timeout || 10000 });\n const html = await page.$eval(selector, (el: Element, outer: boolean) =>\n outer ? el.outerHTML : el.innerHTML\n , p.outer || false);\n if (p.saveAs) ctx.variables[p.saveAs] = html;\n return { success: true, output: html };\n }\n\n case \"get_clipboard\": {\n // params: saveAs\n const text = await page.evaluate(() => navigator.clipboard.readText());\n if (p.saveAs) ctx.variables[p.saveAs] = text;\n return { success: true, output: text };\n }\n\n case \"save_file\": {\n // params: url (hoặc selector), filename, saveAs (path variable)\n const url = resolve(p.url);\n const response = await page.evaluate(async (fileUrl: string) => {\n const res = await fetch(fileUrl);\n const blob = await res.blob();\n return { size: blob.size, type: blob.type };\n }, url);\n if (p.saveAs) ctx.variables[p.saveAs] = url;\n return { success: true, output: { url, ...response } };\n }\n\n case \"take_screenshot\": {\n // params: saveAs (variable name for base64), selector (optional - screenshot element)\n let screenshotBuffer: Buffer;\n if (p.selector) {\n const element = await page.$(resolve(p.selector));\n screenshotBuffer = await element?.screenshot({ type: \"png\" });\n } else {\n screenshotBuffer = await page.screenshot({\n type: \"png\",\n fullPage: p.fullPage || false\n });\n }\n const base64 = Buffer.from(screenshotBuffer).toString(\"base64\");\n const dataUrl = `data:image/png;base64,${base64}`;\n if (p.saveAs) ctx.variables[p.saveAs] = dataUrl;\n return { success: true, output: dataUrl };\n }\n\n case \"generate_pdf\": {\n // params: saveAs, format, margin\n const pdfBuffer = await page.pdf({\n format: p.format || \"A4\",\n margin: p.margin || { top: \"1cm\", bottom: \"1cm\", left: \"1cm\", right: \"1cm\" },\n printBackground: p.printBackground !== false\n });\n const base64 = Buffer.from(pdfBuffer).toString(\"base64\");\n const dataUrl = `data:application/pdf;base64,${base64}`;\n if (p.saveAs) ctx.variables[p.saveAs] = dataUrl;\n return { success: true, output: dataUrl };\n }\n\n default:\n return { success: false, error: `Unknown extract block: ${block.type}` };\n }\n } catch (err: any) {\n return { success: false, error: err.message };\n }\n}\n",[],[178,253],"bd179162-204c-11f1-bf0b-42dde27851f2","controlflow.ts","bd179216-204c-11f1-bf0b-42dde27851f2",5,["D",1773564938713],"// ============================================================\n// CONTROL FLOW BLOCKS - Điều khiển luồng thực thi\n// ============================================================\n\nimport type { Block, FlowContext, BlockResult, LoopFrame } from \"../types.ts\";\n\nfunction resolvePlaceholders(value: any, variables: Record): any {\n if (typeof value !== \"string\") return value;\n return value.replace(/\\{\\{(\\w+)\\}\\}/g, (_, key) => variables[key] ?? `{{${key}}}`);\n}\n\nfunction evaluateCondition(condition: string, variables: Record): boolean {\n try {\n const resolved = resolvePlaceholders(condition, variables);\n // Safe eval với các operator cơ bản\n const fn = new Function(...Object.keys(variables), `return !!(${resolved})`);\n return fn(...Object.values(variables));\n } catch {\n return false;\n }\n}\n\nexport async function executeControlFlowBlock(\n block: Block,\n ctx: FlowContext,\n blockIndex: number,\n allBlocks: Block[]\n): Promise {\n const p = block.params;\n const resolve = (v: any) => resolvePlaceholders(v, ctx.variables);\n const page = ctx.tabs.get(ctx.activeTabId);\n\n try {\n switch (block.type) {\n case \"loop\": {\n // params: count, itemVar (tên biến lưu index hiện tại)\n const count = parseInt(resolve(p.count)) || 1;\n const frame: LoopFrame = {\n type: \"loop\",\n startIndex: blockIndex,\n currentIteration: 0,\n maxIterations: count,\n };\n ctx.loopStack.push(frame);\n if (p.itemVar) ctx.variables[p.itemVar] = 0;\n return { success: true, output: `Loop started: 0/${count}` };\n }\n\n case \"loop_elements\": {\n // params: selector, itemVar (tên biến lưu element index), countVar\n if (!page) return { success: false, error: \"No active page\" };\n const selector = resolve(p.selector);\n const elements = await page.$$(selector);\n const frame: LoopFrame = {\n type: \"loop_elements\",\n startIndex: blockIndex,\n currentIteration: 0,\n maxIterations: elements.length,\n items: elements,\n };\n ctx.loopStack.push(frame);\n if (p.itemVar) ctx.variables[p.itemVar] = 0;\n if (p.countVar) ctx.variables[p.countVar] = elements.length;\n return { success: true, output: `Loop elements: ${elements.length} items` };\n }\n\n case \"loop_list_items\": {\n // params: listVar (tên biến chứa array), itemVar (tên biến cho từng item), indexVar\n const list = ctx.variables[p.listVar] || [];\n const frame: LoopFrame = {\n type: \"loop_list_items\",\n startIndex: blockIndex,\n currentIteration: 0,\n maxIterations: list.length,\n items: list,\n currentItem: list[0],\n };\n ctx.loopStack.push(frame);\n if (p.itemVar) ctx.variables[p.itemVar] = list[0];\n if (p.indexVar) ctx.variables[p.indexVar] = 0;\n return { success: true, output: `Loop list: ${list.length} items` };\n }\n\n case \"loop_pages\": {\n // params: nextSelector (selector của nút Next), maxPages, pageVar\n const frame: LoopFrame = {\n type: \"loop_pages\",\n startIndex: blockIndex,\n currentIteration: 0,\n maxIterations: parseInt(p.maxPages) || 100,\n };\n ctx.loopStack.push(frame);\n if (p.pageVar) ctx.variables[p.pageVar] = 1;\n return { success: true, output: \"Loop pages started\" };\n }\n\n case \"if\": {\n // params: condition (expression), variable, operator, value\n let result: boolean;\n if (p.condition) {\n result = evaluateCondition(resolve(p.condition), ctx.variables);\n } else {\n const varValue = ctx.variables[p.variable];\n const compareValue = resolve(p.value);\n switch (p.operator) {\n case \"==\": result = varValue == compareValue; break;\n case \"!=\": result = varValue != compareValue; break;\n case \">\": result = Number(varValue) > Number(compareValue); break;\n case \"<\": result = Number(varValue) < Number(compareValue); break;\n case \">=\": result = Number(varValue) >= Number(compareValue); break;\n case \"<=\": result = Number(varValue) <= Number(compareValue); break;\n case \"contains\": result = String(varValue).includes(String(compareValue)); break;\n case \"not_contains\": result = !String(varValue).includes(String(compareValue)); break;\n case \"is_empty\": result = !varValue || varValue === \"\"; break;\n case \"is_not_empty\": result = !!varValue && varValue !== \"\"; break;\n default: result = false;\n }\n }\n ctx.variables[\"__if_result__\"] = result;\n return { success: true, output: result, skipToEnd: !result };\n }\n\n case \"else\": {\n // Nếu if_result là true, skip đến end\n const ifResult = ctx.variables[\"__if_result__\"];\n return { success: true, skipToEnd: !!ifResult };\n }\n\n case \"while\": {\n // params: condition\n const condition = resolve(p.condition);\n const shouldContinue = evaluateCondition(condition, ctx.variables);\n if (!shouldContinue) {\n return { success: true, output: \"While condition false, skipping\", skipToEnd: true };\n }\n const frame: LoopFrame = {\n type: \"while\",\n startIndex: blockIndex,\n currentIteration: 0,\n condition: p.condition,\n };\n ctx.loopStack.push(frame);\n return { success: true, output: \"While loop started\" };\n }\n\n case \"end\": {\n // Kết thúc loop hoặc if\n const frame = ctx.loopStack[ctx.loopStack.length - 1];\n if (!frame) return { success: true, output: \"End (no loop)\" };\n\n frame.currentIteration++;\n\n // Kiểm tra có tiếp tục loop không\n if (frame.type === \"loop\" || frame.type === \"loop_elements\" ||\n frame.type === \"loop_list_items\" || frame.type === \"loop_spreadsheet_rows\") {\n if (frame.currentIteration < (frame.maxIterations || 0)) {\n // Cập nhật biến vòng lặp\n if (block.params.itemVar) {\n ctx.variables[block.params.itemVar] = frame.currentIteration;\n }\n if (frame.items && frame.type === \"loop_list_items\") {\n const itemVarName = findLoopBlockParam(allBlocks, frame.startIndex, \"itemVar\");\n const indexVarName = findLoopBlockParam(allBlocks, frame.startIndex, \"indexVar\");\n if (itemVarName) ctx.variables[itemVarName] = frame.items[frame.currentIteration];\n if (indexVarName) ctx.variables[indexVarName] = frame.currentIteration;\n }\n return { success: true, jumpToIndex: frame.startIndex + 1 };\n } else {\n ctx.loopStack.pop();\n return { success: true, output: \"Loop completed\" };\n }\n }\n\n if (frame.type === \"loop_pages\") {\n const nextSelector = allBlocks[frame.startIndex]?.params?.nextSelector;\n if (nextSelector && page) {\n const nextBtn = await page.$(nextSelector);\n const isDisabled = nextBtn ? await page.$eval(nextSelector,\n (el: Element) => (el as HTMLButtonElement).disabled ||\n el.classList.contains(\"disabled\")\n ) : true;\n if (!isDisabled && frame.currentIteration < (frame.maxIterations || 100)) {\n await page.click(nextSelector);\n await page.waitForLoadState(\"domcontentloaded\");\n const pageVarName = findLoopBlockParam(allBlocks, frame.startIndex, \"pageVar\");\n if (pageVarName) ctx.variables[pageVarName] = frame.currentIteration + 2;\n return { success: true, jumpToIndex: frame.startIndex + 1 };\n }\n }\n ctx.loopStack.pop();\n return { success: true, output: \"Loop pages completed\" };\n }\n\n if (frame.type === \"while\") {\n const condition = frame.condition || \"\";\n const shouldContinue = evaluateCondition(resolvePlaceholders(condition, ctx.variables), ctx.variables);\n if (shouldContinue) {\n return { success: true, jumpToIndex: frame.startIndex + 1 };\n }\n ctx.loopStack.pop();\n return { success: true, output: \"While completed\" };\n }\n\n ctx.loopStack.pop();\n return { success: true };\n }\n\n case \"break\": {\n ctx.shouldBreak = true;\n ctx.loopStack.pop();\n return { success: true, skipToEnd: true };\n }\n\n default:\n return { success: false, error: `Unknown control flow block: ${block.type}` };\n }\n } catch (err: any) {\n return { success: false, error: err.message };\n }\n}\n\nfunction findLoopBlockParam(blocks: Block[], startIndex: number, param: string): string | undefined {\n return blocks[startIndex]?.params?.[param];\n}\n",[],[178,261],["D",1773564881135],[194,195,196,197,198,199],[178],["D",1773564845585],["D",1789528252206],{"_105":104,"_113":109},{"_105":104,"_106":107,"_108":109,"_19":-5,"_110":111,"_112":31},{"_13":94,"_38":95,"_49":48,"_96":50,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":-5,"_102":51,"_103":104},"ctx",{"_87":-5,"_133":309,"_310":311,"_312":313,"_314":31,"_315":31,"_316":31,"_317":64,"_318":-5,"_319":-7,"_320":-7,"_321":68,"_322":31,"_323":31,"_324":-5,"_325":31,"_326":31,"_327":31,"_328":-5},"ENV",{"_280":281,"_282":283,"_284":95,"_285":286,"_287":288,"_289":290,"_291":292,"_293":294,"_295":296,"_297":298,"_299":300,"_301":302,"_303":304,"_305":306,"_307":308},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","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","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

🔑 API Keys

🌐 Endpoint

📦 Block Stats

ℹ️ About

➕ Add Block

📥 Import Flow JSON

🔑 API Keys

🌐 API Endpoint

📦 Block Stats

ℹ️ About

➕ Add Block

📥 Import Flow JSON

Diff · v13