Storybook TypeError: Cannot read properties of undefined (reading 'id')

Question

I am trying to configure a storybook story for a component that has injection with ng2-signalr service.

import { NameComponent } from './name.component';
import { SignalRConfiguration, SignalRModule } from 'ng2-signalr';
export function createConfig(): SignalRConfiguration {
  const config = new SignalRConfiguration();
  config.logging = true;
  // >= v5.0.0
  config.executeEventsInZone = true; // optional, default is true
  config.executeErrorsInZone = false; // optional, default is false
  config.executeStatusChangeInZone = true; // optional, default is true
  return config;

}

export default {

  title: 'NameComponent',

};

 

export const primary = () => ({

  moduleMetadata: {

    imports: [

      SignalRModule.forRoot(createConfig),

    ] as any[],

  },

  component: NameComponent,

  props: {


  },

});

I am getting this error:

index.js:47 TypeError: Cannot read properties of undefined (reading 'id') at registerNgModuleType (core.js:24809:1) at core.js:24820:1 at Array.forEach () at registerNgModuleType (core.js:24820:1) at new NgModuleFactory (core.js:24923:1) at compileNgModuleFactory__POST_R3__ (core.js:28555:1) at PlatformRef.push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModule (core.js:28781:1) at draw (helpers.js:120:1) at Object.push../node_modules/@storybook/angular/dist/client/preview/angular/helpers.js.exports.renderNgApp (helpers.js:133:1) at render (render.js:8:1)

I tried removing the node_module folder and npm installing again but this didn't solve it.

Answer 1

I did some debugging and found the error was here:

and found this answer is helpful:

https://stackoverflow.com/a/70860805/2727006