title: Check a radio button in an Angular unit test
body: <p>I have a component in Angular with this HTML:</p>
  
  <pre><code>&lt;div class="row"&gt;
    &lt;label for="tipo" class="column"&gt;Tipo: &lt;/label&gt;
    &lt;div *ngFor="let tipo of tipos" class="column"&gt;
      &lt;input type="radio" name="tipo" [value]="tipo.id" 
        [(ngModel)]="movimiento.tipo" (ngModelChange)="alCambiarTipo()"&gt;
      &lt;span class="{{tipo.texto | lowercase}}"&gt;{{ tipo.texto }}&lt;/span&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>It has two radio buttons, and on change it triggers a function in my component. In my test I want to check the second radio button to test that my function is called. I've tried this code but It's not working:</p>
  
  <pre><code>it('should call alCambiarTipo on radio button change', () =&gt; {
    spyOn(component, 'alCambiarTipo').and.callThrough();
    let options: DebugElement[] = fixture.debugElement.queryAll(By.css('input[type="radio"]'));
    let secondOption: HTMLInputElement = options[1].nativeElement;
    secondOption.checked = true;
    expect(component.alCambiarTipo).toHaveBeenCalled();
  });
  </code></pre>
  
  <p>I've also tried using <code>.click()</code> on the input and it's also not working. What can I do to trigger my function? Thanks.</p>
  
  <p>PS: I've also tried to change the model adding <code>component.movimiento.tipo = 1;</code> and calling <code>fixture.detectChanges()</code> and it's also not working.</p>