title: How to change value of a select box in angular2 unit test?
body: <p>I have an Angular2 component that contains a select box that looks like</p>
  
  <pre><code>&lt;select [(ngModel)]="envFilter" class="form-control" name="envSelector" (ngModelChange)="onChangeFilter($event)"&gt;
      &lt;option *ngFor="let env of envs" [ngValue]="env"&gt;{{env}}&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>I am trying to write a unit test for the ngModelChange event.  This is my latest failing attempt</p>
  
  <pre><code>it("should filter and show correct items", async(() =&gt; {
      fixture.detectChanges();
      fixture.whenStable().then(() =&gt; {
          el = fixture.debugElement.query(By.name("envSelector"));
          fixture.detectChanges();
          makeResponse([hist2, longhist]);
          comp.envFilter = 'env3';
          el.triggerEventHandler('change', {});
          fixture.whenStable().then(() =&gt; {
              fixture.detectChanges();
              expect(comp.displayedHistory).toEqual(longhist);
          });
      });
  </code></pre>
  
  <p>The part I am having trouble with is that changing the value of the underlying model <code>comp.envFilter = 'env3';</code> does not trigger the change method.  I added <code>el.triggerEventHandler('change', {});</code> but this throws <code>Failed: Uncaught (in promise): ReferenceError: By is not defined</code>.  I cannot find any hints in the documentation... any ideas?</p>