From c3f9893d81b3a6d32bf8067197081534c147ee85 Mon Sep 17 00:00:00 2001 From: Kara Erickson Date: Thu, 22 Aug 2019 14:14:36 -0700 Subject: [PATCH] refactor(core): remove innerHTML and outerHTML testing utilities from DomAdapters (#32278) PR Close #32278 --- .../test/transformers/r3_transform_spec.ts | 2 - ...ns_with_web_animations_integration_spec.ts | 1 - packages/core/test/dom/dom_adapter_spec.ts | 2 +- packages/core/test/linker/integration_spec.ts | 41 +++++++++---------- .../linker/projection_integration_spec.ts | 4 +- .../test/linker/security_integration_spec.ts | 8 ++-- packages/core/test/spies.ts | 5 --- .../src/browser/browser_adapter.ts | 2 - .../platform-browser/src/dom/dom_adapter.ts | 2 - .../test/dom/shared_styles_host_spec.ts | 10 ++--- .../src/web_workers/worker/worker_adapter.ts | 2 - .../worker/renderer_v2_integration_spec.ts | 2 +- 12 files changed, 32 insertions(+), 49 deletions(-) diff --git a/packages/compiler-cli/test/transformers/r3_transform_spec.ts b/packages/compiler-cli/test/transformers/r3_transform_spec.ts index 778db81048..992165f086 100644 --- a/packages/compiler-cli/test/transformers/r3_transform_spec.ts +++ b/packages/compiler-cli/test/transformers/r3_transform_spec.ts @@ -8,8 +8,6 @@ import {PartialModule} from '@angular/compiler'; import * as o from '@angular/compiler/src/output/output_ast'; -import {MockAotCompilerHost} from '@angular/compiler/test/aot/test_util'; -import {initDomAdapter} from '@angular/platform-browser/src/browser'; import * as ts from 'typescript'; import {getAngularClassTransformerFactory} from '../../src/transformers/r3_transform'; diff --git a/packages/core/test/animation/animations_with_web_animations_integration_spec.ts b/packages/core/test/animation/animations_with_web_animations_integration_spec.ts index f21c76dc53..344f434d96 100644 --- a/packages/core/test/animation/animations_with_web_animations_integration_spec.ts +++ b/packages/core/test/animation/animations_with_web_animations_integration_spec.ts @@ -13,7 +13,6 @@ import {Component, ViewChild} from '@angular/core'; import {TestBed} from '@angular/core/testing'; import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; import {browserDetection} from '@angular/platform-browser/testing/src/browser_util'; -import {ivyEnabled} from '@angular/private/testing'; (function() { // these tests are only mean't to be run within the DOM (for now) diff --git a/packages/core/test/dom/dom_adapter_spec.ts b/packages/core/test/dom/dom_adapter_spec.ts index 194b192d03..eaeaebe4e8 100644 --- a/packages/core/test/dom/dom_adapter_spec.ts +++ b/packages/core/test/dom/dom_adapter_spec.ts @@ -54,7 +54,7 @@ import {el, stringifyElement} from '@angular/platform-browser/testing/src/browse expect(getDOM().isTextNode(t)).toBe(true); const d = getDOM().createElement('div'); getDOM().appendChild(d, t); - expect(getDOM().getInnerHTML(d)).toEqual('hello'); + expect(d.innerHTML).toEqual('hello'); }); it('should set className via the class attribute', () => { diff --git a/packages/core/test/linker/integration_spec.ts b/packages/core/test/linker/integration_spec.ts index 6cd2df3da7..23065ea86a 100644 --- a/packages/core/test/linker/integration_spec.ts +++ b/packages/core/test/linker/integration_spec.ts @@ -199,12 +199,12 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxProp = 'Some HTML'; fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.debugElement.children[0].nativeElement)) + expect(fixture.debugElement.children[0].nativeElement.innerHTML) .toEqual('Some HTML'); fixture.componentInstance.ctxProp = 'Some other
HTML
'; fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.debugElement.children[0].nativeElement)) + expect(fixture.debugElement.children[0].nativeElement.innerHTML) .toEqual('Some other
HTML
'); }); @@ -1726,7 +1726,7 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxProp = 'hello'; fixture.detectChanges(); - const html = getDOM().getInnerHTML(fixture.nativeElement); + const html = fixture.nativeElement.innerHTML; expect(html).toContain('ng-reflect-dir-prop="hello"'); }); @@ -1737,7 +1737,7 @@ function declareTests(config?: {useJit: boolean}) { const fixture = TestBed.createComponent(MyComp); fixture.detectChanges(); - const html = getDOM().getInnerHTML(fixture.nativeElement); + const html = fixture.nativeElement.innerHTML; expect(html).toContain('ng-reflect-dir-prop="hello"'); expect(html).not.toContain('ng-reflect-title'); }); @@ -1747,7 +1747,7 @@ function declareTests(config?: {useJit: boolean}) { const fixture = TestBed.createComponent(ParentCmp); fixture.detectChanges(); - const html = getDOM().getInnerHTML(fixture.nativeElement); + const html = fixture.nativeElement.innerHTML; expect(html).toContain('ng-reflect-test_="hello"'); }); @@ -1761,7 +1761,7 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxBoolProp = true; fixture.detectChanges(); - const html = getDOM().getInnerHTML(fixture.nativeElement); + const html = fixture.nativeElement.innerHTML; expect(html).toContain('"ng-reflect-ng-if": "true"'); }); @@ -1776,7 +1776,7 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxBoolProp = true; fixture.detectChanges(); - const html = getDOM().getInnerHTML(fixture.nativeElement); + const html = fixture.nativeElement.innerHTML; expect(html).toContain('"ng-reflect-ng-if": "true"'); }); @@ -1790,7 +1790,7 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxProp = 'hello'; fixture.detectChanges(); - const html = getDOM().getInnerHTML(fixture.nativeElement); + const html = fixture.nativeElement.innerHTML; expect(html).toContain('ng-reflect-dir-prop="hello"'); expect(html).toContain('ng-reflect-dir-prop2="hello"'); }); @@ -1802,7 +1802,7 @@ function declareTests(config?: {useJit: boolean}) { const fixture = TestBed.createComponent(MyComp); fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.nativeElement)).toContain('[ERROR]'); + expect(fixture.nativeElement.innerHTML).toContain('[ERROR]'); }); it('should not reflect undefined values', () => { @@ -1814,13 +1814,12 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxProp = 'hello'; fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.nativeElement)) - .toContain('ng-reflect-dir-prop="hello"'); + expect(fixture.nativeElement.innerHTML).toContain('ng-reflect-dir-prop="hello"'); fixture.componentInstance.ctxProp = undefined !; fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.nativeElement)).not.toContain('ng-reflect-'); + expect(fixture.nativeElement.innerHTML).not.toContain('ng-reflect-'); }); it('should not reflect null values', () => { @@ -1832,13 +1831,12 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxProp = 'hello'; fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.nativeElement)) - .toContain('ng-reflect-dir-prop="hello"'); + expect(fixture.nativeElement.innerHTML).toContain('ng-reflect-dir-prop="hello"'); fixture.componentInstance.ctxProp = null !; fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.nativeElement)).not.toContain('ng-reflect-'); + expect(fixture.nativeElement.innerHTML).not.toContain('ng-reflect-'); }); it('should reflect empty strings', () => { @@ -1850,7 +1848,7 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxProp = ''; fixture.detectChanges(); - expect(getDOM().getInnerHTML(fixture.nativeElement)).toContain('ng-reflect-dir-prop=""'); + expect(fixture.nativeElement.innerHTML).toContain('ng-reflect-dir-prop=""'); }); it('should not reflect in comment nodes when the value changes to undefined', () => { @@ -1863,14 +1861,14 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxBoolProp = true; fixture.detectChanges(); - let html = getDOM().getInnerHTML(fixture.nativeElement); + let html = fixture.nativeElement.innerHTML; expect(html).toContain('bindings={'); expect(html).toContain('"ng-reflect-ng-if": "true"'); fixture.componentInstance.ctxBoolProp = undefined !; fixture.detectChanges(); - html = getDOM().getInnerHTML(fixture.nativeElement); + html = fixture.nativeElement.innerHTML; expect(html).toContain('bindings={'); expect(html).not.toContain('ng-reflect'); }); @@ -1885,14 +1883,14 @@ function declareTests(config?: {useJit: boolean}) { fixture.componentInstance.ctxBoolProp = true; fixture.detectChanges(); - let html = getDOM().getInnerHTML(fixture.nativeElement); + let html = fixture.nativeElement.innerHTML; expect(html).toContain('bindings={'); expect(html).toContain('"ng-reflect-ng-if": "true"'); fixture.componentInstance.ctxBoolProp = null !; fixture.detectChanges(); - html = getDOM().getInnerHTML(fixture.nativeElement); + html = fixture.nativeElement.innerHTML; expect(html).toContain('bindings={'); expect(html).toContain('"ng-reflect-ng-if": null'); }); @@ -1928,8 +1926,7 @@ function declareTests(config?: {useJit: boolean}) { dir.myAttr = 'aaa'; fixture.detectChanges(); - expect(getDOM().getOuterHTML(fixture.debugElement.children[0].nativeElement)) - .toContain('my-attr="aaa"'); + expect(fixture.debugElement.children[0].nativeElement.outerHTML).toContain('my-attr="aaa"'); }); if (getDOM().supportsDOMEvents()) { diff --git a/packages/core/test/linker/projection_integration_spec.ts b/packages/core/test/linker/projection_integration_spec.ts index 8e528141fd..2efda0ef10 100644 --- a/packages/core/test/linker/projection_integration_spec.ts +++ b/packages/core/test/linker/projection_integration_spec.ts @@ -574,7 +574,7 @@ describe('projection', () => { const main = TestBed.createComponent(MainComp); main.detectChanges(); - expect(getDOM().getInnerHTML(main.nativeElement)) + expect(main.nativeElement.innerHTML) .toEqual( 'cmp-d' + 'cmp-c'); @@ -586,7 +586,7 @@ describe('projection', () => { const main = TestBed.createComponent(MainComp); main.detectChanges(); - expect(getDOM().getInnerHTML(main.nativeElement)) + expect(main.nativeElement.innerHTML) .toEqual( 'a1b11b12' + 'a2b21b22'); diff --git a/packages/core/test/linker/security_integration_spec.ts b/packages/core/test/linker/security_integration_spec.ts index f19781414d..0e03177797 100644 --- a/packages/core/test/linker/security_integration_spec.ts +++ b/packages/core/test/linker/security_integration_spec.ts @@ -283,19 +283,19 @@ function declareTests(config?: {useJit: boolean}) { // Make sure binding harmless values works. ci.ctxProp = 'some

text

'; fixture.detectChanges(); - expect(getDOM().getInnerHTML(e)).toEqual('some

text

'); + expect(e.innerHTML).toEqual('some

text

'); ci.ctxProp = 'ha '; fixture.detectChanges(); - expect(getDOM().getInnerHTML(e)).toEqual('ha '); + expect(e.innerHTML).toEqual('ha '); ci.ctxProp = 'also evil'; fixture.detectChanges(); - expect(getDOM().getInnerHTML(e)).toEqual('also evil'); + expect(e.innerHTML).toEqual('also evil'); ci.ctxProp = 'also evil'; fixture.detectChanges(); - expect(getDOM().getInnerHTML(e)).toEqual('also evil'); + expect(e.innerHTML).toEqual('also evil'); }); }); }); diff --git a/packages/core/test/spies.ts b/packages/core/test/spies.ts index 6cf94937db..acf434f58d 100644 --- a/packages/core/test/spies.ts +++ b/packages/core/test/spies.ts @@ -9,7 +9,6 @@ import {ElementRef} from '@angular/core'; import {ChangeDetectorRef} from '@angular/core/src/change_detection/change_detection'; import {SpyObject} from '@angular/core/testing/src/testing_internal'; -import {DomAdapter} from '@angular/platform-browser/src/dom/dom_adapter'; export class SpyChangeDetectorRef extends SpyObject { constructor() { @@ -24,7 +23,3 @@ export class SpyIterableDifferFactory extends SpyObject {} export class SpyElementRef extends SpyObject { constructor() { super(ElementRef); } } - -export class SpyDomAdapter extends SpyObject { - constructor() { super(DomAdapter); } -} diff --git a/packages/platform-browser/src/browser/browser_adapter.ts b/packages/platform-browser/src/browser/browser_adapter.ts index 6974c9383d..28caa7f589 100644 --- a/packages/platform-browser/src/browser/browser_adapter.ts +++ b/packages/platform-browser/src/browser/browser_adapter.ts @@ -147,11 +147,9 @@ export class BrowserDomAdapter extends GenericBrowserDomAdapter { isPrevented(evt: Event): boolean { return evt.defaultPrevented || evt.returnValue != null && !evt.returnValue; } - getInnerHTML(el: HTMLElement): string { return el.innerHTML; } getTemplateContent(el: Node): Node|null { return 'content' in el && this.isTemplateElement(el) ? (el).content : null; } - getOuterHTML(el: HTMLElement): string { return el.outerHTML; } nodeName(node: Node): string { return node.nodeName; } nodeValue(node: Node): string|null { return node.nodeValue; } type(node: HTMLInputElement): string { return node.type; } diff --git a/packages/platform-browser/src/dom/dom_adapter.ts b/packages/platform-browser/src/dom/dom_adapter.ts index f6a4b60c82..f98752e039 100644 --- a/packages/platform-browser/src/dom/dom_adapter.ts +++ b/packages/platform-browser/src/dom/dom_adapter.ts @@ -64,10 +64,8 @@ export abstract class DomAdapter { abstract createEvent(eventType: string): any; abstract preventDefault(evt: any): any; abstract isPrevented(evt: any): boolean; - abstract getInnerHTML(el: any): string; /** Returns content if el is a