fix(ivy): Ensure proper namespace is used to create elements in JIT (#28144)

PR Close #28144
This commit is contained in:
Ben Lesh 2019-01-14 15:58:05 -08:00 committed by Alex Rickabaugh
parent a58fd210e9
commit 2b9cc8503d
2 changed files with 27 additions and 19 deletions

View File

@ -1852,8 +1852,7 @@ function declareTests(config?: {useJit: boolean}) {
expect(firstAttribute.namespaceURI).toEqual('http://www.w3.org/1999/xlink'); expect(firstAttribute.namespaceURI).toEqual('http://www.w3.org/1999/xlink');
}); });
fixmeIvy('FW-811: Align HTML namespaces between Ivy and Render2') it('should support foreignObjects with document fragments', () => {
.it('should support foreignObjects with document fragments', () => {
TestBed.configureTestingModule({declarations: [MyComp]}); TestBed.configureTestingModule({declarations: [MyComp]});
const template = const template =
'<svg><foreignObject><xhtml:div><p>Test</p></xhtml:div></foreignObject></svg>'; '<svg><foreignObject><xhtml:div><p>Test</p></xhtml:div></foreignObject></svg>';

View File

@ -111,7 +111,9 @@ class DefaultDomRenderer2 implements Renderer2 {
createElement(name: string, namespace?: string): any { createElement(name: string, namespace?: string): any {
if (namespace) { if (namespace) {
return document.createElementNS(NAMESPACE_URIS[namespace], name); // In cases where Ivy (not ViewEngine) is giving us the actual namespace, the look up by key
// will result in undefined, so we just return the namespace here.
return document.createElementNS(NAMESPACE_URIS[namespace] || namespace, name);
} }
return document.createElement(name); return document.createElement(name);
@ -154,6 +156,8 @@ class DefaultDomRenderer2 implements Renderer2 {
setAttribute(el: any, name: string, value: string, namespace?: string): void { setAttribute(el: any, name: string, value: string, namespace?: string): void {
if (namespace) { if (namespace) {
name = `${namespace}:${name}`; name = `${namespace}:${name}`;
// TODO(benlesh): Ivy may cause issues here because it's passing around
// full URIs for namespaces, therefore this lookup will fail.
const namespaceUri = NAMESPACE_URIS[namespace]; const namespaceUri = NAMESPACE_URIS[namespace];
if (namespaceUri) { if (namespaceUri) {
el.setAttributeNS(namespaceUri, name, value); el.setAttributeNS(namespaceUri, name, value);
@ -167,10 +171,15 @@ class DefaultDomRenderer2 implements Renderer2 {
removeAttribute(el: any, name: string, namespace?: string): void { removeAttribute(el: any, name: string, namespace?: string): void {
if (namespace) { if (namespace) {
// TODO(benlesh): Ivy may cause issues here because it's passing around
// full URIs for namespaces, therefore this lookup will fail.
const namespaceUri = NAMESPACE_URIS[namespace]; const namespaceUri = NAMESPACE_URIS[namespace];
if (namespaceUri) { if (namespaceUri) {
el.removeAttributeNS(namespaceUri, name); el.removeAttributeNS(namespaceUri, name);
} else { } else {
// TODO(benlesh): Since ivy is passing around full URIs for namespaces
// this could result in properties like `http://www.w3.org/2000/svg:cx="123"`,
// which is wrong.
el.removeAttribute(`${namespace}:${name}`); el.removeAttribute(`${namespace}:${name}`);
} }
} else { } else {