HTML Capture

How Demoship captures your product's HTML, CSS, and assets to create interactive demos.

The HTML capture engine snapshots your product's DOM, stylesheets, fonts, and images into a self-contained package that renders identically outside your production environment.

How capture works

1. The browser extension traverses the current page's DOM tree.
2. All inline and external stylesheets are resolved and bundled.
3. Images, fonts, and SVGs are downloaded and stored as assets.
4. JavaScript behavior is selectively preserved for UI interactions (dropdowns, tabs, accordions).
5. The result is a standalone HTML package hosted on Demoship's CDN.

Browser extension setup

1. Install the Demoship Chrome extension from the Chrome Web Store.
2. Log in to your Demoship account through the extension popup.
3. Navigate to the page you want to capture.
4. Click the extension icon and select Capture HTML Demo.
5. Wait for the capture to complete (typically 5-15 seconds depending on page complexity).

What gets captured

• Full DOM structure including shadow DOM elements.
• CSS (inline, embedded, and external stylesheets).
• Web fonts and icon fonts.
• Images (raster and SVG).
• Basic UI interactions (CSS-driven transitions, simple JS widgets).

What doesn't get captured

• Server-side functionality (API calls, form submissions, real-time data).
• Complex JavaScript applications that rely on backend state.
• Video and audio elements (captured as static frames).
• Third-party widgets loaded from external domains (chat widgets, analytics scripts).

Handling dynamic content

If your page loads content dynamically (e.g., via API calls or lazy loading):

1. Wait for all content to fully load before capturing.
2. Scroll through the page to trigger lazy-loaded images.
3. Open any dropdowns or modals you want available in the demo, then close them -- the extension captures their DOM even when hidden.

Authenticated pages

For pages behind a login:

1. Log in to your product normally in the browser.
2. The extension uses your existing session to capture the authenticated page.
3. Captured content is static -- no credentials are stored or transmitted.

Note: Captured HTML is sandboxed. It cannot make network requests, access cookies, or run arbitrary scripts. This is a security boundary, not a limitation.