Conflicting components: MatFormField,MatFormField while Testing with Angular 8

[ignaciojvig]

Reproduction

Steps to reproduce:

1. Import "MatSelectModule" in my-component.spec.ts
2. Run "npm run test"

Expected Behavior

Jest running my tests as expected

Actual Behavior

An error is thrown, with the current message:

Template parse errors:
More than one component matched on this element. Make sure that only one component's selector can match a given element. Conflicting components: MatFormField,MatFormField

If I remove 'MatSelectModule', I got another error:

Template parse errors:
'mat-select' is not a known element:

1. If 'mat-select' is an Angular component, then verify that it is part of this module. 2. If 'mat-select' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
   

Environment

• Angular: ~8.2.14
• CDK/Material: ^8.2.3
• Browser(s): Chrome 80.0.3987.87
• Operating System (e.g. Windows, macOS, Ubuntu): Windows

[jelbourn]

This sounds like an issue with your environment. I would recommend trying the latest version and potentially clearing your node_modules

[omnibrain]

@ignaciojvig I'm having the exact same problem after migrating from Karma to Jest. Did you find a solution to this?

[ignaciojvig]

@omnibrain unfortunatly i had no success using Jest :(
I switched back to Karma and it started working

[jaganathanb]

Looks like it is material ui issue.

If you have MatInputModule and MatSelectModule, you will end up getting this error. Just remove MatInputModule it works. mat-select module internally includes mat-input module it seems.

[jelbourn]

Closing since this seems to be unrelated to Angular Material itself.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}