title: how to check button is disable or not in angular?
body: <p>I am trying to add unit test cases of <code>template driven form</code>. How to check <code>submit</code> button is <strong>disabled</strong> at initial stage and <code>enable</code> when when user enter all valid <code>field</code> .</p>
  
  <p>Here is form </p>
  
  <p><a href="https://stackblitz.com/edit/angular-a8q2zr?file=src%2Fapp%2Fapp.component.html" rel="noreferrer">https://stackblitz.com/edit/angular-a8q2zr?file=src%2Fapp%2Fapp.component.html</a></p>
  
  <p>Unit test case </p>
  
  <p><a href="https://stackblitz.com/edit/angular-testing-5m3qwm?file=app%2Fapp.component.spec.ts" rel="noreferrer">https://stackblitz.com/edit/angular-testing-5m3qwm?file=app%2Fapp.component.spec.ts</a></p>
  
  <pre><code>import { ComponentFixture, TestBed,async } from '@angular/core/testing';
  import { By } from '@angular/platform-browser';
  import { DebugElement }  from '@angular/core';
  import { AppComponent } from './app.component';
  import { BrowserModule } from '@angular/platform-browser';
  import { FormsModule } from '@angular/forms';
  
  
  //
  describe('AppComponent', () =&gt; {
     let fixture ,component,debugElement; 
    beforeEach(async(() =&gt; {
      TestBed.configureTestingModule({
          imports:      [ BrowserModule, FormsModule ],
        declarations: [
          AppComponent
        ],
      }).compileComponents();
    }));
  
    beforeEach(()=&gt;{
       fixture = TestBed.createComponent(AppComponent);
       component = fixture.componentInstance;
    })
  
    xdescribe('initial state of form',()=&gt;{
  
      it('form is invalide button is disable',()=&gt;{
      // fixture.detectChanges();
     //   debugElement = fixture.debugElement;
     //   expect(true).toBe(true)
      })
    })
  
  
  })
  </code></pre>
  
  <p>Any update ?</p>