CUSTOM_ELEMENTS_SCHEMA is ignored for WebComponents

[MatthieuNarcisi]

We are trying to use the modern MockBuilder to mock a component and its module.

The component makes use of WebComponents (developed via StencilJS).

When trying to add the CUSTOM_ELEMENTS_SCHEMA token with the method beforeCompileComponents, I still have the error in the console that the CUSTOM_ELEMENTS_SCHEMA token should be defined.

There is how to reproduce the issue : https://stackblitz.com/edit/github-yynxfc?file=src%2Ftest.spec.ts (the error appears in the console).

When using the classic way of doing things (via TestBed), I don't have any issue : https://stackblitz.com/edit/github-yzyftf?file=src%2Ftest.spec.ts

Any idea of what I might be doing wrong ?

[satanTime]

Hi @MatthieuNarcisi,

thank you for the report.

Do I understand correctly that you don't import custom-component anywhere in your app?

@NgModule({
  imports: [CommonModule],
  declarations: [TargetComponent],
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
class TargetModule {}

I found out that it will work like that, but not sure if it's something what would suite you.

Could you try this build in your app? ng-mocks.zip

[MatthieuNarcisi]

Hi, thank you. It is exactly that, as custom-component is a WebComponent, it cannot be imported as an Angular component or part of a module (as stated in the second point of the error message).

I will try the build tomorrow and give you feedback as soon as possible.

[MatthieuNarcisi]

Hi @satanTime,

Getting back to you, I could test the zip you provided me today and it is working perfectly.

Thank you for all your outstanding work !

[satanTime]

Great. I'll release it asap.

[satanTime]

v14.3.4 has been released and contains a fix for the issue. Feel free to reopen the issue or to submit a new one if you meet any problems.