/* This Source Code Form is subject to the terms of the Mozilla Public * License, v. 2.0. If a copy of the MPL was not distributed with this * file, You can obtain one at https://mozilla.org/MPL/2.0/. */ import { Component, createElement, Fragment } from "../../dist"; import { renderPage } from "../../dist/render"; import { testSuite } from "../lib"; testSuite("renderPage", ({ test, expect }) => { test("throws an Error when root elem is not html tag", () => { expect(() => renderPage(
)).toThrowErrorMatching( "attempted to render page with non-HTML root element div", ); }); test("outputs a HTML5 DOCTYPE declaration", () => { const html = renderPage(); expect(html).toStartWith(""); }); test("escapes HTML in tag names", () => { const html = renderPage( {createElement("div>, ); expect(html).toEqual( "", ); }); test("renders html attributes", () => { const html = renderPage(
, ); expect(html).toEqual( '
', ); }); test("renders common html tags", () => { const html = renderPage( </head> <body> <div /> </body> </html>, ); expect(html).toEqual( "<!DOCTYPE html><html><head><title>
", ); }); test("renders text nodes", () => { const html = renderPage(There are three lights!); expect(html).toEqual( "There are three lights!", ); }); test("renders spliced number nodes", () => { const nLights = 3; const html = renderPage(There are {nLights} lights!); expect(html).toEqual("There are 3 lights!"); }); test("renders spliced arrays", () => { const Light: Component<{ lightN: number }> = ({ lightN }) => (
{lightN}
); const lights = [1, 2, 3]; const html = renderPage( There are{" "} {lights.map((lightN) => ( ))}{" "} lights! , ); expect(html).toEqual( "There are
1
2
3
lights!", ); }); test("renders components w/ custom properties", () => { interface LightProps { nLights: number; } const Light: Component = ({ nLights }) => (
{nLights} lights
); const html = renderPage( There are ! , ); expect(html).toEqual( "There are
3 lights
!", ); }); test("renders fragment children only", () => { const html = renderPage(
test of
fragments
 , ); expect(html).toEqual( "
test of
fragments
", ); }); test("renders unescaped HTML via dangerouslySetInnerHTML", () => { const html = renderPage(
red alert!
", }} /> , ); expect(html).toEqual( "
red alert!
", ); }); test("throws error when both dangerouslySetInnerHTML and children prop present", () => { expect(() => renderPage(
set phasers to kill
", }} >
set phasers to stun
, ), ).toThrowErrorMatching( 'An element with children may not have a "dangerouslySetInnerHTML" prop since children would be overriden', ); }); });