fix(platform-browser): remove style nodes on destroy (#13744)
Closes #11746 PR Close #13744
This commit is contained in:
parent
a64c9b5d5b
commit
cd3901f774
|
@ -6,7 +6,7 @@
|
||||||
* found in the LICENSE file at https://angular.io/license
|
* found in the LICENSE file at https://angular.io/license
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import {Inject, Injectable} from '@angular/core';
|
import {Inject, Injectable, OnDestroy} from '@angular/core';
|
||||||
import {getDOM} from './dom_adapter';
|
import {getDOM} from './dom_adapter';
|
||||||
import {DOCUMENT} from './dom_tokens';
|
import {DOCUMENT} from './dom_tokens';
|
||||||
|
|
||||||
|
@ -32,8 +32,9 @@ export class SharedStylesHost {
|
||||||
}
|
}
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class DomSharedStylesHost extends SharedStylesHost {
|
export class DomSharedStylesHost extends SharedStylesHost implements OnDestroy {
|
||||||
private _hostNodes = new Set<Node>();
|
private _hostNodes = new Set<Node>();
|
||||||
|
private _styleNodes = new Set<Node>();
|
||||||
constructor(@Inject(DOCUMENT) private _doc: any) {
|
constructor(@Inject(DOCUMENT) private _doc: any) {
|
||||||
super();
|
super();
|
||||||
this._hostNodes.add(_doc.head);
|
this._hostNodes.add(_doc.head);
|
||||||
|
@ -43,7 +44,7 @@ export class DomSharedStylesHost extends SharedStylesHost {
|
||||||
styles.forEach((style: string) => {
|
styles.forEach((style: string) => {
|
||||||
const styleEl = this._doc.createElement('style');
|
const styleEl = this._doc.createElement('style');
|
||||||
styleEl.textContent = style;
|
styleEl.textContent = style;
|
||||||
host.appendChild(styleEl);
|
this._styleNodes.add(host.appendChild(styleEl));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -57,4 +58,6 @@ export class DomSharedStylesHost extends SharedStylesHost {
|
||||||
onStylesAdded(additions: Set<string>): void {
|
onStylesAdded(additions: Set<string>): void {
|
||||||
this._hostNodes.forEach(hostNode => this._addStylesToHost(additions, hostNode));
|
this._hostNodes.forEach(hostNode => this._addStylesToHost(additions, hostNode));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ngOnDestroy(): void { this._styleNodes.forEach(styleNode => getDOM().remove(styleNode)); }
|
||||||
}
|
}
|
||||||
|
|
|
@ -46,5 +46,14 @@ export function main() {
|
||||||
ssh.addStyles(['a {};', 'b {};']);
|
ssh.addStyles(['a {};', 'b {};']);
|
||||||
expect(doc.head).toHaveText('a {};b {};');
|
expect(doc.head).toHaveText('a {};b {};');
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should remove style nodes on destroy', () => {
|
||||||
|
ssh.addStyles(['a {};']);
|
||||||
|
ssh.addHost(someHost);
|
||||||
|
expect(getDOM().getInnerHTML(someHost)).toEqual('<style>a {};</style>');
|
||||||
|
|
||||||
|
ssh.ngOnDestroy();
|
||||||
|
expect(getDOM().getInnerHTML(someHost)).toEqual('');
|
||||||
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue