Support Forums

ChakraUI interplay with Netlify deployment causing bug (Gatsby site)

Hi, I’m having an annoying bug that I believe to be caused upon deployment only of my gatsby site. I can not recreate this bug in development mode, and therefore do not have a way to test what is wrong on deployment. This bug seems to be a combination of a UI library I’m using and Netlify itself. When deployed, menu link buttons do not show up when viewing on desktop. If i reduce the size of the viewport, then enlarge the screen again, everything works. Something is happening on the initial render of my website causing it to lose functionality. I was hoping to speak with someone and figure out what could be causing this. You can try this out yourself: https://www.mckeevineyard.net Thank you!

Hi @mcc4b3r

The reason is, on initial page load, the <div> with the menu in it looks like this:

After resizing down then up, it looks like this:

The style="..." is hiding the <div> and only after resize is it visible again. This may have something to do with the bundling of JS (see below).