Skip to content

Conversation

Taleef7
Copy link

@Taleef7 Taleef7 commented Oct 11, 2025

What changes are being made and why?

Summary

  • Add safe, responsive preview for HTML artifacts in the executions drawer.
  • Instead of rendering raw HTML in the Monaco editor, HTML is shown in a sandboxed <iframe> (no same-origin, no referrer).
  • Hide preview controls that don’t apply to HTML (row count, encoding, force-editor).

Implementation

  • New component: ui/src/components/executions/outputs/HtmlPreview.vue
    • Fetches the artifact, injects it using :srcdoc, and shows loading/error states.
    • Security: sandbox="allow-scripts" (no allow-same-origin), referrerpolicy="no-referrer"
  • ui/src/components/executions/FilePreview.vue
    • Detects .html / .htm by extension.
    • Routes to <HtmlPreview :downloadUrl="..." /> and hides the non-relevant controls for HTML.
  • Other preview types (CSV / JSON / PNG / PDF / Markdown) remain unchanged.

Value

working_html_preview

How the changes have been QAed?

Acceptance checks

  • Click Preview on an HTML output → the chart/page renders in the iframe and the UI remains responsive.
  • Other file types (CSV/JSON/PNG/PDF/MD) preview exactly as before.
  • The preview form controls (row count, encoding, force editor) are hidden for HTML.
  • The Download button still works for the same artifact.

Example flow to exercise HTML preview

id: html_preview_example
namespace: company.team

tasks:
  - id: html
    type: io.kestra.plugin.core.http.Request
    method: GET
    uri: https://example.com/index.html
    store: true
  • Note: Any flow that stores an .html body will validate the new path.

Local checks run

  • npm run test: unit – passed.
  • npm run test:e2e – passed (with one scenario skipped as in current repo baseline).
  • npm run test: lint – no errors in touched files (some repo-wide warnings pre-existing).

Setup Instructions

No special setup required. This is a UI-only change; backend and plugins are unchanged.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: To review

Development

Successfully merging this pull request may close these issues.

Render HTML file outputs in the Outputs preview

2 participants