vodorod/Dorod-Sky
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

frontend support cdp for task and workflow (#3231)

Browse Source
This commit is contained in:
LawyZheng
2025-08-21 12:26:12 +08:00
committed by GitHub
parent c0a31fe0a6
commit 0de18f9a88
8 changed files with 99 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
skyvern-frontend/src/api/types.ts
View File

@@ -147,6 +147,7 @@ export type CreateTaskRequest = {
application?: string | null; application?: string | null;
include_action_history_in_verification?: boolean | null; include_action_history_in_verification?: boolean | null;
max_screenshot_scrolls?: number | null; max_screenshot_scrolls?: number | null;
browser_address?: string | null;
}; };
export type User = { export type User = {

31
skyvern-frontend/src/routes/tasks/create/CreateNewTaskForm.tsx
View File

@@ -90,6 +90,7 @@ function createTaskRequestObject(
extracted_information_schema: extractedInformationSchema, extracted_information_schema: extractedInformationSchema,
extra_http_headers: extraHttpHeaders, extra_http_headers: extraHttpHeaders,
totp_identifier: transform(formValues.totpIdentifier), totp_identifier: transform(formValues.totpIdentifier),
browser_address: transform(formValues.cdpAddress),
error_code_mapping: errorCodeMapping, error_code_mapping: errorCodeMapping,
max_screenshot_scrolls: formValues.maxScreenshotScrolls, max_screenshot_scrolls: formValues.maxScreenshotScrolls,
include_action_history_in_verification: include_action_history_in_verification:
@@ -127,6 +128,7 @@ function CreateNewTaskForm({ initialValues }: Props) {
maxStepsOverride: initialValues.maxStepsOverride ?? null, maxStepsOverride: initialValues.maxStepsOverride ?? null,
proxyLocation: initialValues.proxyLocation ?? ProxyLocation.Residential, proxyLocation: initialValues.proxyLocation ?? ProxyLocation.Residential,
maxScreenshotScrolls: initialValues.maxScreenshotScrolls ?? null, maxScreenshotScrolls: initialValues.maxScreenshotScrolls ?? null,
cdpAddress: initialValues.cdpAddress ?? null,
}, },
}); });
const { errors } = useFormState({ control: form.control }); const { errors } = useFormState({ control: form.control });
@@ -695,6 +697,35 @@ function CreateNewTaskForm({ initialValues }: Props) {
</FormItem> </FormItem>
)} )}
/> />
<FormField
control={form.control}
name="cdpAddress"
render={({ field }) => (
<FormItem>
<div className="flex gap-16">
<FormLabel>
<div className="w-72">
<h1 className="text-lg">Browser Address</h1>
<h2 className="text-base text-slate-400">
The address of the Browser server to use for the
task run.
</h2>
</div>
</FormLabel>
<div className="w-full">
<FormControl>
<Input
{...field}
placeholder="http://127.0.0.1:9222"
value={field.value === null ? "" : field.value}
/>
</FormControl>
<FormMessage />
</div>
</div>
</FormItem>
)}
/>
</div> </div>
</div> </div>
)} )}

2
skyvern-frontend/src/routes/tasks/create/CreateNewTaskFormPage.tsx
View File

@@ -64,6 +64,7 @@ function CreateNewTaskFormPage() {
includeActionHistoryInVerification: null, includeActionHistoryInVerification: null,
maxScreenshotScrolls: null, maxScreenshotScrolls: null,
extraHttpHeaders: null, extraHttpHeaders: null,
cdpAddress: null,
}} }}
/> />
</div> </div>
@@ -137,6 +138,7 @@ function CreateNewTaskFormPage() {
extraHttpHeaders: data.extra_http_headers extraHttpHeaders: data.extra_http_headers
? JSON.stringify(data.extra_http_headers) ? JSON.stringify(data.extra_http_headers)
: null, : null,
cdpAddress: null,
}} }}
/> />
</div> </div>

18
skyvern-frontend/src/routes/tasks/create/PromptBox.tsx
View File

