handle xmlns attributes correctly

pull/143/head
Rich-Harris 8 years ago
parent abbd605091
commit d3a2ff243a

@ -52,7 +52,11 @@ export default function addElementAttributes ( generator, node, local ) {
// static attributes // static attributes
result = JSON.stringify( value.data ); result = JSON.stringify( value.data );
if ( propertyName ) { if ( attribute.name === 'xmlns' ) {
// special case
// TODO this attribute must be static enforce at compile time
local.namespace = value.data;
} else if ( propertyName ) {
local.init.push( deindent` local.init.push( deindent`
${local.name}.${propertyName} = ${result}; ${local.name}.${propertyName} = ${result};
` ); ` );
@ -61,12 +65,6 @@ export default function addElementAttributes ( generator, node, local ) {
${local.name}.setAttribute( '${attribute.name}', ${result} ); ${local.name}.setAttribute( '${attribute.name}', ${result} );
` ); ` );
} }
// special case
// TODO this attribute must be static enforce at compile time
if ( attribute.name === 'xmlns' ) {
local.namespace = value;
}
} }
else { else {

@ -0,0 +1,21 @@
export default {
data: {
x: 0,
y: 0,
width: 100,
height: 100
},
html: `<svg><rect x="0" y="0" width="100" height="100"></rect></svg>`,
test ( assert, component, target ) {
const svg = target.querySelector( 'svg' );
const rect = target.querySelector( 'rect' );
assert.equal( svg.namespaceURI, 'http://www.w3.org/2000/svg' );
assert.equal( rect.namespaceURI, 'http://www.w3.org/2000/svg' );
component.set({ width: 150, height: 50 });
assert.equal( target.innerHTML, `<svg><rect x="0" y="0" width="150" height="50"></rect></svg>` );
}
};

@ -0,0 +1,3 @@
<svg xmlns='http://www.w3.org/2000/svg'>
<rect x='{{x}}' y='{{y}}' width='{{width}}' height='{{height}}'/>
</svg>

After

Width:  |  Height:  |  Size: 115 B

Loading…
Cancel
Save