Example project about react-snap HOT 9 CLOSED

I did this project as experiment. I used react-snapshot before. Did you choose "collapseWhitespace": false for reason? I have issues with minifier too - still looking for good defaults. PS I didn't publish project to npm, but you can install it from git (and add it to project json)

from react-snap.

I was also using react-snapshot but it's still using jsdom. That project is also getting more complex, supporting async stuff. I am looking for a real simple solution, and I had an idea to create something very similar to this project, i think you should continue with it.
Regarding "collapseWhitespace": false, the minifier had incorrectly removed a whitespace between text node and element node. This resulted in react hydrate complaining.

Do you have plans to continue with this project? I'd be happy to contribute.

from react-snap.

One way or another I need to SSR for my C-R-A based project. So I will need to finish this or to use alternatives:

• react-snapshot uses jsdom
• prep does not have crawling functionality, uses nightmare

Do you have any specific issues so far?

I have some:

• not sure about minifier configuration
• need to expose some variable from window, to not report crawling to GA
• want to be able to set crawler viewport size
• want to use critical, because time to render is awful for my project. Maybe this is out of scope of this project addyosmani/critical#229

from react-snap.

I don't have any issues about this project as i haven't used it much, but it's pretty much exactly what i was looking for and so far it meets my basic requirements. It could do with some basic tests and fixes to the issues you mentioned but then i reckon you should publish it.

from react-snap.

I realised that I actually need async stuff. So I will get back to react-snapshot, to PR with async api and will try to build based on it with puppeteer. If author do not have time to support it - I will create fork or ask if he wants to pass project. Concerning this project - I can pass it to you if you interested.

PS. I have strange issue with inline SVGs and styles of surrounding div

from react-snap.

Basic async appears to work if you're doing network requests. This is feature of chrome, to wait for network requests to complete before evaluation. See badsyntax/react-snap-example@1c8c757 (btw I am @badsyntax)

from react-snap.

Async work only for simple example - if time between last bit of js bundle downloaded and request done by JS is small, but if it is significant headless chrome will report idle network earlier. In my example async does not work.

from react-snap.

Guess what. Async staff didn't work, because there was JS error. I noticed it when I added

page.on("console", msg => console.log(msg));
page.on("error", msg => console.log(msg));
page.on("pageerror", msg => console.log(msg));

from react-snap.

I still have some issues, but I published it to npm. I added link to your example project. Thanks

from react-snap.