Get Free Trial

TypeError when Dragging a Field to the Bottom of the Window

Re-Open
Henry asked on March 5, 2021

Hello,
 
We noticed that if we drag a field to the bottom edge of the window, we start to see numerous “Uncaught TypeError: Cannot read property ‘classList’ of null” errors in the console. We thought we’d bring this up as it appears to be a bug.
We’ve also prepared a jsFiddle and video for convenience.

  • One observation we had was that it only happens when we drag a field to the bottom of the window. That is, if the field is dragged to the left, right, or top, then the error does not occur.
  • Video
  • Fiddle

 
Kind regards,
Henry

8 answers

Public
Vera Didenko Vera Didenko Flexmonster March 5, 2021

Hello, Henry, 
 
Thank you for writing to us and for providing details about the issue.
 
We would like to confirm that this is not the expected behavior. 
Our team will provide the fix to this issue in the minor release version with the ETA 5th of April.
 
Please let us know if this would work for you.
 
Kind regards,
Vera

Public
Henry March 5, 2021

Hello, Vera,
 
That works for us, thanks for the quick response!
 
Kind regards,
Henry

Public
Vera Didenko Vera Didenko Flexmonster April 6, 2021

Hello, Henry,
 
We are glad to announce that the exception when dragging a field to the bottom of the window was fixed.
 
This is available in the latest version of Flexmonster.
You are welcome to update the component. Here is our updating to the latest version guide for assistance.
 
Please let us know if the fix works fine for you.
Looking forward to your feedback.
 
Kind regards,
Vera

Public
Henry April 6, 2021

Hello, Vera,
 
It appears that 2.8.30 has fixed it for the fiddle above, but we still see the same error in our application. I believe it is because of how we styled our html elements – we’ve prepared a jsFiddle for convenience. Specifically,

  1. We have a container that takes the full height of the window – this css class is named .full-height
  2. Within this container we have various content, one of which that has an overflow: auto property, this css class is named .overflow
    1. Within the .overflow container, another container to group elements related to the pivot table. This class is named .pivot-content
  3. When a field is dragged to the right edge of the window, the errors show up in the console.
  4. jsFiddle
    • One observation we had was that if we removed the overflow: auto property, the error seems to go away. However, due to some business constraints we need the overflow: auto property on the corresponding html element.

 
Please let us know if we need to clarify any of the above or if a video is needed; my microphone doesn’t want to pick up audio at the time of this post.

Public
Vera Didenko Vera Didenko Flexmonster April 7, 2021

Hello, Henry, 
 
Thank you for your detailed response and for providing a JSFiddle for illustration.
Our team will take a closer look, and we will provide an update with the ETA 17th of May.
 
Please let us know if this would work fine for you.
 
Kind regards,
Vera

Public
Henry April 7, 2021

Hello, Vera,
 
Yes, that will work for us. We will see if we can restyle some of our html elements in the meantime.
 
Kind regards,
Henry

Public
Vera Didenko Vera Didenko Flexmonster May 19, 2021

Hello, Henry, 
 
We are happy to inform you that the exception when dragging a field to the side (and out) of the window in a specific layout was fixed.
This is available in the latest (2.8.33) version of Flexmonster.
 
You are welcome to update the component. Here is our updating to the latest version tutorial for guidance.
 
Please let us know if the fix works fine for you.
Looking forward to your feedback.
 
Kind regards,
Vera

Public
Henry May 19, 2021

Hello, Vera,
 
Upgrading to 2.8.33 looks to have fixed the exception, much thanks to you and the team!
 
Kind regards,
Henry

Please login or Register to Submit Answer