Un stable rendering of production build for material UI example for nextJS

• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

When page is reloaded, the render should be stable. It is correct in the development build, i.e when I do npm run dev

Current Behavior

When page is loaded, the render is unstable. It happens when I run npm run build and npm run start

Steps to Reproduce (for bugs)

Following the instructions at https://github.com/zeit/next.js/tree/canary/examples/with-material-ui-next

1. curl https://codeload.github.com/callemall/material-ui/tar.gz/v1-beta | tar -xz --strip=2 material-ui-1-beta/examples/nextjs
2. cd nextjs
3. npm run build
4. npm run start

Context

Your Environment

Tech	Version
Material-UI	1.0.0-beta.25
React	16.2.0
browser	Chrome 63.0.3239 on MacBook
Next	4.2.1

[krazyjakee]

@bendiy I then refresh the browser, It looses it's style and renders weird and throws the error I have this exact issue.

@oliviertassinari I started a project recently and was looking at after.js and next.js as being the source of this issue, but I think the closest I’ve come to an actual solution is your comment: It's the sign your class name generator is shared between different request. Could you please explain where in a project I should be declaring createGenerateClassName and how to make the styling stick on further requests?

My code:

static async getInitialProps({ assets, data, renderPage }) {
    const sheets = new SheetsRegistry();
    const generateClassName = createGenerateClassName();

    const page = await renderPage(After => props => <JssProvider registry={sheets} generateClassName={generateClassName}>
      <Layout><After {...props} /></Layout>
    </JssProvider>
    );
    return { assets, data, sheets, ...page };
  }

[oliviertassinari]

@credifiable Sorry, but you seem to be the only one affected. We can’t do anything without being able to reproduce. Keeping the issue open won’t help with the exposure, most people use the search of GitHub to find old issues they are suffering. Maybe someone will face the same issue and dig into the rabbit hole.

@JeromeFitz Thank you for the live environment.