cargdev/angular
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ivy): host bindings should work if input has same name (#27589)

Browse Source 
Previously in Ivy, host bindings did not work if they shared a public name
with an Input because they used the `elementProperty` instruction as is.
This instruction was originally built for inside component templates, so it
would either set a directive input OR a native property. This is the
correct behavior for inside a template, but for host bindings, we always
want the native properties to be set regardless of the presence of an Input.

This change adds an extra argument to `elementProperty` so we can tell it to
ignore directive inputs and only set native properties (if it is in the
context of a host binding).

PR Close #27589
This commit is contained in:
Kara Erickson
2018-12-10 14:51:28 -08:00
committed by Alex Rickabaugh
parent ceb14deb60
commit 452668b581
7 changed files with 103 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
packages/core/test/linker/integration_spec.ts
View File

@ -1671,20 +1671,18 @@ function declareTests(config?: {useJit: boolean}) {
expect(el.title).toBeFalsy();
});
fixmeIvy('FW-711: elementProperty instruction should not be used in host bindings')
.it('should work when a directive uses hostProperty to update the DOM element', () => {
TestBed.configureTestingModule(
{declarations: [MyComp, DirectiveWithTitleAndHostProperty]});
const template = '<span [title]="ctxProp"></span>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
it('should work when a directive uses hostProperty to update the DOM element', () => {
TestBed.configureTestingModule({declarations: [MyComp, DirectiveWithTitleAndHostProperty]});
const template = '<span [title]="ctxProp"></span>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
fixture.componentInstance.ctxProp = 'TITLE';
fixture.detectChanges();
fixture.componentInstance.ctxProp = 'TITLE';
fixture.detectChanges();
const el = getDOM().querySelector(fixture.nativeElement, 'span');
expect(getDOM().getProperty(el, 'title')).toEqual('TITLE');
});
const el = getDOM().querySelector(fixture.nativeElement, 'span');
expect(getDOM().getProperty(el, 'title')).toEqual('TITLE');
});
});
describe('logging property updates', () => {