async-htm-to-string

Renders a htm tagged template asyncly into a string

Usage no npm install needed!

<script type="module">
  import asyncHtmToString from 'https://cdn.skypack.dev/async-htm-to-string';
</script>

README

async-htm-to-string

Renders a htm tagged template asyncly into a string.

js-semistandard-style

Usage

Simple

yarn add async-htm-to-string
const { html, renderToString } = require('async-htm-to-string');

const customTag = ({ prefix }, children) => html`<div>${prefix}-${children}</div>`;
const dynamicContent = 'bar';
// Will equal "<div>foo-bar</div>
const result = await renderToString(html`<${customTag} prefix="foo">${dynamicContent}</${customTag}>`);

API

html

Is h() bound to htm (htm.bind(h)). Used with template literals, like:

const renderableElement = html`<div>${content}</div>`;

rawHtml / rawHtml(rawString)

If you need to provide pre-escaped raw HTML content, then you can use rawHtml as either a template literal or by calling it with the

const renderableElement = rawHtml`<div>&amp;${'&quot;'}</div>`;
const renderableElement = rawHtml('<div>&amp;</div>');

You can also use the result of any of those rawHtml inside html, like:

const renderableElement = html`<div>${rawHtml`&amp;`}</div>`;

h(type, props, ...children)

The inner method that's htm is bound to.

render(renderableElement)

Takes the output from html and returns an async iterator that yields the strings as they are rendered

renderToString(renderableElement)

Same as render(), but asyncly returns a single string with the fully rendered result, rather than an async iterator.

Helpers

generatorToString(somethingIterable)

Asyncly loops over an iterable (like eg. an async iterable) and concatenates together the result into a single string that it resolves to. The brains behind renderToString().