units tests

[memory660]

when launching unit tests with Jest, I get an error that I cannot resolve

Bug Report or Feature Request (mark with an x)

- [ ] bug report -> please search for issues before submitting
- [ ] feature request

Versions.

Angular 18 "keycloak-angular": "^16.0.1", "keycloak-js": "^25.0.6",

Repro steps.

describe('CartographyDrawLandmarkParamsComponent', () => {
  let component: CartographyDrawLandmarkParamsComponent;
  let fixture: ComponentFixture<CartographyDrawLandmarkParamsComponent>;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [CartographyDrawLandmarkParamsComponent, TranslateModule.forRoot()],

      providers: [
        provideMockStore(),
        { provide: NGXLogger, useValue: LoggerMock },
        { provide: KeycloakService, useClass: MockedKeycloakService }
      ]
    });
    fixture = TestBed.createComponent(CartographyDrawLandmarkParamsComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

import { Injectable } from '@angular/core';
import { KeycloakService } from 'keycloak-angular';

@Injectable()
export class MockedKeycloakService extends KeycloakService {
  init(): Promise<boolean> {
    return Promise.resolve(true);
  }

  getKeycloakInstance(): any {
    return {
      loadUserInfo: () => {
        let callback;
        Promise.resolve().then(() => {
          callback({
            userName: 'name'
          });
        });
        return {
          success: (fn) => (callback = fn)
        };
      }
    } as any;
  }
}

The log given by the failure.

    Cannot find module 'keycloak-angular/services/keycloak.service' from 'src/xxxxxxxxxx/services/authentification.service.ts'

    Require stack:
      src/xxxxxxxxxx/services/authentification.service.ts

Desired functionality.

that's work !

[mauriciovigolo]

Please review and adjust your mock implementation. When creating a mock for KeycloakService, avoid importing and extending KeycloakService in the mock class. Instead, implement only the necessary methods to prevent unintended behavior and simplify your tests.

As this does not appear to be an issue with the library itself, I will proceed to close this ticket.

[memory660]

@mauriciovigolo I also proceeded as indicated to you. this is even how I mock all my other services

const LoggerMock = {};
const KeycloakServiceMock = {};

describe('CartographyDrawLandmarkParamsComponent', () => {
  let component: CartographyDrawLandmarkParamsComponent;
  let fixture: ComponentFixture<CartographyDrawLandmarkParamsComponent>;
  let keycloak: KeycloakService;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [CartographyDrawLandmarkParamsComponent, TranslateModule.forRoot()],
      providers: [
        provideMockStore(),
        { provide: NGXLogger, useValue: LoggerMock },
        { provide: KeycloakService, useValue: KeycloakServiceMock },
        AuthentificationService
      ]
    });
    fixture = TestBed.createComponent(CartographyDrawLandmarkParamsComponent);
    keycloak = TestBed.get(KeycloakService);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

in my other tests I can mock any service but this is not possible with KeycloakService Cannot find module 'keycloak-angular/services/keycloak.service'

[mauriciovigolo]

Hey @memory660, could you provide a link at codepen.io or similar with the issue you are describing?

[memory660]

now it work !!