Angular - Jest can handle import entry point

Currently im trying to create simple test for a component that is using rete.js, but for some reason the test if falling because cant handle one of the import path that is need it.

Component

import { Component, ElementRef, Injector, ViewChild } from '@angular/core';
import { EditorCreatorService } from './edtitor-creator';

@Component({
  selector: 'exb-visual-workflow-editor',
  templateUrl: 'visual-workflow-editor.component.html',
  styleUrls: ['visual-workflow-editor.component.scss'],
})
export class VisualWorkflowEditorComponent {
  @ViewChild('rete')
  container!: ElementRef;

  constructor(private injector: Injector, private readonly editorCreatorService: EditorCreatorService) {}

  ngAfterViewInit(): void {
    const el = this.container.nativeElement;

    if (el) {
      this.editorCreatorService.createEditor(el, this.injector);
    }
  }
}

service

import { NodeEditor, GetSchemes, ClassicPreset } from 'rete';
import { Injector, Injectable } from '@angular/core';
import { AreaPlugin } from 'rete-area-plugin';
import { ConnectionPlugin, Presets as ConnectionPresets } from 'rete-connection-plugin';

import { AngularPlugin, AngularArea2D, Presets as AngularPresets } from 'rete-angular-plugin/16'; -----> Import Error

import { CustomSocketComponent } from './customization/custom-socket/custom-socket.component';
import { CustomNodeComponent } from './customization/custom-node/custom-node.component';
import { CustomConnectionComponent } from './customization/custom-connection/custom-connection.component';

import { addCustomBackground } from './customization/custom-background';

type Schemes = GetSchemes<ClassicPreset.Node, ClassicPreset.Connection<ClassicPreset.Node, ClassicPreset.Node>>;
type AreaExtra = AngularArea2D<Schemes>;

const socket = new ClassicPreset.Socket('socket');

@Injectable()
export class EditorCreatorService {

  async createEditor(container: HTMLElement, injector: Injector) {
    const editor = new NodeEditor<Schemes>();
    const area = new AreaPlugin<Schemes, AreaExtra>(container);
    const connection = new ConnectionPlugin<Schemes, AreaExtra>();

    const angularRender = new AngularPlugin<Schemes, AreaExtra>({ injector });

    angularRender.addPreset(
      AngularPresets.classic.setup({
        customize: {
          node() {
            return CustomNodeComponent;
          },
          connection() {
            return CustomConnectionComponent;
          },
          socket() {
            return CustomSocketComponent;
          },
        },
      }),
    );

    connection.addPreset(ConnectionPresets.classic.setup());

    addCustomBackground(area);

    editor.use(area);
    area.use(connection);

    area.use(angularRender);

    const aLabel = 'Custom';
    const bLabel = 'Custom';

    const a = new ClassicPreset.Node(aLabel);
    a.addOutput('a', new ClassicPreset.Output(socket));
    a.addInput('a', new ClassicPreset.Input(socket));
    await editor.addNode(a);

    const b = new ClassicPreset.Node(bLabel);
    b.addOutput('a', new ClassicPreset.Output(socket));
    b.addInput('a', new ClassicPreset.Input(socket));
    await editor.addNode(b);

    await area.translate(a.id, { x: 0, y: 0 });
    await area.translate(b.id, { x: 300, y: 0 });

    await editor.addConnection(new ClassicPreset.Connection(a, 'a', b, 'a'));

    return {
      destroy: () => area.destroy(),
    };
  }

}

Test

import { EditorCreatorService } from './edtitor-creator';
import { VisualWorkflowEditorComponent } from './visual-workflow-editor.component';
import { render, RenderResult } from '@testing-library/angular';

describe('WorkflowEditorComponent', () => {
  let component: RenderResult<VisualWorkflowEditorComponent>;
  let createEditorSype: jest.SpyInstance;
  let editorCreatorServiceMock: Partial<EditorCreatorService>;

  beforeEach(async () => {
    editorCreatorServiceMock = {
      createEditor: jest.fn().mockReturnValue({}),
    };

    component = await render(VisualWorkflowEditorComponent, {
      providers: [
        {
          provide: editorCreatorServiceMock,
        },
      ],
    });
    createEditorSype = jest.spyOn(editorCreatorServiceMock, 'createEditor');
  });

  it('should create', () => {
    expect(createEditorSype).toHaveBeenCalledTimes(1);
  });
});

After mocking the service instead of injecting it in the test, the error for the import still happening from some reason.

Solution

As mentioned in on the of the comment the issue was that jest could not resolve the nested package so i have to map the path in the jest.config.js.

moduleNameMapper: {
  '^lodash-es$': 'lodash',
  '^rete-angular-plugin/16$': 'rete-angular-plugin',
  '^@exb/(.*)$': `${libsDir}/$1/src/public-api.ts`
},