fix(renderer): support `xlink:href` attribute in svg

Closes #4956
This commit is contained in:
Tobias Bosch 2015-10-27 15:41:34 -07:00
parent dc6a066fed
commit 540b8c2a1a
4 changed files with 27 additions and 18 deletions

View File

@ -346,7 +346,14 @@ class BrowserDomAdapter extends GenericBrowserDomAdapter {
String tagName(Element element) => element.tagName;
Map<String, String> attributeMap(Element element) {
return new Map.from(element.attributes);
var result = {};
result.addAll(element.attributes);
// TODO(tbosch): element.getNamespacedAttributes() somehow does not return the attribute value
var xlinkHref = element.getAttributeNS('http://www.w3.org/1999/xlink', 'href');
if (xlinkHref != null) {
result['xlink:href'] = xlinkHref;
}
return result;
}
bool hasAttribute(Element element, String attribute) =>

View File

@ -226,7 +226,7 @@ export class BrowserDomAdapter extends GenericBrowserDomAdapter {
hasAttribute(element, attribute: string): boolean { return element.hasAttribute(attribute); }
getAttribute(element, attribute: string): string { return element.getAttribute(attribute); }
setAttribute(element, name: string, value: string) { element.setAttribute(name, value); }
setAttributeNS(ns: string, element, name: string, value: string) {
setAttributeNS(element, ns: string, name: string, value: string) {
element.setAttributeNS(ns, name, value);
}
removeAttribute(element, attribute: string) { element.removeAttribute(attribute); }

View File

@ -116,7 +116,7 @@ const SVG_ELEMENT_NAMES = CONST_EXPR({
'vkern': true
});
const SVG_ATTR_NAMESPACES = CONST_EXPR({'href': XLINK_NAMESPACE});
const SVG_ATTR_NAMESPACES = CONST_EXPR({'href': XLINK_NAMESPACE, 'xlink:href': XLINK_NAMESPACE});
export abstract class DomRenderer extends Renderer implements NodeFactory<Node> {
abstract registerComponentTemplate(templateId: number, commands: RenderTemplateCmd[],

View File

@ -1745,22 +1745,24 @@ export function main() {
if (DOM.supportsDOMEvents()) {
describe('svg', () => {
it('should support svg elements',
inject([TestComponentBuilder, AsyncTestCompleter],
(tcb: TestComponentBuilder, async) => {
tcb.overrideView(MyComp, new ViewMetadata({template: '<svg><g></g></svg>'}))
.createAsync(MyComp)
.then((rootTC) => {
var el = rootTC.debugElement.nativeElement;
var svg = DOM.childNodes(el)[0];
var g = DOM.childNodes(svg)[0];
expect(DOM.getProperty(<Element>svg, 'namespaceURI'))
.toEqual('http://www.w3.org/2000/svg');
expect(DOM.getProperty(<Element>g, 'namespaceURI'))
.toEqual('http://www.w3.org/2000/svg');
inject([TestComponentBuilder, AsyncTestCompleter], (tcb: TestComponentBuilder,
async) => {
tcb.overrideView(MyComp,
new ViewMetadata({template: '<svg><use xlink:href="Port" /></svg>'}))
.createAsync(MyComp)
.then((rootTC) => {
var el = rootTC.debugElement.nativeElement;
var svg = DOM.childNodes(el)[0];
var use = DOM.childNodes(svg)[0];
expect(DOM.getProperty(<Element>svg, 'namespaceURI'))
.toEqual('http://www.w3.org/2000/svg');
expect(DOM.getProperty(<Element>use, 'namespaceURI'))
.toEqual('http://www.w3.org/2000/svg');
expect(DOM.getOuterHTML(<HTMLElement>use)).toContain('xmlns:xlink');
async.done();
});
}));
async.done();
});
}));
});
}