Testbed: Error: Can't resolve all parameters for PriDateInput: (?)

Question

I'm trying to create a Angular Component using the TestBed but I'm getting the following error:

Error: Can't resolve all parameters for PriDateInput: (?). error properties: Object({ ngSyntaxError: true })

The component PriDateInput has a service AppContextService that should be injected. I want to mock the AppContextService by replacing it with MockAppContextService.

Follows .spec file:

class MockWindowService extends WindowService {
    get href() : string {
        return "https://elevationfw-iridium-build.azurewebsites.net/Default/Azure-DEV/#/";
    }
} 

class MockAppContextService extends AppContextService {
    constructor(){
        super(new StorageService(), new MockWindowService());
    }
    getContext() {
        let emptyContext: any = this.emptyContext;
        emptyContext.user.culture = "en-US";
        return this.emptyContext;
    }
} 

describe('AppContextService Test cases', () => {
    let mockApp = new MockAppContextService();
    let priDateInput: PriDateInput;
    debugger;
    beforeEach(()=> {
        TestBed.configureTestingModule({
            declarations: [PriDateInput],
            providers: [
            {
                provide: AppContextService,
                useClass: mockApp
            }
            ],
        });
        priDateInput = TestBed.get(PriDateInput);
    });

    it('should be possible to instantiate it', () => {
        expect(priDateInput).toBeDefined();
        expect(priDateInput).not.toBeNull();
    });

    it('should be possible to instantiate it', () => {

        expect(priDateInput).toBeDefined();
        expect(priDateInput).not.toBeNull();
    });
});

Follows an extract of my component:

import { Component, OnInit, OnDestroy, ViewChild, ElementRef, Input, Output, EventEmitter } from "@angular/core";
import { AppContextService } from "./../../../../../services/appcontext.service";
import * as moment from 'moment';
@Component({
    selector: "pri-date-input",
    templateUrl: './input.date.component.html'
})

export class PriDateInput implements OnInit, OnDestroy {
    .............................
    @ViewChild("input") input: ElementRef;

    @Input("domainType") domainType: String;
    @Input("required") required: Boolean;
    @Input("isLoading") isLoading: boolean;
    @Input("isDisabled") isDisabled: boolean;
    @Input("onWriteValue") onWriteValue: EventEmitter<string | null>;
    @Output("onDateChange") onDateChange: EventEmitter<string> = new EventEmitter<string>();

    constructor(
        private _appContextService: AppContextService
    ) {
        moment.locale(this._appContextService.user.culture);
    }

    ngOnInit(): void {
        .......
    }

    ngOnDestroy(): void {
        this.unsubscriveInputEvents();
    }
    ......
}

If you think that you need more information, please ask :)

score 2 · Answer 1 · 2018-10-15T09:18:17.150

2

You create a class instance

let mockApp = new MockAppContextService();

But use it as a class mock

{
  provide: AppContextService,
  useClass: mockApp
}

Try with

{
  provide: AppContextService,
  useValue: mockApp
}

Also, you miss a little bit of code ...

TestBed.configureTestingModule(/* config */)
  .compileComponents();

fixture = TesBed.createComponent(PriDateInput);
component = fixture.componentInstance;
fixture.detectChanges();

edited Oct 15 '18 at 09:18

answered Oct 15 '18 at 08:14

The error continues the same, this not solves my problem. But you had correct something that I was not were of. Thank you for that :) – Ricardo Rocha Oct 15 '18 at 09:10
I added an edit to my answer, feel free to check it out – Oct 15 '18 at 09:18

Testbed: Error: Can't resolve all parameters for PriDateInput: (?)

1 Answers1