[FIX] compiler: escape backticks in attributes

Before this commit, the generated code crashed if an attribute in
the template contained backticks. The compiler output something
like

```js
   let block1 = createBlock(`<div foo="`bar`"/>`);
```

The backticks are now properly escaped.
This commit is contained in:
Aaron Bohy
2022-06-22 10:12:55 +02:00
committed by Sam Degueldre
parent 9c4c3e3b83
commit c16d7d52b1
3 changed files with 40 additions and 0 deletions
+1
View File
@@ -282,6 +282,7 @@ export class CodeGenerator {
for (let block of this.blocks) {
if (block.dom) {
let xmlString = block.asXmlString();
xmlString = xmlString.replace(/`/g, "\\`");
if (block.dynamicTagName) {
xmlString = xmlString.replace(/^<\w+/, `<\${tag || '${block.dom.nodeName}'}`);
xmlString = xmlString.replace(/\w+>$/, `\${tag || '${block.dom.nodeName}'}>`);
@@ -126,6 +126,20 @@ exports[`attributes dynamic attributes 1`] = `
}"
`;
exports[`attributes dynamic attributes with backticks 1`] = `
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
let block1 = createBlock(\`<div block-attribute-0=\\"foo\\"/>\`);
return function template(ctx, node, key = \\"\\") {
let attr1 = \`bar\`;
return block1([attr1]);
}
}"
`;
exports[`attributes dynamic class attribute 1`] = `
"function anonymous(app, bdom, helpers
) {
@@ -374,6 +388,19 @@ exports[`attributes static attributes on void elements 1`] = `
}"
`;
exports[`attributes static attributes with backticks 1`] = `
"function anonymous(app, bdom, helpers
) {
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
let block1 = createBlock(\`<div foo=\\"\\\\\`bar\\\\\`\\"/>\`);
return function template(ctx, node, key = \\"\\") {
return block1();
}
}"
`;
exports[`attributes static attributes with dashes 1`] = `
"function anonymous(app, bdom, helpers
) {
+12
View File
@@ -22,6 +22,12 @@ describe("attributes", () => {
expect(renderToString(template)).toBe(`<div aria-label="Close"></div>`);
});
test("static attributes with backticks", () => {
const template = '<div foo="`bar`"></div>';
const result = renderToString(template);
expect(result).toBe('<div foo="`bar`"></div>');
});
test("static attributes on void elements", () => {
const template = `<img src="/test.skip.jpg" alt="Test"/>`;
expect(renderToString(template)).toBe(`<img src="/test.skip.jpg" alt="Test">`);
@@ -33,6 +39,12 @@ describe("attributes", () => {
expect(result).toBe(`<div foo="bar"></div>`);
});
test("dynamic attributes with backticks", () => {
const template = '<div t-att-foo="`bar`"/>';
const result = renderToString(template);
expect(result).toBe(`<div foo="bar"></div>`);
});
test("two dynamic attributes", () => {
const template = `<div t-att-foo="'bar'" t-att-bar="'foo'"/>`;
const result = renderToString(template);