Uncaught TypeError: Cannot read property 'querySelector' of undefined

[sercanboyraz]

Hi,

Syncfusion React DropDownButton component constantly is error.What can be the reason?

Any advice much appreciated.

Full Error,

Uncaught TypeError: Cannot read property 'querySelector' of undefined

    at DropDownButton.removeCustomSelection (drop-down-button.js:401)

    at Observer. (drop-down-button.js:558)

    at Observer.notify (observer.js:109)

    at DropDownButton.Base.trigger (base.js:184)

    at DropDownButton.closePopup (drop-down-button.js:554)

    at DropDownButton.mousedownHandler (drop-down-button.js:462)

DropDownButton.removeCustomSelection @ drop-down-button.js:401

(anonymous) @ drop-down-button.js:558

Observer.notify @ observer.js:109

Base.trigger @ base.js:184

DropDownButton.closePopup @ drop-down-button.js:554

DropDownButton.mousedownHandler @ drop-down-button.js:462

[Saranya Dhayalan]

Hi Sercan, 

 

Thank you for contacting Syncfusion support. 

 

We have checked the reported issue and this issue is not replicated in our end. In drop down button component, removeCustomSelection operation is properly working in our end.  

 

We have created the sample for your reported issue please refer to the below link. 

 

Sample Link: https://stackblitz.com/edit/react-dtyfjm 

 

Could you please check the above sample and get back to us if you need further assistance on this? 

 

Regards, 

Saranya D 

[Yogesh Patil]

I am having same error for TreeGrid component using Angular 8.

[Padmavathy Kamalanathan]

Hi Yogesh, 

 

Greetings from Syncfusion Support. 

 

QUERY: ERROR TypeError: Cannot read property 'querySelectorAll' of null 

 

We have checked your reported problem by preparing sample but we are unable to reproduce the issue at our end. For your convenience we have created the sample, refer to the below link.  

https://stackblitz.com/edit/angular-wp8u1y-d4dyj3 

The reported issue may occur when the edit form is undefined or null. So, please share the following details. 

 

1. Complete Tree grid code example.
   
2. If possible, reproduce the reported issue in the shared sample Or share the issue reproducible sample.
   
3. Video demonstrating on the issue.

 

The provided information will be helpful to provide you response as early as possible. 

  

Regards, 

Padmavathy Kamalanathan 

[Steven Ferguson]

Hi

I have found a way to reproduce this problem.

1) Create a DocumentEditorContainerComponent

2) Use the toolbarItems property on the container and add Images and/or Break (which contain a DropDownButton)

3) Destroy the DocumentEditorContainerComponent

4) When you make a mousedown anywhere on the page you get this error :

drop-down-button.js?e7e7:397 Uncaught TypeError: Cannot read property 'querySelector' of undefined

    at DropDownButton.removeCustomSelection (drop-down-button.js?e7e7:397)

    at Observer.eval (drop-down-button.js?e7e7:504)

    at Observer.notify (observer.js?811a:84)

    at DropDownButton.Base.trigger (base.js?3923:181)

    at DropDownButton.closePopup (drop-down-button.js?e7e7:501)

    at DropDownButton.mousedownHandler (drop-down-button.js?e7e7:444)

[Harini Chellappa]

Hi Steven, 

We couldn’t reproduce the reported scenario. Kindly check the below stackblitz sample and modify the same sample to reproduce the reported scenario in our end. It will be helpful for us to provide solution at the earliest. 

https://stackblitz.com/edit/react-5q3sns?file=index.js 

Regards, 

Harini C 

[Steven Ferguson]

Hi Harini,

You can reproduce with this stackblitz sample https://stackblitz.com/edit/react-5q3sns-yozc36

1) click on the close button under the document editor

2) click anywhere on the page

After you can even try to do any modification in the code to make the page Hot Reload and after the document editor is displayed wherever you click on the page you'll get the error.

It look like there is a listener onMouseDown not being removed when removing the document editor from the page. 

[Chieh Lin Lu]

I have the same problem in React Document Editor.  Please fix it as soon as you can !!

[Harini Chellappa]

Hi Steven/Chieh, 

Currently, we are checking on this. Will update further details by Aug 10^th, 2020. 

Regards, 

Harini C  

[Harini Chellappa]

Hi All, 

We have considered the reported scenario as bug and logged defect report. Fix will be included in our upcoming EJ2 patch release which is tentatively scheduled on Aug 26^th, 2020. Once included, will update you. You can also track the bug fix status from below link. 

https://www.syncfusion.com/feedback/16869/toolbar-items-with-image-not-destroyed-properly 

Regards, 

Harini C 

[Brandon M]

Still not fixed in the Angular version:

[Kurthis Banu Abdul Majeeth]

Hi Brandon, 

We tried to reproduce the reported issue in latest version 19.2.47. We are facing below issue whenever destroy document editor container. Currently,we are validating that issue. We will update further details by July 22,2021. 

Please find the issue in attached screenshot also: 

 

Regards, 

Kurthis Banu A. 

[Kurthis Banu Abdul Majeeth]

Hi Brandon,  

We have confirmed the reported issue as bug and logged the defect report. We will fix this issue and include in our EJ2 patch release which scheduled on August 4,2021.  

You can track the status of bug through below feedback link:  

https://www.syncfusion.com/feedback/26999/documenteditor-destroy-issue 

Regards, 

Kurthis Banu A. 

[Suriya Murugan]

Hi Brandon,

We are glad to announce that our latest EJ2 release(v19.2.49) is rolled out successfully and In that release, we have added the fix for reported issue.

Please upgrade your Ej2 package to latest version to resolve this issue.

https://www.npmjs.com/package/@syncfusion/ej2-documenteditor

Release notes: https://ej2.syncfusion.com/documentation/release-notes/19.2.49/#document-editor?type=all

Feedback link: https://www.syncfusion.com/feedback/26999/documenteditor-destroy-issue

Regards,

Suriya M.

[Jitendra Joshi]

Issue still persist in synfusion vue document editor component.

[Suriya Murugan]

Hi Jitendra,

We tried to reproduce the reported issue in the latest version 19.4.56, But we couldn’t.

We are not facing any issue whenever destroy document editor container.

If your issue was different from this please share us a screenshot with video demonstration to reproduce the reported issue at our end. Thereby we will provide the solution at earliest.

Regards,

Suriya M.

[Mohit Bohra]

did you get any solution for this i am also getting the error 

[Kavitha Muralitharan]

Hi Mohit,

Could you please share the exact issue along with a video demonstrating the replication procedure, a simple sample including the details of the version and platform you are currently using? This will help us to further validate the issue.

Regards,

Kavitha M