I have a Handsontable component in react where the context menu works fine in columns that do not have custom renderers, but does not seem to work on those columns that do have custom renderers.
My custom renderers are even calling into the base renderers’ apply() methods after doing a few other things. I’ve also tried passing the contextMenu into the column settings (instead of just the top level table react component), but it still didn’t work.
Is this a known bug?
Hi @taylor
Can you please share your renderer code with us (live demo would be the best, but you can also send just a code snippet)? Also, are you using default contextMenu: true or maybe do you use some custom options?
Thanks for the reply. Here are the relevant code snippets. Note that any time we don’t set the renderer on the react component, or we set it to one of the Handsontable renderers, the context menu works fine.
–REMOVED CODE SNIPPETS SINCE THEY ARE NOT RELEVANT. SEE MY FINAL POST FOR SOLUTION–
So now I’m really going crazy. I recreated the problem in a really simple code sandbox, but the problem seems to go away if I load this in an incognito browser: https://codesandbox.io/s/declaring-column-settings-forked-ehkz5?file=/src/index.js
I’ve tried clearing cache, deleting all temp files, etc… this consistently does NOT work in a non- incognito Chrome browser, and then works fine in an incognito browser.
Help?
Hi @taylor if it works in incognito mode and doesn’t work in default mode the first what comes to mind is that some add-on might blocking it. Did you test it also on different browsers?
@adrian.szymanski Thanks for the replies so far. I still haven’t figured out what caused the issue in that screenshot, however I have solved my original issue.
For future reference for anyone that sees this: Do NOT add any CSS styling that might change the z-index values within Handsontable. It appears they rely heavily on z-indexes, and modifying them causes very strange behavior such as the context menu not appearing, double-clicking not working to edit fields, etc.
@taylor that is true, all layering of Handsontable uses z-index with 100+ index value (ht_clone elements (ref: https://cdn.jsdelivr.net/npm/handsontable@11/dist/handsontable.full.css)
