fix: multiple decorators on an input

help-me-mom · Mar 25, 2018 · 13874b9 · 13874b9
1 parent cf56d45
commit 13874b9
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 5 deletions.
diff --git a/lib/common/reflect.ts b/lib/common/reflect.ts
@@ -10,8 +10,8 @@ export function getInputsOutputs(directive: Type<Component | Directive>, type: '
     return [];
   }
   const propertyMetadata = (directive as any).__prop__metadata__ || {};
-  const outputs = Object.keys(propertyMetadata)
-                        .filter((meta) => propertyMetadata[meta][0].ngMetadataName === type)
-                        .reduce(metaReducer(propertyMetadata), []);
-  return outputs.concat(getInputsOutputs((directive as any).__proto__, type));
+  return Object.keys(propertyMetadata)
+               .filter((meta) => propertyMetadata[meta].find((m: any) => m.ngMetadataName === type))
+               .reduce(metaReducer(propertyMetadata), [])
+               .concat(getInputsOutputs((directive as any).__proto__, type));
 }
diff --git a/lib/mock-component/mock-component.spec.ts b/lib/mock-component/mock-component.spec.ts
@@ -11,6 +11,7 @@ import { SimpleComponent } from './test-components/simple-component.component';
   template: `
     <simple-component [someInput]="\'hi\'"
                       [someOtherInput]="\'bye\'"
+                      [someInput3]=true
                       (someOutput1)="emitted = $event"
                       (someOutput2)="emitted = $event">
     </simple-component>
@@ -61,6 +62,13 @@ describe('MockComponent', () => {
     expect(mockedComponent.someInput2).toEqual('bye');
   });
 
+  it('has no issues with multiple decorators on an input', () => {
+    fixture.detectChanges();
+    const mockedComponent = fixture.debugElement
+                                   .query(By.directive(MockComponent(SimpleComponent)));
+    expect(mockedComponent.componentInstance.someInput3).toEqual(true);
+  });
+
   it('should trigger output bound behavior', () => {
     fixture.detectChanges();
     const mockedComponent = fixture.debugElement

diff --git a/lib/mock-component/test-components/simple-component.component.ts b/lib/mock-component/test-components/simple-component.component.ts
@@ -1,4 +1,4 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { Component, EventEmitter, HostBinding, Input, Output } from '@angular/core';
 
 @Component({
   selector: 'base-simple-component',
@@ -17,6 +17,7 @@ export class BaseSimpleComponent {
 export class SimpleComponent extends BaseSimpleComponent {
   @Input() someInput: string;
   @Input('someOtherInput') someInput2: string;
+  @HostBinding('class.someClass') @Input() someInput3: boolean;
   @Output() someOutput1: EventEmitter<string>;
 }
 /* tslint:enable:max-classes-per-file */