Questions tagged [angular-test]

Questions about testing Angular code, addressing either specific issues ("why is this test failing"), test flows ("how to test this async call of my component") or test setup ("how do I mock router in this component test"), integration tests ("how to bypass a proxy to my backend in this angular test"), or possibly test-related questions, such as ("Why does this component work and the test is failing?").

Angular test suite, running on top of Jasmine testing framework and Angular test framework.

Questions with angular-test tag about testing Angular code should address test code.

It can be related to specific issues ("why is this test failing"), test flows ("how to test this async call of my component") or test setup ("how do I mock router in this component test"), integration tests ("how to bypass a proxy to my backend in this angular test"), or possibly test-code-related questions, such as ("Why does this component work and the test is failing?").

This tag should not be used for generic and overbroad questions such as "How to test an Angular directive?" or questions that have no relation to Angular test suite ("I am testing my code in browsers, why does it not work?"), but rather test code itself. Rule of thumb can be, "does this question include parts of my *.spec.ts file.

A good angular-test question will, as any good test, include your expected results, your actual results, and your attempts so far, if possible with test code included.

More information on Angular Testing can be found on Angular guide on testing.

718 questions
3
votes
2 answers

MatFormFieldHarness can't identify from angular unit test

This is the test file describe('test', () => { let component: myComponent; let fixture: ComponentFixture let loader: HarnessLoader; beforeEach(() => { fixture = TestBed.createComponent(myComponent); component =…
Sachila Ranawaka
  • 39,756
  • 7
  • 56
  • 80
3
votes
1 answer

Testing component throws Expression has changed after it was checked, when I try to change value

I am using test host component to control values passed into the component I am trying to test: @Component({ selector: `host-component`, template: `` }) class…
lostintranslation
  • 23,756
  • 50
  • 159
  • 262
3
votes
2 answers

timer still in the queue despite flush in fakeAsync

I have this test that will result in the infamous "1 timer(s) still in the queue" error: import { discardPeriodicTasks, fakeAsync, flush, flushMicrotasks, tick } from "@angular/core/testing"; describe("Sleep", () => { const sleep = (ms:…
Alex R
  • 808
  • 2
  • 10
  • 26
3
votes
1 answer

What is the ideal way to test a service with angular?

I'm new to angular testing and I want to create tests for my service. The problem is my service (foo) is inject another service (bar) in its constructor. So I should create a mock to bar? mock every function inside bar? if so, I need to do that for…
Jon Sud
  • 10,211
  • 17
  • 76
  • 174
3
votes
3 answers

Angular 8 Unit Test, Cannot set property 'valueAccessor' of null

I'm trying to simply pass the test (should create - component=> toBeTruthy) for the custom component (angular component class) implemented with ControlValueAccessor. I've injected NgControl in constructor and pass the this keyword. …
Rabin Rai
  • 59
  • 2
  • 9
3
votes
1 answer

"Cannot read property 'length' of undefined" when unit testing

I am unit-testing a component which renders a list of codes from server. Response coming is of this format: { ContactActivityView :[ { Code:"AB", IsActive:false, }, { Code:"BC", …
Mr. A
  • 63
  • 1
  • 14
3
votes
3 answers

Angular - test displayed error on form validation

I have a test that looks like this: ... component.registerForm.controls['username'].setValue('VALID USERNAME'); fixture.detectChanges(); expect(component.registerForm.valid).toEqual(true); // FIRST ASSERTION const errors =…
user2146414
  • 840
  • 11
  • 29
3
votes
1 answer

How to unit test a (non-component) support class in Angular with a mock service

I can't quite figure out how to unit test some methods of a support class in Angular with Jasmine. The class under test is a singleton, plain typescript class which is initialized by one of the services when it starts, and then is consumable by…
GGizmos
  • 3,443
  • 4
  • 27
  • 72
3
votes
1 answer

NullInjectorError: No provider for MatDialogRef! Angular Test

I'm new to angular and jhipster, I've edited the login component and I've added the formbuilder and MatDialogRef and update the Unit test: import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { MatDialogRef } from…
3
votes
2 answers

How to test the side effects of a subscription in an Angular component

I have an Angular component, MyComponent, which calls a method returning an Observable and subscribes to it, something like export class MyComponent { someProperty; constructor(service: MyService) {} someButtonClicked() { …
Picci
  • 16,775
  • 13
  • 70
  • 113
3
votes
1 answer

How to fix blank page in Karma?

I have a blank page with Karma in my Angular project. I just see the header with the debug button but nothing in the main container, it is totaly blank. I should precise that I use WSL Here is my karma.conf.js // Karma configuration file, see link…
DeHix
  • 45
  • 6
3
votes
2 answers

Test cases passes when run by itself but fails when run in a group

I have got several of the following test cases which run successfully when executed individually but they randomly fail when run in group. They all use setTimeout. They are in single spec file segregated in separate describe methods. Eg. This test…
Manu Chadha
  • 15,555
  • 19
  • 91
  • 184
3
votes
4 answers

ngx-bootstrap modal does not hide during test

In my Angular application, I'm writing some integration tests where I have an ngx-bootstrap modal In my integration tests, I'm testing a Component which contains a button that pops up a modal. Inside a modal, there is a "Save" button which is…
3
votes
0 answers

Angular: Test Completes Before Observable Finalizes

I trying to test an interceptor that adds a finalize operator to the pipeline and i'm unable to keep the test running long enough for the returned observable to, y'know, finalize. Here's the observable returned from the intercept function: return…
The Head Rush
  • 3,157
  • 2
  • 25
  • 45
3
votes
2 answers

using angular testing fakeAsync with jest it.each

Using Angular 8, @angular-builders/jest 8.0.2, jest 24.8, and given the following test passes import { tick, fakeAsync } from '@angular/core/testing'; it('test 1000 milliseconds', fakeAsync(() => { const fn = jest.fn(); setTimeout(() => { …
Sergio Mazzoleni
  • 1,458
  • 15
  • 24