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

fix(ivy): ensure ngClass works with [class] bindings (#26559)

Browse Source 
PR Close #26559
This commit is contained in:
Matias Niemelä
2018-10-18 14:47:53 -07:00
parent 0cc9842bf6
commit 297dc2bc02
12 changed files with 199 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/core/test/bundling/animation_world/bundle.golden_symbols.json
View File

@ -446,6 +446,9 @@
{
"name": "defineInjectable"
},
{
"name": "delegateToClassInput"
},
{
"name": "destroyLView"
},
@ -740,6 +743,9 @@
{
"name": "hasValueChanged"
},
{
"name": "initializeTNodeInputs"
},
{
"name": "inject"
},
@ -833,6 +839,9 @@
{
"name": "leaveView"
},
{
"name": "limitToSingleClasses"
},
{
"name": "listener"
},

9
packages/core/test/bundling/todo/bundle.golden_symbols.json
View File

@ -503,6 +503,9 @@
{
"name": "defineInjectable"
},
{
"name": "delegateToClassInput"
},
{
"name": "destroyLView"
},
@ -770,6 +773,9 @@
{
"name": "hasValueChanged"
},
{
"name": "initializeTNodeInputs"
},
{
"name": "inject"
},
@ -848,6 +854,9 @@
{
"name": "leaveView"
},
{
"name": "limitToSingleClasses"
},
{
"name": "listener"
},

9
packages/core/test/bundling/todo_r2/bundle.golden_symbols.json
View File

@ -1427,6 +1427,9 @@
{
"name": "definePipe"
},
{
"name": "delegateToClassInput"
},
{
"name": "destroyLView"
},
@ -1910,6 +1913,9 @@
{
"name": "initDomAdapter"
},
{
"name": "initializeTNodeInputs"
},
{
"name": "inject"
},
@ -2081,6 +2087,9 @@
{
"name": "leaveView"
},
{
"name": "limitToSingleClasses"
},
{
"name": "listener"
},

60
packages/core/test/render3/integration_spec.ts
View File

@ -7,13 +7,13 @@
*/
import {ElementRef, TemplateRef, ViewContainerRef} from '@angular/core';
import {RendererStyleFlags2, RendererType2} from '../../src/render/api';
import {AttributeMarker, defineComponent, defineDirective, templateRefExtractor} from '../../src/render3/index';
import {NO_CHANGE, bind, container, containerRefreshEnd, containerRefreshStart, element, elementAttribute, elementClassProp, elementContainerEnd, elementContainerStart, elementEnd, elementProperty, elementStart, elementStyleProp, elementStyling, elementStylingApply, embeddedViewEnd, embeddedViewStart, enableBindings, disableBindings, interpolation1, interpolation2, interpolation3, interpolation4, interpolation5, interpolation6, interpolation7, interpolation8, interpolationV, load, projection, projectionDef, reference, text, textBinding, template} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementAttribute, elementClassProp, elementContainerEnd, elementContainerStart, elementEnd, elementProperty, elementStart, elementStyleProp, elementStyling, elementStylingApply, embeddedViewEnd, embeddedViewStart, enableBindings, disableBindings, interpolation1, interpolation2, interpolation3, interpolation4, interpolation5, interpolation6, interpolation7, interpolation8, interpolationV, load, projection, projectionDef, reference, text, textBinding, template, elementStylingMap} from '../../src/render3/instructions';
import {InitialStylingFlags, RenderFlags} from '../../src/render3/interfaces/definition';
import {RElement, Renderer3, RendererFactory3, domRendererFactory3, RText, RComment, RNode, RendererStyleFlags3, ProceduralRenderer3} from '../../src/render3/interfaces/renderer';
import {NO_CHANGE} from '../../src/render3/tokens';
import {HEADER_OFFSET, CONTEXT} from '../../src/render3/interfaces/view';
import {sanitizeUrl} from '../../src/sanitization/sanitization';
import {Sanitizer, SecurityContext} from '../../src/sanitization/security';
@ -1627,6 +1627,62 @@ describe('render3 integration test', () => {
expect(fixture.html)
.toEqual('<structural-comp class="">Comp Content</structural-comp>Temp Content');
});
let mockClassDirective: DirWithClassDirective;
class DirWithClassDirective {
static ngDirectiveDef = defineDirective({
type: DirWithClassDirective,
selectors: [['', 'DirWithClass', '']],
factory: () => mockClassDirective = new DirWithClassDirective(),
inputs: {'klass': 'class'}
});
public classesVal: string = '';
set klass(value: string) { this.classesVal = value; }
}
it('should delegate all initial classes to a [class] input binding if present on a directive on the same element',
() => {
/**
* <my-comp class="apple orange banana" DirWithClass></my-comp>
*/
const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['DirWithClass']);
elementStyling([
InitialStylingFlags.VALUES_MODE, 'apple', true, 'orange', true, 'banana', true
]);
elementEnd();
}
if (rf & RenderFlags.Update) {
elementStylingApply(0);
}
}, 1, 0, [DirWithClassDirective]);
const fixture = new ComponentFixture(App);
expect(mockClassDirective !.classesVal).toEqual('apple orange banana');
});
it('should update `[class]` and bindings in the provided directive if the input is matched',
() => {
/**
* <my-comp DirWithClass></my-comp>
*/
const App = createComponent('app', function(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
elementStart(0, 'div', ['DirWithClass']);
elementStyling();
elementEnd();
}
if (rf & RenderFlags.Update) {
elementStylingMap(0, 'cucumber grape');
elementStylingApply(0);
}
}, 1, 0, [DirWithClassDirective]);
const fixture = new ComponentFixture(App);
expect(mockClassDirective !.classesVal).toEqual('cucumber grape');
});
});
});

3
packages/core/test/render3/properties_spec.ts
View File

@ -9,8 +9,9 @@
import {EventEmitter} from '@angular/core';
import {AttributeMarker, PublicFeature, defineComponent, template, defineDirective} from '../../src/render3/index';
import {NO_CHANGE, bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, interpolation1, listener, load, reference, text, textBinding} from '../../src/render3/instructions';
import {bind, container, containerRefreshEnd, containerRefreshStart, element, elementEnd, elementProperty, elementStart, embeddedViewEnd, embeddedViewStart, interpolation1, listener, load, reference, text, textBinding} from '../../src/render3/instructions';
import {RenderFlags} from '../../src/render3/interfaces/definition';
import {NO_CHANGE} from '../../src/render3/tokens';
import {pureFunction1, pureFunction2} from '../../src/render3/pure_function';
import {ComponentFixture, TemplateFixture, createComponent, renderToHtml, createDirective} from './render_util';