'NullInjectorError: No provider for InjectionToken MatDialogData

I'm getting this error when running jasmine tests on my Angular app.

Error: StaticInjectorError(DynamicTestModule)[MyEditDialogComponent -> InjectionToken MatDialogData]: 
  StaticInjectorError(Platform: core)[MyEditDialogComponent -> InjectionToken MatDialogData]: 
    NullInjectorError: No provider for InjectionToken MatDialogData!
error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ 'MyEditDialogComponent', InjectionToken MatDialogData ], ngDebugContext: DebugContext_({ view: Object({ def: Object({ factory: Function, nodeFlags: 33669121, rootNodeFlags: 33554433, nodeMatchedQueries: 0, flags: 0, nodes: [ Object({ nodeIndex: 0, parent: null, renderParent: null, bindingIndex: 0, outputIndex: 0, checkIndex: 0, flags: 33554433, childFlags: 114688, directChildFlags: 114688, childMatchedQueries: 0, matchedQueries: Object({  }), matchedQueryIds: 0, references: Object({  }), ngContentIndex: null, childCount: 1, bindings: [  ], bindingFlags: 0, outputs: [  ], element: Object({ ns: '', name: 'app-edit-ban-dialog', attrs: [  ], template: null, componentProvider: Object({ nodeIndex: 1, parent: <circular reference: Object>, renderParent: <circular reference: Object>, bindingIndex: 0, outputIndex: 0, checkIndex: 1, flags: 114688, childFlags: 0, directChildFlags: 0, childMatchedQueries: 0, matchedQueries: Object, matchedQueryIds: 0 ...
Error: StaticInjectorError(DynamicTestModule)[MyEditDialogComponent -> InjectionToken MatDialogData]: 
  StaticInjectorError(Platform: core)[MyEditDialogComponent -> InjectionToken MatDialogData]: 
    NullInjectorError: No provider for InjectionToken MatDialogData!

I am importing in my component:

import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';

In the component constructor I am Injecting data to the dialog:

 @Inject(MAT_DIALOG_DATA) public data: {
        myData : MyData
    }

In my karma jasmin spec for the component I am importing:

import {
    MatFormFieldModule,
    MatInputModule,
    MatDialogModule,
    MatDialogRef,
    MAT_DIALOG_DATA,
    MatButtonModule,
    MatRadioModule,
    MatSelectModule
} from '@angular/material';

In the karma/jasmine spec for the component, imports and providers in beforeEach:

 beforeEach(async(() => {
    TestBed.configureTestingModule({
        declarations: [ MyFormComponent ],
        imports: [
            MatFormFieldModule,
            MatInputModule,
            MatDialogModule,                               
        ],
        providers: [
            { provide: MatDialogRef, useValue: {} },
            { provide: MAT_DIALOG_DATA, useValue: { myData: MyData } }
        ]
    }).compileComponents();
}));

I've tried these answers but they don't fix the issue This This

Solution 1:^[1]

in my case, I imported the directives MatDialogModule, MAT_DIALOG_DATA and MatDialogRef

import { MatDialogModule, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';

and then within beforeEatch():

imports: [ MatDialogModule],
providers: [
    { provide: MAT_DIALOG_DATA, useValue: {} },
    { provide: MatDialogRef, useValue: {} }
  ]

Solution 2:^[2]

Try removing MatDialogRef and MAT_DIALOG_DATA from the karma jasmin spec, and the component you need to be dialog import like this:

imports: [
    DynamicModule.withComponents([YOUR_DIALOG_COMPONENT])
]

Solution 3:^[3]

i tried this and worked ! do this in your components constructor

constructor(
    private injector: Injector,
  ) {
    super();
    this.dialogData = this.injector.get(MAT_DIALOG_DATA, null);
    if (this.dialogData) {
     // do your job here
    }

}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	LaCodeM
Solution 2	g4b0.88
Solution 3	Ali Hosseinkhani

'NullInjectorError: No provider for InjectionToken MatDialogData

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]

Solution 3:^[3]