Print HTML content – Virtuoso

The WriteHTML extension renders a valid HTML string into the current document during a Virtuoso journey execution. It creates a new div container, assigns the requested container ID, places the supplied HTML inside it, and appends the container to the page body.

This is useful when you need to create test-only page content, render a small HTML fixture, verify text or element selection against generated markup, or prepare a blank test page before validating DOM-based journey steps.

Parameters:

content required, a string containing the valid HTML markup to render into the document;
elementId optional, a string used as the id attribute of the generated container. If omitted, the extension uses WriteHTMLContent;

Note: The content input is parsed as HTML and written into the page with innerHTML. Use a trusted, intentionally prepared HTML string and pass plain text only after escaping it as HTML.

How to apply this to your journey

Use the extension in a journey by calling WriteHTML with the execute command. Pass each value to the matching extension input using as content and, when needed, as elementId.

Note: This extension modifies the DOM of the page currently open in the journey. If you want a blank page for isolated rendering checks, navigate to the Virtuoso test page before running the extension.

execute "WriteHTML" using "<div>Test</div>" as content

execute "WriteHTML" using "<section><h2>Invoice preview</h2><p>Total: £42</p></section>" as content using "invoicePreview" as elementId
look for "Invoice preview"
store element details of "invoicePreview" in $renderedElement

You can also store the HTML in a Virtuoso variable first, then pass that variable as the content input.

execute "WriteHTML" using "$html" as content

store value "<div class="message">Test</div>" in $html
execute "WriteHTML" using "$html" as content using "customId" as elementId
look for "Test"
store element details of "customId" in $customElement

For a clean test surface, open a blank HTML page before rendering the content.

navigate to "https://s3-eu-west-1.amazonaws.com/virtuoso-downloaded-files/test.html"
store value "<div>Test</div>" in $html
execute "WriteHTML" using "$html" as content using "customId" as elementId
look for "Test"

This extension does not return meaningful data. It performs an action by adding the rendered container to the current document. After it runs, continue the journey by looking for rendered text or by selecting the generated container ID.

This extension does not require any external resource.

The extension should be configured as:

Run asynchronously: No
Scope: Global

Limitation: This extension runs in the browser page context and directly mutates the current document by appending a new container to document.body. It does not sanitize, validate, deduplicate, or remove existing content, so repeated runs with the same elementId can create duplicate IDs and affect later selectors. Because innerHTML parses the supplied string as HTML, only trusted test HTML should be used; unsafe markup, event-handler attributes, remote images, or other active content can change page behavior or create security risk in the test session. The extension also depends on the target page having an available document.body and allowing HTML injection; strict content security policy or Trusted Types enforcement can block string assignment to innerHTML. Cross-browser note: This extension uses standard DOM APIs such as document.createElement, setAttribute, innerHTML, and appendChild. Rendered output can still vary across Chromium, Firefox, Safari, Edge, iOS, Android, and remote-grid executions because HTML parsing, responsive layout, CSP behavior, viewport size, fonts, and device/browser capabilities are not always identical. Validate the journey in each browser/device configuration used by your plan.

Add the extension to your Virtuoso instance

Select the domain that matches your Virtuoso account.

Add extension to Virtuoso - https://app.virtuoso.qa/ →	Add extension to Virtuoso Free Trial - https://app2.virtuoso.qa/ →
Add extension to Virtuoso US - https://app-us.virtuoso.qa/ →	Add extension to Virtuoso UK - https://app-uk.virtuoso.qa/ →

View source

Last updated: 13/12/2021

Resources:

This extension does not require any external resource.

// Last updated: 13/12/2021, 11:34:10 UTC
function write (content, elementId = 'WriteHTMLContent') {
  if (!content) throw new Error('Content is required')
  const container = document.createElement('div')
  container.setAttribute('id', elementId)
  container.innerHTML = content
  document.body.appendChild(container)
}

return write(content, elementId)