Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

@ContentChild mocking fails with html attribute selection

See original GitHub issue

When mocking a component that has @ContentChild projection, the generated mock will be invalid if the @ContentChild uses an HTML attribute selector.

e.g. @ContentChild('[projectedContent]'... with <div projectedContent>This is not mockable</div>

This does not appear to be an issue when using Angular template reference selection

e.g. @ContentChild('projectedContent'... with <div #projectedContent>This is mockable</div>

When running the tests, they fail with the error TypeError: Cannot read property 'undefined' of undefined

I’ve created a repo to demonstrate the issue at https://github.com/joebell1329/contentProjectionDemo

When running the tests in the demo, the issue seems to be with the generated HTML in ng://DynamicTestModule/MockOfNotMockableComponent.html

The error is thrown on the line <div *ngIf="mockRender_[projectedContent]" data-key="[projectedContent]">

Issue Analytics

State:
Created 4 years ago
Reactions:1
Comments:6 (5 by maintainers)

Top GitHub Comments

1reaction

satanTimecommented, Apr 27, 2021

Hi @GerkinDev, yes, please create a new one with an example. Finally, this weekend I have my hands on the issues.

0reactions

GerkinDevcommented, Apr 27, 2021

Hi,

I’m experiencing this issue as well. In my case, I want to use an optional ContentChild selected by attribute. The error TypeError: Cannot read property 'undefined' of undefined is thrown if I do not declare an ng-template with the selected attribute.

Should I open a new issue with proper sample ?

Top Results From Across the Web

ContentChild mocking fails with html attribute selection #68

When mocking a component that has @ContentChild projection, the generated mock will be invalid if the @ContentChild uses an HTML attribute ...

Testing @ContentChildren() in Angular 5

I have a need to test that my @ContentChildren are being populated correctly using ... but my code fails on the line indicated...

ng-mocks

An Angular testing library for creating mock services, components, directives, pipes and modules in unit tests.

Heading Off 11 Common Angular Application Design, Best ...

As this example shows, ContentChild is often utilized to help control formatting or DOM manipulation when a component or directive expects a specific...

Understanding ViewChildren, ContentChildren, and ...

There are times when a parent component needs access to his children. Let's see how we can handle this with Angular. Now let's...