Automations with a CallWebhook action are not visible in the Prefect UI

[willhcr]

Bug summary

When creating an Automation via Python code for use with a webhook, it is created successfully and functions, but is not visible in the UI.

Sample create script:

import base64
from prefect.automations import Automation
from prefect.blocks.webhook import Webhook
from prefect.events import EventTrigger, CallWebhook, ResourceSpecification
from prefect.types import SecretDict
from pydantic import SecretStr

# Define webhook URL and auth headers
webhook_url = 'http://example.com/api/webhook'
basic_auth = 'luggage:12345'
auth_secret = base64.b64encode(basic_auth.encode('utf-8')).decode('utf-8')
headers = {
    "Authorization": f"Basic {auth_secret}",
    "Content-Type": "application/json"
}

# Create Webhook Block
webhook_block = Webhook(
    url=SecretStr(webhook_url),
    headers=SecretDict(headers),
    verify=False  # Set to True in production
)

# Save the webhook block
block_id = webhook_block.save(name='test-webhook', overwrite=True)
print(f'Created WebhookBlock with ID: {block_id}')

async def create_automation():
    """Create an automation that triggers on specific Prefect events"""
    automation = Automation(
        name='test-webhook-automation',
        trigger=EventTrigger(
            expect={'prefect.flow-run.Completed', 'prefect.task-run.Running'},
            match=ResourceSpecification.model_validate({
                'prefect.resource.id': ['prefect.flow-run.*', 'prefect.task-run.*'],
            }),
            posture='Reactive'
        ),
        actions=[CallWebhook(block_document_id=block_id, payload='{{ event.model_dump_json() }}')]
    )
    result = await automation.acreate()
    print(f"Created automation: {result.id}")

if __name__ == '__main__':
    import asyncio
    asyncio.run(create_automation())

The browser console displays the following error in the UI:

Error: Automation action type is missing case for: call-webhook
    gKe index-XA97onRR.mjs:2988
    map index-XA97onRR.mjs:31474
    u automation.ts:14
    map index-XA97onRR.mjs:31474
    getAutomations automationsApi.ts:18
    response vue-compositions.mjs:5397
    run reactivity.esm-bundler.js:77
    execute vue-compositions.mjs:5397
    subscribe vue-compositions.mjs:5384
    subscribe vue-compositions.mjs:5439
    xn vue-compositions.mjs:5501
    setup Automations.vue:48
    Kx runtime-core.esm-bundler.js:199
    _pe runtime-core.esm-bundler.js:7908
    gpe runtime-core.esm-bundler.js:7868
    ie runtime-core.esm-bundler.js:5216
    te runtime-core.esm-bundler.js:5182
    w runtime-core.esm-bundler.js:4700
    Ot runtime-core.esm-bundler.js:5327
    run reactivity.esm-bundler.js:225
    fe runtime-core.esm-bundler.js:5454
    ie runtime-core.esm-bundler.js:5230
    te runtime-core.esm-bundler.js:5182
    w runtime-core.esm-bundler.js:4700
    Ot runtime-core.esm-bundler.js:5327
    run reactivity.esm-bundler.js:225
    fe runtime-core.esm-bundler.js:5454
    ie runtime-core.esm-bundler.js:5230
    te runtime-core.esm-bundler.js:5182
    w runtime-core.esm-bundler.js:4700
    Ot runtime-core.esm-bundler.js:5327
    run reactivity.esm-bundler.js:225
    fe runtime-core.esm-bundler.js:5454
    ie runtime-core.esm-bundler.js:5230
    te runtime-core.esm-bundler.js:5182
    w runtime-core.esm-bundler.js:4700
    H runtime-core.esm-bundler.js:4933
    F runtime-core.esm-bundler.js:4855
    L runtime-core.esm-bundler.js:4820
    w runtime-core.esm-bundler.js:4688
    Ot runtime-core.esm-bundler.js:5327
    run reactivity.esm-bundler.js:225
    fe runtime-core.esm-bundler.js:5454
    registerDep runtime-core.esm-bundler.js:7202
    promise callback*registerDep runtime-core.esm-bundler.js:7187
    ie runtime-core.esm-bundler.js:5223
    te runtime-core.esm-bundler.js:5182
    w runtime-core.esm-bundler.js:4700
    Ot runtime-core.esm-bundler.js:5406
    run reactivity.esm-bundler.js:225
    runIfDirty reactivity.esm-bundler.js:263
    Kx runtime-core.esm-bundler.js:199
    TY runtime-core.esm-bundler.js:408
    promise callback*EY runtime-core.esm-bundler.js:322
    K4 runtime-core.esm-bundler.js:336
    cpe runtime-core.esm-bundler.js:7321
    scheduler runtime-core.esm-bundler.js:6197
    scheduler reactivity.esm-bundler.js:1830
    trigger reactivity.esm-bundler.js:253
    _9 reactivity.esm-bundler.js:311
    notify reactivity.esm-bundler.js:597
    trigger reactivity.esm-bundler.js:571
    set value reactivity.esm-bundler.js:1456
    J vue-router.mjs:3498
    V vue-router.mjs:3363
    promise callback*V vue-router.mjs:3330
    R vue-router.mjs:3255
    install vue-router.mjs:3699
    use runtime-core.esm-bundler.js:3863
    HNt colorMode.ts:23
    <anonymous> main.ts:22
