Element hidden on load when using with gatsby

[carstenblt]

When using gatsby, a Plx element remains hidden (display: 'hidden') and only shows, when you start scrolling. This happens about 50% of the time and seems to be a race condition.

I believe this is an issue with gatsby, because it doesn't support using_window_ inside render(). Using _animateWhenNotInViewport _ works as a workaround. I can't give you much insight though as I'm still new to the ecosystem.

[Stanko]

Hello @carstenblt,
I don't think it is a race condition.

Initially I added visibility: hidden on purpose, to hide element until client code is loaded, then it is removed when component is mounted:
https://github.com/Stanko/react-plx/blob/master/source/Plx.js#L553-L556

Can you provide me with a code example please?

Cheers!

[Stanko]

Unfortunately, this is how server rendered React and Gatsby work.
Check this Gatsby issue I opened - gatsbyjs/gatsby#12413

Closing as it is not problem with the library itself.