No provider for MockDialogRef

Question

Here's the component constructor:

constructor(
  public dialogRef: MatDialogRef<TaskActionModalContainer>,
  @Inject(MAT_DIALOG_DATA) data
) {}

Here's the testbed:

TestBed.configureTestingModule({
  imports: [ MatDialogModule ],
  declarations: [ TaskActionModalContainer ],
  schemas: [
    CUSTOM_ELEMENTS_SCHEMA
  ],
  providers: [
    {
      provide: MatDialogRef,
      useValue: {},
    },
    {
      provide: MAT_DIALOG_DATA,
      useValue: {}
    }
  ]
})
.compileComponents();

Here's the error:

StaticInjectorError(DynamicTestModule)[TaskActionModalContainer -> MatDialogRef]: 
  StaticInjectorError(Platform: core)[TaskActionModalContainer -> MatDialogRef]: 
    NullInjectorError: No provider for MatDialogRef!

I've searched high and low and see this NullInjector error everywhere, but I'm continuing to get it. I thought an angular guru could solve this quickly.

Help!

EDIT:

I've also used useClass with no success.

Of interest is that I also have this:

  beforeEach(inject(
    [
      MatDialogRef,
      MAT_DIALOG_DATA
    ],
    (
      dialogRef,
      dialogData
    ) => {
    console.log(dialogRef);
    console.log(dialogData);
  }));

and I am seeing those console.log's when running the test....right before it shows me the error at TestBed.createComponent

EDIT #2 - I feel like this is because this is an entryComponent, which I have no idea what that means, but this is one. I have a ModalContainer which pops up this one (so I guess it's a dynamically created one) - any help there?

Mistakenly closed this as a dupe, mine was about unit testing so the answer is a little more nuanced.

create a `Stub` class with just a constructor and substitute `useValue` for `useClass: Stub` in your providers array — Mike Tung, Feb 11 '19 at 20:24
Did you try [this answer](https://stackoverflow.com/a/47294991/1009922)? We don't see the file `import`s in your question. — ConnorsFan, Feb 11 '19 at 20:32
@ConnorsFan - yeah, I've tried them all. I feel like the error I'm seeing isn't actually the problem. It's like my providers aren't being picked up at all... — Adam Jenkins, Feb 11 '19 at 20:42
What does your @Component decorator look like for the TaskActionModalContainer? Are you declaring any providers there? — dmcgrandle, Feb 11 '19 at 21:43
@dmcgrandle - great question! But no, just the usual - templateUrl styleUrls and selector. — Adam Jenkins, Feb 11 '19 at 22:27
@ConnorsFan - you got it, I'm going to post a comment on that one and close this one as a dupe of it. It's a bit more nuanced - in my test I was importing from @angular/material/dialog but in my component I was importing from @angular/material......lost about 5 hours and a lot of nerves on this. — Adam Jenkins, Feb 11 '19 at 22:48
Possible duplicate of [NullInjectorError: No provider for MatDialogRef](https://stackoverflow.com/questions/47270324/nullinjectorerror-no-provider-for-matdialogref) — ConnorsFan, Feb 11 '19 at 22:51
@ConnorsFan - changed my mind. I decided to leave this one open because my answer is a bit different as it's geared towards unit testing. I've posted an answer below for all the lost souls who'll come across this question :) — Adam Jenkins, Feb 11 '19 at 22:53
Please note that closing it as duplicate would keep your current answer available (as shown in [this post](https://stackoverflow.com/q/48868098/1009922)). — ConnorsFan, Feb 11 '19 at 23:35

score 0 · Answer 1 · answered Feb 11 '19 at 22:52

For anybody else who encounter this problem while unit testing, the answer in the comments came very close to answering my question but the real deal is that both the spec file AND the component file must import MatDialogRef and MAT_DIALOG_DATA from the same place - @angular/material/dialog

My component looked like this:

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

and my test looked like this:

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

Changing my component imports to match my test fixed it!

No provider for MockDialogRef

1 Answers1