Archived
1
0
Fork 0

rename str to html str

...because I have plans to implement more content types
This commit is contained in:
Dmitriy Pleshevskiy 2022-06-08 23:48:35 +03:00
parent 1a67959b1a
commit 6c175effb4
Signed by: pleshevskiy
GPG key ID: 1B59187B161C0215
2 changed files with 29 additions and 24 deletions

View file

@ -2,14 +2,14 @@ import { assertEquals } from "testing/asserts.ts";
import { TextNode } from "../core/node.ts"; import { TextNode } from "../core/node.ts";
import { E, F } from "./node.ts"; import { E, F } from "./node.ts";
import { StrRenderer } from "./str.ts"; import { HtmlStrRenderer } from "./html_str.ts";
Deno.test({ Deno.test({
name: "should render text node", name: "should render text node",
fn: () => { fn: () => {
const tn = new TextNode("hello world"); const tn = new TextNode("hello world");
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(tn); const res = ren.render(tn);
assertEquals(res, "hello world"); assertEquals(res, "hello world");
@ -21,7 +21,7 @@ Deno.test({
fn: () => { fn: () => {
const el = E("p", [], "hello world"); const el = E("p", [], "hello world");
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(el); const res = ren.render(el);
assertEquals(res, "<p>hello world</p>"); assertEquals(res, "<p>hello world</p>");
@ -33,7 +33,7 @@ Deno.test({
fn: () => { fn: () => {
const frag = F([]); const frag = F([]);
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(frag); const res = ren.render(frag);
assertEquals(res, ""); assertEquals(res, "");
@ -49,7 +49,7 @@ Deno.test({
E("p", [], "world"), E("p", [], "world"),
]); ]);
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(frag); const res = ren.render(frag);
assertEquals(res, 'hello world<div class="hello"></div><p>world</p>'); assertEquals(res, 'hello world<div class="hello"></div><p>world</p>');
@ -65,7 +65,7 @@ Deno.test({
]), ]),
]); ]);
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(layout); const res = ren.render(layout);
assertEquals(res, '<body><div id="root"><p>hello world</p></div></body>'); assertEquals(res, '<body><div id="root"><p>hello world</p></div></body>');
@ -81,7 +81,7 @@ Deno.test({
]), ]),
]); ]);
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(layout); const res = ren.render(layout);
assertEquals( assertEquals(
@ -96,7 +96,7 @@ Deno.test({
fn: () => { fn: () => {
const layout = E("html", []); const layout = E("html", []);
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(layout); const res = ren.render(layout);
assertEquals(res, "<!doctype html><html></html>"); assertEquals(res, "<!doctype html><html></html>");
@ -108,7 +108,7 @@ Deno.test({
fn: () => { fn: () => {
const layout = E("html", []); const layout = E("html", []);
const ren = new StrRenderer({ const ren = new HtmlStrRenderer({
doctype: doctype:
'html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"', 'html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"',
}); });
@ -126,7 +126,7 @@ Deno.test({
fn: () => { fn: () => {
const layout = E("body", [], []); const layout = E("body", [], []);
const ren = new StrRenderer({ forceRenderDoctype: true }); const ren = new HtmlStrRenderer({ forceRenderDoctype: true });
const res = ren.render(layout); const res = ren.render(layout);
assertEquals(res, "<!doctype html><body></body>"); assertEquals(res, "<!doctype html><body></body>");
@ -138,7 +138,9 @@ Deno.test({
fn: () => { fn: () => {
const layout = E("body", [], []); const layout = E("body", [], []);
const ren = new StrRenderer({ wrapNode: (node) => E("html", [], [node]) }); const ren = new HtmlStrRenderer({
wrapNode: (node) => E("html", [], [node]),
});
const res = ren.render(layout); const res = ren.render(layout);
assertEquals(res, "<!doctype html><html><body></body></html>"); assertEquals(res, "<!doctype html><html><body></body></html>");
@ -154,7 +156,7 @@ Deno.test({
rel: "nofollow noopener", rel: "nofollow noopener",
}, "hello world"); }, "hello world");
const ren = new StrRenderer({ const ren = new HtmlStrRenderer({
onVisitAttr: ([key, val]) => [`data-${key}`, val], onVisitAttr: ([key, val]) => [`data-${key}`, val],
}); });
const res = ren.render(layout); const res = ren.render(layout);
@ -173,7 +175,7 @@ Deno.test({
href: "/hello/world", href: "/hello/world",
}, "hello world"); }, "hello world");
const ren = new StrRenderer({ const ren = new HtmlStrRenderer({
onVisitAttr: ([key, val]) => [key, "/eng" + val], onVisitAttr: ([key, val]) => [key, "/eng" + val],
}); });
const res = ren.render(layout); const res = ren.render(layout);
@ -190,7 +192,7 @@ Deno.test({
fn: () => { fn: () => {
const layout = E("input", { type: "number", disabled: false }); const layout = E("input", { type: "number", disabled: false });
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(layout); const res = ren.render(layout);
assertEquals( assertEquals(
@ -205,7 +207,7 @@ Deno.test({
fn: () => { fn: () => {
const layout = E("input", { type: "number", disabled: true }); const layout = E("input", { type: "number", disabled: true });
const ren = new StrRenderer(); const ren = new HtmlStrRenderer();
const res = ren.render(layout); const res = ren.render(layout);
assertEquals( assertEquals(

View file

@ -13,14 +13,14 @@ import {
import { concat, join } from "../core/utils.ts"; import { concat, join } from "../core/utils.ts";
import { Renderer } from "./types.ts"; import { Renderer } from "./types.ts";
interface StrRendererOpts { interface HtmlStrRendererOpts {
doctype?: string; doctype?: string;
forceRenderDoctype?: boolean; forceRenderDoctype?: boolean;
wrapNode?: (node: AnyNode) => AnyNode; wrapNode?: (node: AnyNode) => AnyNode;
onVisitAttr?: (entry: AttrEntry, params: OnVisitAttrParams) => AttrEntry; onVisitAttr?: (entry: AttrEntry, params: OnVisitAttrParams) => AttrEntry;
} }
interface StrRendererHooks { interface HtmlStrRendererHooks {
onVisitAttr: (entry: AttrEntry, params: OnVisitAttrParams) => AttrEntry; onVisitAttr: (entry: AttrEntry, params: OnVisitAttrParams) => AttrEntry;
} }
@ -29,13 +29,13 @@ export interface OnVisitAttrParams {
readonly attrs: Attrs; readonly attrs: Attrs;
} }
export class StrRenderer implements Renderer<string> { export class HtmlStrRenderer implements Renderer<string> {
#doctype: string; #doctype: string;
#forceRenderDoctype: boolean; #forceRenderDoctype: boolean;
#wrapNode: (node: AnyNode) => AnyNode; #wrapNode: (node: AnyNode) => AnyNode;
#hooks: StrRendererHooks; #hooks: HtmlStrRendererHooks;
constructor(opts?: StrRendererOpts) { constructor(opts?: HtmlStrRendererOpts) {
this.#doctype = opts?.doctype ?? "html"; this.#doctype = opts?.doctype ?? "html";
this.#forceRenderDoctype = opts?.forceRenderDoctype ?? false; this.#forceRenderDoctype = opts?.forceRenderDoctype ?? false;
this.#wrapNode = opts?.wrapNode ?? identity; this.#wrapNode = opts?.wrapNode ?? identity;
@ -63,7 +63,7 @@ function encodeDoctype(value: string): string {
return `<!doctype ${value}>`; return `<!doctype ${value}>`;
} }
function encodeAnyNode(node: AnyNode, hooks: StrRendererHooks): string { function encodeAnyNode(node: AnyNode, hooks: HtmlStrRendererHooks): string {
return isTextNode(node) return isTextNode(node)
? encodeTextNode(node) ? encodeTextNode(node)
: isFragment(node) : isFragment(node)
@ -75,13 +75,16 @@ function encodeTextNode(node: TextNode): string {
return node.innerText; return node.innerText;
} }
function encodeHtmlFragment(node: Fragment, hooks: StrRendererHooks): string { function encodeHtmlFragment(
node: Fragment,
hooks: HtmlStrRendererHooks,
): string {
return concat(node.children.map((ch) => encodeAnyNode(ch, hooks))); return concat(node.children.map((ch) => encodeAnyNode(ch, hooks)));
} }
function encodeHtmlElement( function encodeHtmlElement(
{ tagName, attrs, children }: Elem, { tagName, attrs, children }: Elem,
hooks: StrRendererHooks, hooks: HtmlStrRendererHooks,
): string { ): string {
const open = `<${join(" ", [tagName, encodeAttrs(tagName, attrs, hooks)])}>`; const open = `<${join(" ", [tagName, encodeAttrs(tagName, attrs, hooks)])}>`;
if (isSelfClosedTagName(tagName)) return open; if (isSelfClosedTagName(tagName)) return open;
@ -93,7 +96,7 @@ function encodeHtmlElement(
function encodeAttrs( function encodeAttrs(
tagName: string, tagName: string,
attrs: Attrs, attrs: Attrs,
hooks: StrRendererHooks, hooks: HtmlStrRendererHooks,
): string { ): string {
return join( return join(
" ", " ",