@@ -155,6 +155,7 @@ function PromptBox() {
ProxyLocation.Residential, ProxyLocation.Residential,
); );
const [browserSessionId, setBrowserSessionId] = useState<string | null>(null); const [browserSessionId, setBrowserSessionId] = useState<string | null>(null);
const [cdpAddress, setCdpAddress] = useState<string | null>(null);
const [publishWorkflow, setPublishWorkflow] = useState(false); const [publishWorkflow, setPublishWorkflow] = useState(false);
const [totpIdentifier, setTotpIdentifier] = useState(""); const [totpIdentifier, setTotpIdentifier] = useState("");
const [maxStepsOverride, setMaxStepsOverride] = useState<string | null>(null); const [maxStepsOverride, setMaxStepsOverride] = useState<string | null>(null);
@@ -175,6 +176,7 @@ function PromptBox() {
webhook_callback_url: webhookCallbackUrl, webhook_callback_url: webhookCallbackUrl,
proxy_location: proxyLocation, proxy_location: proxyLocation,
browser_session_id: browserSessionId, browser_session_id: browserSessionId,
browser_address: cdpAddress,
totp_identifier: totpIdentifier, totp_identifier: totpIdentifier,
publish_workflow: publishWorkflow, publish_workflow: publishWorkflow,
max_screenshot_scrolls: maxScreenshotScrolls, max_screenshot_scrolls: maxScreenshotScrolls,
@@ -412,6 +414,22 @@ function PromptBox() {
}} }}
/> />
</div> </div>
<div className="flex gap-16">
<div className="w-48 shrink-0">
<div className="text-sm">Browser Address</div>
<div className="text-xs text-slate-400">
The address of the Browser server to use for the task
run.
</div>
</div>
<Input
value={cdpAddress ?? ""}
placeholder="http://127.0.0.1:9222"
onChange={(event) => {
setCdpAddress(event.target.value);
}}
/>
</div>
<div className="flex gap-16"> <div className="flex gap-16">
<div className="w-48 shrink-0"> <div className="w-48 shrink-0">
<div className="text-sm">2FA Identifier</div> <div className="text-sm">2FA Identifier</div>

1
skyvern-frontend/src/routes/tasks/create/retry/RetryTask.tsx
View File

@@ -48,6 +48,7 @@ function RetryTask() {
extraHttpHeaders: task.request.extra_http_headers extraHttpHeaders: task.request.extra_http_headers
? JSON.stringify(task.request.extra_http_headers) ? JSON.stringify(task.request.extra_http_headers)
: null, : null,
cdpAddress: task.request.browser_address ?? null,
}} }}
/> />
</div> </div>

1
skyvern-frontend/src/routes/tasks/create/taskFormTypes.ts
View File

