Cannot read properties of null (reading 'length') at at et._redrawToolbar

Answered
VC asked on April 22, 2022

Hi, 
We occasionally see this error in our production logs coming from flexmonster  _redrawToolbar call. We don't know exactly under which conditions this happens and we don't have a way to reproduce it.  Does anyone have any ideas what might be happening ? Is this is a known issue ? 
P.S. We are using angular flexmonster component and we don't do anything special with it, other than hiding some of the toolbar items like this. 
 

 const tabs = toolbar.getTabs();
    toolbar.getTabs = () => {
      // delete the tabs that we don't want
      delete tabs[0]; // connect
      delete tabs[1]; // open
      delete tabs[2]; // save
      // delete tabs[3];  // Preconfigured
      delete tabs[4]; // divider
      delete tabs[5]; // grid
      delete tabs[6]; // charts
      delete tabs[7]; // divider
      // delete tabs[8];  // format
      delete tabs[9]; // options
      // delete tabs[10];  // fields
      // delete tabs[11];  // divider
      // delete tabs[12];  // fullscreen

      return tabs;
    };

 
 
Thanks
 

13 answers

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster April 22, 2022

Hello!
 
Thank you for writing to us.
 
We haven't managed to reproduce the described issue on our side too.
Could you please provide us with a stack trace? It can greatly help us move on with the investigation and find the exception.
 
Looking forward to your response.
 
Regards,
Solomiia.

Public
VC April 22, 2022

Hi
Yes, we can't repro either but somehow our customers seem to be running into this in production from time to time. And we actually got a few more today and also a new one about 'reading b4'. Here's the stack we got: 
 
