Stable coverage.
parent
725cb7bb92
commit
d005c136b9
|
@ -7,6 +7,7 @@
|
|||
node_modules/
|
||||
dist/
|
||||
|
||||
|
||||
# Compiled Java class files
|
||||
*.class
|
||||
|
||||
|
@ -28,6 +29,7 @@ dist/
|
|||
|
||||
# Unit test reports
|
||||
TEST*.xml
|
||||
coverage/
|
||||
|
||||
# Generated by MacOS
|
||||
.DS_Store
|
||||
|
|
|
@ -0,0 +1,7 @@
|
|||
import { toHtml } from 'hast-util-to-html';
|
||||
|
||||
export function htmlToAst(ast) {
|
||||
return toHtml(ast);
|
||||
}
|
||||
|
||||
export default htmlToAst;
|
|
@ -28,7 +28,6 @@ function getMaskedData(node, ancestors) {
|
|||
function interpolateNode(node, ancestors) {
|
||||
const data = getMaskedData(node, ancestors);
|
||||
|
||||
// Interpolate properties
|
||||
if (node.properties && typeof node.properties === 'object') {
|
||||
for (const key in node.properties) {
|
||||
if (typeof node.properties[key] === 'string') {
|
||||
|
@ -44,7 +43,6 @@ function interpolateNode(node, ancestors) {
|
|||
}
|
||||
}
|
||||
|
||||
// Interpolate text content for text nodes
|
||||
if (node.type === 'text' && node.value) {
|
||||
node.value = interpolateString(node.value, data.interp);
|
||||
}
|
||||
|
@ -54,9 +52,14 @@ function interpolateNode(node, ancestors) {
|
|||
|
||||
function interpolateString(str, data) {
|
||||
const context = createContext({ ...data, ...global });
|
||||
const interpolatedStr = runInContext(`\`${str}\``, context);
|
||||
|
||||
return interpolatedStr;
|
||||
try {
|
||||
const interpolatedStr = runInContext(`\`${str}\``, context);
|
||||
return interpolatedStr;
|
||||
} catch (e) {
|
||||
console.error('Error interpolating string:', e);
|
||||
return str;
|
||||
}
|
||||
}
|
||||
|
||||
export default interpolate;
|
||||
|
|
19
src/util.mjs
19
src/util.mjs
|
@ -1 +1,20 @@
|
|||
export function cloneNode (node) {
|
||||
return JSON.parse(JSON.stringify(node));
|
||||
}
|
||||
|
||||
export function createAstNode (type, props, children) {
|
||||
const ast = {
|
||||
type: type,
|
||||
props: props,
|
||||
children: children || [],
|
||||
};
|
||||
return ast;
|
||||
}
|
||||
|
||||
// Test if the node is an object with a "type" value (including undefined)
|
||||
export function isAstNode (node) {
|
||||
return (typeof node === 'object')
|
||||
&& (node !== null)
|
||||
&& ('type' in node)
|
||||
;
|
||||
}
|
||||
|
|
|
@ -8,8 +8,7 @@ describe("interpolate()", () => {
|
|||
expect(interpolate).toBeDefined();
|
||||
})
|
||||
|
||||
it("should interpolate", () => {
|
||||
|
||||
it("should interpolate a single node", () => {
|
||||
const uninterpolated = '<div class="${classname}"></div>';
|
||||
const expected = '<div class="foo"></div>';
|
||||
|
||||
|
@ -21,4 +20,69 @@ describe("interpolate()", () => {
|
|||
expect(rendered).toEqual(expected);
|
||||
})
|
||||
|
||||
it("should interpolate a nested tree", () => {
|
||||
const uninterpolated = `
|
||||
<div class="\${classname}">
|
||||
<p>This is a \${data.stringInPTag} in a p tag</p>
|
||||
<p id="\${data.id}">This is a p with an interpolated id</p>
|
||||
<ul class="\${data.listClass}">
|
||||
<li>\${data.listItem}</li>
|
||||
</ul>
|
||||
</div>
|
||||
`;
|
||||
const expected = `
|
||||
<div class="foo">
|
||||
<p>This is a string in a p tag</p>
|
||||
<p id="foo">This is a p with an interpolated id</p>
|
||||
<ul class="bar">
|
||||
<li>baz</li>
|
||||
</ul>
|
||||
</div>
|
||||
`;
|
||||
|
||||
const data = {
|
||||
classname: "foo",
|
||||
data: {
|
||||
stringInPTag: "string",
|
||||
id: "foo",
|
||||
listClass: "bar",
|
||||
listItem: "baz",
|
||||
},
|
||||
};
|
||||
const ast = htmlToAst(uninterpolated);
|
||||
const interpolated = interpolate(ast, data);
|
||||
const rendered = astToHtml(interpolated);
|
||||
|
||||
expect(rendered).toEqual(expected);
|
||||
})
|
||||
|
||||
it("should handle arbitrary javascript", () => {
|
||||
const uninterpolated = `
|
||||
<div class="\${classname}">
|
||||
<p>simple: 3 * 12 = \${3 * 12}</p>
|
||||
<p>named function: 3^2 = \${square(3)}</p>
|
||||
<p>arrow function: 5*2 = \${(num => (num * 2))(5)}</p>
|
||||
<p>arrow function: 3-8 = \${(num => (num - 8))(3)}</p>
|
||||
</div>
|
||||
`;
|
||||
const expected = `
|
||||
<div class="foo">
|
||||
<p>simple: 3 * 12 = 36</p>
|
||||
<p>named function: 3^2 = 9</p>
|
||||
<p>arrow function: 5*2 = 10</p>
|
||||
<p>arrow function: 3-8 = -5</p>
|
||||
</div>
|
||||
`;
|
||||
|
||||
const data = {
|
||||
classname: "foo",
|
||||
square: (num) => Math.pow(num, 2),
|
||||
};
|
||||
const ast = htmlToAst(uninterpolated);
|
||||
const interpolated = interpolate(ast, data);
|
||||
const rendered = astToHtml(interpolated);
|
||||
|
||||
expect(rendered).toEqual(expected);
|
||||
})
|
||||
|
||||
});
|
||||
|
|
|
@ -84,7 +84,5 @@ describe("isAstNode()", () => {
|
|||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
|
Loading…
Reference in New Issue