CODEWITHSUNDEEP
javascriptangularunit-testingjasmine
user5711656
user5711656

Reputation: 3678

why text is not matching in angular using toEqual?

I am trying to test my component using jasmine but I am not sure why i fail

here is y code https://stackblitz.com/edit/angular-bup8gb enter image description here

describe('initial display',()=>{
   it('show counter text',()=>{
      debugEl = fixture.debugElement.query(By.css('p.abc'));
      el = fixture.nativeElement;
       fixture.detectChanges();
     expect(el.textContent).toEqual('counter 1')
   })
 })

Upvotes: 1

Views: 577

Answers (1)

R. Richards
R. Richards

Reputation: 25161

Here is the proper syntax to do what you need:

describe('initial display',()=>{
  it('show counter text',()=>{
    debugEl = fixture.debugElement.query(By.css('.abc'));
    el = debugEl.nativeElement; //** You need to get the element from the degubEl
    fixture.detectChanges();
    expect(el.textContent).toEqual('counter 1')
  })
})

Here is another way to do it, but it may not be desirable if you have more than one p element in the template:

describe('initial display',()=>{
  it('show counter text',()=>{
    el = fixture.nativeElement;
    fixture.detectChanges();
    expect(el.querySelector('p').textContent).toEqual('counter 1')
  })
})

Upvotes: 1

Related Questions