fix(ivy): ensure map-based interpolation works with other map-based sources (#33236)

Prior to this fix if a map-based class or style binding wrote
its values onto an elemenent, the internal styling context would
not register the binding if the initial value as a `NO_CHANGE`
value. This situation occurs if a directive takes control of the
`class` or `style` input values and then returns a `NO_CHANGE` value
if the initial value is empty.

This patch ensures that all bindings are always registered with the
`TStylingContext` data-structure even if their initial value is
an instance of `NO_CHANGE`.

PR Close #33236
This commit is contained in:
Matias Niemelä
2019-10-16 15:13:37 -07:00
parent d5b59009d4
commit 7b64680670
2 changed files with 29 additions and 2 deletions

View File

@ -2292,6 +2292,23 @@ describe('styling', () => {
fixture.detectChanges();
}).toThrowError(/ExpressionChangedAfterItHasBeenCheckedError/);
});
it('should properly merge class interpolation with class-based directives', () => {
@Component(
{template: `<div class="zero {{one}}" [class.two]="true" [ngClass]="'three'"></div>`})
class MyComp {
one = 'one';
}
const fixture =
TestBed.configureTestingModule({declarations: [MyComp]}).createComponent(MyComp);
fixture.detectChanges();
expect(fixture.debugElement.nativeElement.innerHTML).toContain('zero');
expect(fixture.debugElement.nativeElement.innerHTML).toContain('one');
expect(fixture.debugElement.nativeElement.innerHTML).toContain('two');
expect(fixture.debugElement.nativeElement.innerHTML).toContain('three');
});
});
function assertStyleCounters(countForSet: number, countForRemove: number) {