@@ -13,6 +13,7 @@ const createNewTaskFormSchemaBase = z.object({
extraHttpHeaders: z.string().or(z.null()), extraHttpHeaders: z.string().or(z.null()),
maxStepsOverride: z.number().or(z.null()).optional(), maxStepsOverride: z.number().or(z.null()).optional(),
totpIdentifier: z.string().or(z.null()), totpIdentifier: z.string().or(z.null()),
cdpAddress: z.string().or(z.null()),
errorCodeMapping: z.string().or(z.null()), errorCodeMapping: z.string().or(z.null()),
proxyLocation: z.nativeEnum(ProxyLocation).or(z.null()), proxyLocation: z.nativeEnum(ProxyLocation).or(z.null()),
includeActionHistoryInVerification: z.boolean().or(z.null()).default(false), includeActionHistoryInVerification: z.boolean().or(z.null()).default(false),

44
skyvern-frontend/src/routes/workflows/RunWorkflowForm.tsx
View File

@@ -38,6 +38,7 @@ type Props = {
initialSettings: { initialSettings: {
proxyLocation: ProxyLocation; proxyLocation: ProxyLocation;
webhookCallbackUrl: string; webhookCallbackUrl: string;
cdpAddress: string | null;
maxScreenshotScrolls: number | null; maxScreenshotScrolls: number | null;
extraHttpHeaders: Record<string, string> | null; extraHttpHeaders: Record<string, string> | null;
}; };
@@ -81,6 +82,7 @@ type RunWorkflowRequestBody = {
browser_session_id: string | null; browser_session_id: string | null;
max_screenshot_scrolls?: number | null; max_screenshot_scrolls?: number | null;
extra_http_headers?: Record<string, string> | null; extra_http_headers?: Record<string, string> | null;
browser_address?: string | null;
}; };
function getRunWorkflowRequestBody( function getRunWorkflowRequestBody(
@@ -91,6 +93,7 @@ function getRunWorkflowRequestBody(
webhookCallbackUrl, webhookCallbackUrl,
proxyLocation, proxyLocation,
browserSessionId, browserSessionId,
cdpAddress,
maxScreenshotScrolls, maxScreenshotScrolls,
extraHttpHeaders, extraHttpHeaders,
...parameters ...parameters
@@ -107,6 +110,7 @@ function getRunWorkflowRequestBody(
data: parsedParameters, data: parsedParameters,
proxy_location: proxyLocation, proxy_location: proxyLocation,
browser_session_id: bsi, browser_session_id: bsi,
browser_address: cdpAddress,
}; };
if (maxScreenshotScrolls) { if (maxScreenshotScrolls) {
@@ -133,6 +137,7 @@ type RunWorkflowFormType = Record<string, unknown> & {
webhookCallbackUrl: string; webhookCallbackUrl: string;
proxyLocation: ProxyLocation; proxyLocation: ProxyLocation;
browserSessionId: string | null; browserSessionId: string | null;
cdpAddress: string | null;
maxScreenshotScrolls: number | null; maxScreenshotScrolls: number | null;
extraHttpHeaders: string | null; extraHttpHeaders: string | null;
}; };
@@ -156,6 +161,7 @@ function RunWorkflowForm({
webhookCallbackUrl: initialSettings.webhookCallbackUrl, webhookCallbackUrl: initialSettings.webhookCallbackUrl,
proxyLocation: initialSettings.proxyLocation, proxyLocation: initialSettings.proxyLocation,
browserSessionId: browserSessionIdDefault, browserSessionId: browserSessionIdDefault,
cdpAddress: initialSettings.cdpAddress,
maxScreenshotScrolls: initialSettings.maxScreenshotScrolls, maxScreenshotScrolls: initialSettings.maxScreenshotScrolls,
extraHttpHeaders: initialSettings.extraHttpHeaders extraHttpHeaders: initialSettings.extraHttpHeaders
? JSON.stringify(initialSettings.extraHttpHeaders) ? JSON.stringify(initialSettings.extraHttpHeaders)
@@ -208,6 +214,7 @@ function RunWorkflowForm({
browserSessionId, browserSessionId,
maxScreenshotScrolls, maxScreenshotScrolls,
extraHttpHeaders, extraHttpHeaders,
cdpAddress,
...parameters ...parameters
} = values; } = values;
@@ -222,6 +229,7 @@ function RunWorkflowForm({
browserSessionId, browserSessionId,
maxScreenshotScrolls, maxScreenshotScrolls,
extraHttpHeaders, extraHttpHeaders,
cdpAddress,
}); });
} }
@@ -425,6 +433,42 @@ function RunWorkflowForm({
); );
}} }}
/> />
<FormField
key="cdpAddress"
control={form.control}
name="cdpAddress"
render={({ field }) => {
return (
<FormItem>
<div className="flex gap-16">
<FormLabel>
<div className="w-72">
<div className="flex items-center gap-2 text-lg">
Browser Address
</div>
<h2 className="text-sm text-slate-400">
The address of the Browser server to use for the
workflow run.
</h2>
</div>
</FormLabel>
<div className="w-full space-y-2">
<FormControl>
<Input
{...field}
placeholder="http://127.0.0.1:9222"
value={
field.value === null ? "" : (field.value as string)
}
/>
</FormControl>
<FormMessage />
</div>
</div>
</FormItem>
);
}}
/>
<FormField <FormField
key="extraHttpHeaders" key="extraHttpHeaders"
control={form.control} control={form.control}

1
skyvern-frontend/src/routes/workflows/WorkflowRunParameters.tsx
View File

@@ -84,6 +84,7 @@ function WorkflowRunParameters() {
maxScreenshotScrolls ?? workflow.max_screenshot_scrolls ?? null, maxScreenshotScrolls ?? workflow.max_screenshot_scrolls ?? null,
extraHttpHeaders: extraHttpHeaders:
extraHttpHeaders ?? workflow.extra_http_headers ?? null, extraHttpHeaders ?? workflow.extra_http_headers ?? null,
cdpAddress: null,
}} }}
/> />
</div> </div>