Does shallow-render support ViewChild queries?

Hello,

I have the next component tree:

            AppComponent
                 |
                 |
           ParentComponent
                 |
                 |
            ChildComponent

The ParentComponent has a ViewChild reference to ChildComponent. When i mock ChildComponent by hand in the ParentComponent spec, it renders but never gets the reference to the ViewChild. Is any way to solve this using shallow-render?

If it helps, this repo has an example of the case i explained above: https://github.com/Ivykp/test-viewchild-mock

Thanks!

[ike18t]

Hi @ticklemycode ,

I noticed a few problems with your stackblitz example:

• Needs to use dontMock or neverMock the FormsModule
• Needed to dispatchEvent on the input so that ngModel will update
• “value” was misspelled in the assertions

Here are my updates: https://stackblitz.com/edit/github-jc7sw5-bq4p3x?file=examples%2Fcomponent-with-view-child.spec.ts

[getsaf]

Looks like the issue you’re seeing here is that, Shallow mocks ALL modules except for CommonModule by default. This means, Angular’s FormsModule is being mocked but your test is expecting stuff from the FormsModule to behave normally. Since most (all?) of the things in the FormsModule are self-contained (eg: nothing inside the module has dependencies outside the forms module), you can/should safely be able to use the real FormsModule in your specs.

If your project uses FormsModule excessively, I’d recommend neverMocking it in your karma setup:

Shallow.neverMock(FormsModule);

If you just need a one-off, you can do it right in your test:

shallow = new Shallow(MyComponent, MyModule).dontMock(FormsModule);

^-- This worked in my fork of your StackBlitz example