mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
Samuel Degueldre
b25e988628
Firefox will not serialize the xmlns attributes of node inside XMLDocuments, see https://bugzilla.mozilla.org/show_bug.cgi?id=175946 it will only output an xmlns attribute if the node being serialized has a non-null namespaceURI. When compiling templates, we currently use a special attribute, "block-ns" to keep track of the namespace, but we do not make use of the namespace to create the elements that will be serialized to the compiled block string. This causes a difference in behaviour between Chrome and Firefox: since we end up with an Element with two attributes: the block-ns attribute and the xmlns attribute. Chrome will serialize both, but Firefox will only serialize the block-ns because the Element does not have a namespaceURI. To fix this issue, we get rid of the block-ns magic attribute completely, and use xmlns instead. We also use the namespace when creating intermediate elements that will be used to create the serialized block string: the namespace is only used to create the elements but *not* set as an attribute, as this would cause chrome to serialize it twice, causing a duplicate attribute error when parsing it further down the line. When creating the template element for the block at runtime, the xmlns attribute is used both as the namespace with which to create the element, and set as an attribute, this doesn't cause issues when serializing later because the namespaceURI is never serialized as an attribute when serializing an HTML document[1], so we avoid the double-serialization in Chrome, and when doing HTML serialization, Firefox will correctly serialize the attribute. It's desirable that the xmlns is set as an attribute to allow users to use owl to render SVG, and then use the HTML serialization of it as a SVG even outside the context of an HTML document (eg to generate an SVG file or an SVG data URL). [1]: https://w3c.github.io/DOM-Parsing/#xml-serialization
135 lines
4.4 KiB
Plaintext
135 lines
4.4 KiB
Plaintext
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
|
|
exports[`properly support svg add proper namespace to g tags 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<g xmlns=\\"http://www.w3.org/2000/svg\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/> </g>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg add proper namespace to svg 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"100px\\" height=\\"90px\\"><circle cx=\\"50\\" cy=\\"50\\" r=\\"4\\" stroke=\\"green\\" stroke-width=\\"1\\" fill=\\"yellow\\"/> </svg>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg namespace to g tags not added if already in svg namespace 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><g/></svg>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg namespace to svg tags added even if already in svg namespace 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><svg/></svg>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg svg creates new block if it is within html -- 2 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block2 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><polygon fill=\\"#000000\\" points=\\"0 0 4 4 8 0\\" transform=\\"translate(5 7)\\"/><block-child-0 xmlns=\\"\\"/></svg>\`);
|
|
let block3 = createBlock(\`<path xmlns=\\"http://www.w3.org/2000/svg\\"/>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let b3;
|
|
if (ctx['hasPath']) {
|
|
b3 = block3();
|
|
}
|
|
const b2 = block2([], [b3]);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg svg creates new block if it is within html 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<div><block-child-0/></div>\`);
|
|
let block2 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><polygon fill=\\"#000000\\" points=\\"0 0 4 4 8 0\\" transform=\\"translate(5 7)\\"/></svg>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const b2 = block2();
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg svg namespace added to sub templates if root tag is path 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
const callTemplate_1 = app.getTemplate(\`path\`);
|
|
|
|
let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><block-child-0 xmlns=\\"\\"/></svg>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
const b2 = callTemplate_1.call(this, ctx, node, key + \`__1\`);
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg svg namespace added to sub templates if root tag is path 2`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<path xmlns=\\"http://www.w3.org/2000/svg\\"/>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
return block1();
|
|
}
|
|
}"
|
|
`;
|
|
|
|
exports[`properly support svg svg namespace added to sub-blocks 1`] = `
|
|
"function anonymous(app, bdom, helpers
|
|
) {
|
|
let { text, createBlock, list, multi, html, toggler, comment } = bdom;
|
|
|
|
let block1 = createBlock(\`<svg xmlns=\\"http://www.w3.org/2000/svg\\"><block-child-0 xmlns=\\"\\"/></svg>\`);
|
|
let block2 = createBlock(\`<path xmlns=\\"http://www.w3.org/2000/svg\\"/>\`);
|
|
|
|
return function template(ctx, node, key = \\"\\") {
|
|
let b2;
|
|
if (ctx['path']) {
|
|
b2 = block2();
|
|
}
|
|
return block1([], [b2]);
|
|
}
|
|
}"
|
|
`;
|