stereobooster/react-snap

Styles are breaking in mobile view

sandeepDevJs opened this issue · 0 comments

Bug Report

Current Behavior
after finish crawling, I ran my app it worked fine but when I opened it in mobile phones, my website won't scroll, also distorting styles. I am using material UI

Expected behavior/code
website is scrolling in laptop screens as well as styles are proper, but not in mobile phone screen

Possible Solution
do you think this is because react-snap is not compatible with material ui

Additional context/Screenshots
react-snap config

"reactSnap": {
    "fixWebpackChunksIssue": false,
    "puppeteerIgnoreHTTPSErrors": true,
    "inlineCss": true,
    "puppeteerArgs": [
      "--no-sandbox",
      "--disable-setuid-sandbox"
    ]
  }

I am using below prerenderedLodable

import React from "react";
import loadable from "@loadable/component";
import { PrerenderedComponent } from "react-prerendered-component";

const PrerenderedLodable = (dynamicImport) => {
	const LoadableComponent = loadable(dynamicImport);
	return React.memo((props) => (
		<PrerenderedComponent live={LoadableComponent.load()}>
			<LoadableComponent {...props} />
		</PrerenderedComponent>
	));
};

export default PrerenderedLodable