question-mark
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.

bug(accordion) "TypeError: Cannot read property 'pipe' of undefined"

See original GitHub issue

Bug, feature request, or proposal:

Bug

What is the expected behavior?

That accordion works normally

What is the current behavior?

In some cases a TypeError: Cannot read property 'pipe' of undefined is fired, breaking everything.

What are the steps to reproduce?

I tried to reproduce the behaviour but could not reproduce on StackBlitz. If I remove the accordion wrapper, there are no problems with underlying expansion panels. The error is fired here

https://github.com/angular/material2/blob/32a001051f15d5073475c7c3bc17a0a46dabf4cd/src/lib/expansion/expansion-panel-header.ts#L73-L74

apparently because _stateChanges results undefined. At first I thought it was some problem of my code, but the bug presented itself in two different and unrelated occasions.

In both occasions I’m adding dynamically the component which is using the accordion: in one case I’m loading the component using ComponentFactoryResolver, in the second one I’m loading the component with the Router and putting it in a router-outlet.

This is my StackBlitz trial until now (as I said, it works fine, because I cannot pinpoint the real issue): https://stackblitz.com/edit/angular-material2-issue-netdsn

What is the use-case or motivation for changing an existing behavior?

It’s broken.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 6.1.2 Material 6.4.7 TS 2.9.x

Is there anything else we should know?

Everything worked fine with Material 6.4.5, it broke when I upgraded to 6.4.7.

If anyone has suggestion in where I should look for further debugging, I’ll be glad to try.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:2
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

4reactions
devversioncommented, Sep 14, 2018

@IlCallo Thanks for your issue. For some reason I couldn’t think of any scenario where _stateChanges is undefined because we have a safety check for panel.accordion and the accordion initializes always with the _stateChanges property member.

Could it be the case that the CDK and Material version mismatch on your local project? This would explain why the _stateChanges property member is undefined.

3reactions
IlCallocommented, Sep 14, 2018

You guessed right (are you a magician?): it was a mismatch version problem. My package.json got messed up for some reason and with last update it updated all packages except for the CDK one, thank you!

Read more comments on GitHub >

github_iconTop Results From Across the Web

TypeError: Cannot read property 'pipe' of undefined
I'm getting some error as TypeError: Cannot read property 'pipe' of undefined. I'm using Angular 7 and I have tried different code samples ......
Read more >
Cannot Read Property 'Pipe' Of Undefined - Angular Unit Test
The error is : Cannot read property 'next' of undefined All about pipes - Custom pipe, Pure-Impure and more. I keep having issues...
Read more >
[Solved]-TypeError: Cannot read property 'pipe' of undefined
Coding example for the question TypeError: Cannot read property 'pipe' of undefined - Angular Unit test-angular.js.
Read more >
Uncaught TypeError: Cannot read property of undefined
If you get undefined error, you need to make sure that which ever variables throws undefined error, is assigned a value to it....
Read more >
typeerror: cannot read properties of undefined (reading 'pipe')
You are mocking the doPost method of the apiService as a function that is returning undefined , but you are trying to call...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found