Issue 1:
In the material-ui-next example, if you add a subcomponent to the page which uses the withStyles HOC, changing any of the style properties breaks HMR.

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

Expected Behavior

When changing stylesheet properties in a subcomponent that uses the withStyles HOC from Material UI (beta), HMR should work properly.

Current Behavior

When the page hot reloads due to a style change, this error occurs:

Cannot read property 'get' of undefined
TypeError: Cannot read property 'get' of undefined
at http://localhost:3000/_next/1501726171018/commons.js:49907:49
at Array.forEach (<anonymous>)
at ProxyComponent.detach (http://localhost:3000/_next/1501726171018/commons.js:49905:23)
at ProxyComponent.detach (http://localhost:3000/_next/1501726171018/commons.js:41945:30)
at ProxyComponent.componentWillUnmount (http://localhost:3000/_next/1501726171018/commons.js:49843:16)
at ProxyComponent.proxiedComponentWillUnmount (http://localhost:3000/_next/1501726171018/commons.js:41982:43)
at http://localhost:3000/_next/1501726171018/commons.js:33428:25
at measureLifeCyclePerf (http://localhost:3000/_next/1501726171018/commons.js:33095:12)
at ReactCompositeComponentWrapper.unmountComponent (http://localhost:3000/_next/1501726171018/commons.js:33427:11)
at Object.unmountComponent (http://localhost:3000/_next/1501726171018/commons.js:2501:22)`

This is happening at this line: https://github.com/callemall/material-ui/blob/v1-beta/src/styles/withStyles.js#L173 (sheetManager is undefined)

Steps to Reproduce (for bugs)

Download https://github.com/sbking/next.js/tree/material-ui-next-hmr-issue/examples/with-material-ui-next

npm install && npm run dev

Open in browser, see that text is red.

Change the color to blue in components/StyledText.js

HMR fails

Context

Trying to adjust component styles with hot style updates.

Your Environment

Tech
Version

next
both latest and 3.0.1-beta.20

node
8.2.1

OS
OS X (both El Capitan and Sierra)

browser
Chrome, Firefox, Safari

Issue 2:
I'm trying to add a custom Social component to my site that adds several relevant meta tags, but it's setting the <title> to an empty string. I have the title defined in _document.js and don't change it anywhere else in the codebase. I'm running the Canary version of Next.js

import Document, { Head, Main, NextScript } from 'next/document'
export default class CustomDocument extends Document {
static async getInitialProps (ctx) {
return await Document.getInitialProps(ctx)
}

render () {
return (
<html lang="en">
<Head>
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Website Title</title>
</Head>
<body>
<Main />
<NextScript />
</body>
</html>
)
}
}

The custom component I call looks like this:

import Head from 'next/head'

export default ({ title, image, description, url }) => (
<Head>
<meta key="twitter-card" name="twitter:card" content="summary" />
<meta key="twitter-site" name="twitter:site" content="@ianmitchel1" />
<meta key="twitter-title" name="twitter:title" content={title} />
<meta key="twitter-description" name="twitter:description" content={description} />
<meta key="twitter-image" name="twitter:image" content={image} />
<meta key="twitter-url" name="twitter:url" content={url} />

<meta key="facebook-type" property="og:type" content="article" />
<meta key="facebook-title" property="og:title" content={title} />
<meta key="facebook-description" property="og:description" content={description} />
<meta key="facebook-image" property="og:image" content={image} />
<meta key="facebook-url" property="og:url" content={url} />
</Head>
)

It adds all the meta tags correctly (not sure if it's related, but I needed to add the key parameter - otherwise only the second set of meta tags was added) and the other meta tags from _document.js remain intact, but somehow the title tag just becomes <title></title>.

I've created a small example here - https://next-title-pnxpfydvvh.now.sh