title: Karma, Angular 7, & FontAwesome issue Can't bind to 'icon' since it isn't a known property of 'fa-icon'
body: <p><strong>Can't bind to 'icon' since it isn't a known property of 'fa-icon'.</strong></p>
  
  <p>When trying to run this test in people.component.spec.ts</p>
  
  <pre><code>import { async, ComponentFixture, TestBed } from "@angular/core/testing";
  import { PeopleComponent } from "./people.component";
  
  
  
  describe("PeopleComponent Unit Test", () =&gt; {
    let component: PeopleComponent;
    let fixture: ComponentFixture&lt;PeopleComponent&gt;;
  
    beforeEach(async(() =&gt; {
      TestBed.configureTestingModule({
        declarations: [PeopleComponent]
      })
        .compileComponents();
    }));
  
  
    beforeEach(() =&gt; {
      fixture = TestBed.createComponent(PeopleComponent);
      component = fixture.componentInstance;
      fixture.detectChanges();
    });
  
  
    it("should create", () =&gt; {
      expect(component).toBeTruthy();
    });
    ;
  }) 
  </code></pre>
  
  <p>The runner shows this error:</p>
  
  <p>Failed: Template parse errors:
  Can't bind to 'icon' since it isn't a known property of 'fa-icon'.</p>
  
  <ol>
  <li>If 'fa-icon' is an Angular component and it has 'icon' input, then<br>
  verify that it is part of this module.</li>
  <li>If 'fa-icon' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this
  component to suppress this    message.</li>
  <li>To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. This is the HTML causing the issue.</li>
  </ol>
  
  <p><a href="https://i.stack.imgur.com/KHhKd.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KHhKd.png" alt="This is the problem"></a>     </p>
  
  <p>I've tried to import FontAwesomeModule and FaIcon on test side and add to TestBed configuration's imports statement.  I've tried to ensure the component side has the imports too.  Nothing seems to work.  </p>