vue-compositions.mjs:5399:85

Version info

Version:             3.3.5
API version:         0.8.4
Python version:      3.12.9
Git commit:          db4b7a33
Built:               Thu, Apr 17, 2025 09:25 PM
OS/Arch:             linux/x86_64
Profile:             ephemeral
Server type:         server
Pydantic version:    2.10.6
Integrations:
  prefect-docker:    0.6.3
  prefect-azure:     0.4.3

Additional context

The frontend is successfully retrieving the JSON data via API:

But does not display anything in the UI:

[zhen0]

I think this is a difference between the two different Perfect versions (Prefect Server & Prefect Cloud). The Server (open source) UI supports the send-notification action with a custom webhook block rather than call-webhook.

[vyagubov]

We are using the call-webhook action with a webhook block. The automation executes correctly, but it remains invisible in the UI.

In the browser console, the following error appears:

Automations.vue:48 Error: Automation action type is missing case for: call-webhook
    at Sft.u (automation.ts:14:19)
    at Array.map (<anonymous>)
    at sr.getAutomations (automationsApi.ts:18:19)

I am not a frontend developer, but I have tried to fix the issue. However, when running locally (pnpm run dev) or building the production UI (pnpm run build && pnpm vite preview), this error does not appear, so I cannot test any fixes.

BTW, in the code I see:

const AUTOMATION_ACTION_TYPES: Partial<Record<ActionType, string>> = {
  "cancel-flow-run": "Cancel a flow run",
  "suspend-flow-run": "Suspend a flow run",
  "resume-flow-run": "Resume a flow run",
  "change-flow-run-state": "Change flow run's state",
  "run-deployment": "Run a deployment",
  "pause-deployment": "Pause a deployment",
  "resume-deployment": "Resume a deployment",
  "pause-work-queue": "Pause a work queue",
  "resume-work-queue": "Resume a work queue",
  "pause-work-pool": "Pause a work pool",
  "resume-work-pool": "Resume a work pool",
  "pause-automation": "Pause an automation",
  "resume-automation": "Resume an automation",
  "send-notification": "Send a notification",
};

2 actions are missing. call-webhook and do-nothing.
Also, here call-webhook is not defined: https://github.com/PrefectHQ/prefect/blob/main/ui-v2/src/components/automations/automations-wizard/automation-schema.ts

[vyagubov]

@devinvillarosa could you give me a hint on how to get the same behavior for the local build and the released version of the UI?

I have one backend and two versions of the frontend. For some reason, the local build ignores the issue and shows the Automation, while the released version hides it.

Here’s the released frontend:

Here’s the local build of the frontend with the same backend:

Do you have any recommendations on how to reproduce the same environment locally to properly debug this?