outsideClickDeselects and CSS display triggers whole table to be rendered

Tags: #<Tag:0x00007efc729e5028> #<Tag:0x00007efc729e4da8>
#1

Hello,

If I set outsideClickDeselects={false} option and change the CSS display to ‘none’ and ‘block’ again, the whole table rerenders and experience a performance issue.
Could you please help me with this problem? You can check it with the below fiddle and commenting out the outsideClickDeselects={false} option, then clicking the button to change the display setting.

https://jsfiddle.net/1fp46hyj/10/

#2

Hi @hjeong1200

Yes, managing the visiblity through display: none/block might cause issues like the one your described. The way to do it seamlessly is to manage it vie visibility: hidden/visible. Then everything works fine. Here’s an example: https://jsfiddle.net/handsoncode/eg8jzanb/

#3

Hello @adrian.szymanski

Thank you for the information. But sadly, changing to visibility is not an option for me because it is a part of another library that I can’t control.

Also, my opinion is that the root problem is some action associated with outsideClickDeselects option rather than the CSS display option, because without outsideClickDeselects={false} Handsontable does not re-render all rows even if I change the CSS.

Is this a known issue and is there any plans to fix this? And could you please share any Github issue that is assossiated if there is one?

#4

Hi @hjeong1200

I did additional tests, and you are right. It seems that indeed outsideClickDeselects is responsible for this issue. I tried a few possible workarounds, but unfortunately nothing worked so far.

I reported your issue internally for further investigation and will update you once we have more information on possible fix.

#5

Hello @adrian.szymanski

Thank you very much! Please let me know if there is any update or possible workaround have been found since this issue is affecting my application’s performance a lot.

#6

Hi @hjeong1200

Of course, I will let you know as soon as we have anything new.

#7

Hello @adrian.szymanski

Is there any update for this issue? Maybe a cause of the issue or an workaround?

#8

Hi @hjeong1200

We haven’t put the issue on our roadmap yet. I’ll let you know once it gets there.

#9

Hi, @hjeong1200 I am happy to announce that this issue is fixed in v14.4.0.

Related pull request: https://github.com/handsontable/handsontable/pull/10989

Release notes: https://handsontable.com/docs/javascript-data-grid/release-notes/#_14-4-0

Thank you again for sharing the report!

1 Like
#10