TypeError: Cannot read properties of null (reading 'length')
at c (webpack:///node_modules/flexmonster/flexmonster.full.js:2803:86)
at a.toolbarWrapper.appendChild(a.listWrapper);a.toolbar=document.createElement("ul");a.toolbar.setAttribute("role","menubar");a.toolbar.setAttribute("aria-orientation","horizontal");a.addClass(a.toolbarWrapper,"fm-toolbar-ui");a.toolbar.id="fm-toolbar";if (webpack:///node_modules/flexmonster/flexmonster.full.js:2801:480)
at _redrawToolbar (webpack:///node_modules/flexmonster/flexmonster.full.js:2807:350)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:406:30)
at onInvokeTask (webpack:///node_modules/@angular/core/fesm2020/core.mjs:25840:32)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:405:59)
at task._transitionTo (webpack:///node_modules/zone.js/fesm2015/zone.js:178:46)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:487:33)
at callback (webpack:///node_modules/zone.js/fesm2015/zone.js:1600:13)
at tasks.slice (webpack:///node_modules/zone.js/fesm2015/zone.js:1637:20)
TypeError: Cannot read properties of null (reading 'length')
at c (webpack:///node_modules/flexmonster/flexmonster.full.js:2803:86)
at a.toolbarWrapper.appendChild(a.listWrapper);a.toolbar=document.createElement("ul");a.toolbar.setAttribute("role","menubar");a.toolbar.setAttribute("aria-orientation","horizontal");a.addClass(a.toolbarWrapper,"fm-toolbar-ui");a.toolbar.id="fm-toolbar";if (webpack:///node_modules/flexmonster/flexmonster.full.js:2801:480)
at _redrawToolbar (webpack:///node_modules/flexmonster/flexmonster.full.js:2807:350)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:406:30)
at onInvokeTask (webpack:///node_modules/@angular/core/fesm2020/core.mjs:25840:32)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:405:59)
at task._transitionTo (webpack:///node_modules/zone.js/fesm2015/zone.js:178:46)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:487:33)
at callback (webpack:///node_modules/zone.js/fesm2015/zone.js:1600:13)
at tasks.slice (webpack:///node_modules/zone.js/fesm2015/zone.js:1637:20)
TypeError: Cannot read properties of null (reading 'b4')
at 1+"px";a.style.height=f.offsetHeight+"px";f.scrollLeft=f.scrollWidth;f.scrollTop=f.scrollHeight}Uta (webpack:///node_modules/flexmonster/flexmonster.full.js:99:133)
at 1+"px";a.style.height=f.offsetHeight+"px";f.scrollLeft=f.scrollWidth;f.scrollTop=f.scrollHeight}Uta (webpack:///node_modules/flexmonster/flexmonster.full.js:99:481)
at timer (webpack:///node_modules/zone.js/fesm2015/zone.js:2561:40)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:406:30)
at onInvokeTask (webpack:///node_modules/@angular/core/fesm2020/core.mjs:25840:32)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:405:59)
at task._transitionTo (webpack:///node_modules/zone.js/fesm2015/zone.js:178:46)
at invokeTask (webpack:///node_modules/zone.js/fesm2015/zone.js:487:33)
at invoke (webpack:///node_modules/zone.js/fesm2015/zone.js:476:47)
at function (webpack:///node_modules/zone.js/fesm2015/zone.js:2541:31)

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster April 26, 2022

Hello!
 
Thank you for providing us with the stack trace.
 
We recommend you update the component. Here is our guide for assistance: https://www.flexmonster.com/doc/updating-to-the-latest-version/.
If your major version is lower than 2.9, please, look through the migration guides: https://www.flexmonster.com/doc/migration-guide-from-2-8-to-2-9/.
 
Looking forward to your response.
 
Regards,
Solomiia.

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster May 3, 2022

Hello!

Hope you are having a great week.
 
Our team was wondering if you had a chance to update the component and check if the problem still exists.
 
Looking forward to your response.
 
Regards,
Solomiia

Public
VC May 3, 2022

Hi. 

Thanks for following up. We haven't pushed the latest version yet. We'll try to do so in our next release. It will take some time to know if the latest release fixes it or not though, since the problem occurs only sporadically (even as it stands now, we only get it once or twice per month) 

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster May 3, 2022

Hello again!

Thank you for the explanation.
 
Your confirmation is valuable to our team, so we'll be waiting for the following updates on the case.
 
Please, feel free to ask if any further questions arise.
 
Best regards,
Solomiia

Public
VC May 27, 2022

Hello, 
I was able to consistently repro this issue and it exists even in the latest version. To duplicate this you'd need a SPA application in angular with a way to quickly leave a report via navigation to a different angular page (component): 

  1. Open a report
  2. Click fullscreen
  3. Close fullscreen
  4. Click on the navigation link that takes you to a different route
  5. As soon as the new page loads resize the window quickly

At this point the error should appear. Further - from now on you won't be able to fullscreen a report without it blowing up with the same error. 
Any ideas ? 
P.S. In our component that contains flexmonster we make sure to dispose of it like so: 
 

 if (this.pivot) {
      this.pivot.flexmonster.dispose();
    }

 
But its as if flexmonster somehow holds on to resize events after going fullscreen even after being destroyed 

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster May 30, 2022

Hello!

Thank you for the detailed description of how to reproduce the issue. It was very helpful.

We have managed to reproduce the described behavior on our side. Our development team will look closer at the case and provide you with a solution by the ETA on June 27th. We will notify you about the updates.

Feel free to contact us in case of any other questions.

Regards,
Solomiia

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster June 28, 2022

Hello!
 
Hope you are doing well.
 
We are glad to announce that the issue with redrawing the Toolbar was fixed.

This fix is provided in the 2.9.28 version of Flexmonster: https://www.flexmonster.com/release-notes/version-2-9-28/.
You are welcome to update the component. Check out our updating tutorial for guidance: https://www.flexmonster.com/doc/updating-to-the-latest-version/.

Please let us know if the fix works for you.

Best regards,
Solomiia

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster July 5, 2022

Hello!

Hope you are having a great week.

Our team is wondering if you had a chance to test the fix. Could you please let us know if it works for you?

Looking forward to hearing from you.

Regards,
Solomiia

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster July 12, 2022

Hello!

Hope you are doing well.

Just checking in to ask if the fix works well for you.

Looking forward to your feedback.

Regards,
Solomiia.

Public
VC August 31, 2022

Hi. I think it is fixed now. It's been about a month that we released the new version and haven't seen those issues so far

Public
Solomiia Andrusiv Solomiia Andrusiv Flexmonster August 31, 2022

Hello!

Thank you for getting back to us.

We are glad to hear that our fix worked well.

You are welcome to contact us in case of any other questions.

Kind regards,
Solomiia

Please login or Register to Submit Answer