rsnext/packages/next/client/dev/amp-dev.js
Tim Neutkens 7e7f2c0a6d
Simplify a few parts of the codebase (#7506)
* Move client-side dev JS to dev folder

* Move eventsource polyfill

* Move source-map-support

* Move error boundary

* Deprecate Container in _app

* Make initialRender check better

* Remove unused code

* Only support one subscription as there is only one

* Don’t spread object

* Shorten property name

* Add container in development too

* Simplify query update logic
2019-06-05 20:15:42 +02:00

91 lines
2.5 KiB
JavaScript

/* globals __webpack_hash__ */
import fetch from 'unfetch'
import EventSourcePolyfill from './event-source-polyfill'
import { getEventSourceWrapper } from './error-overlay/eventsource'
import { setupPing } from './on-demand-entries-utils'
if (!window.EventSource) {
window.EventSource = EventSourcePolyfill
}
const data = JSON.parse(document.getElementById('__NEXT_DATA__').textContent)
let { assetPrefix, page } = data
assetPrefix = assetPrefix || ''
let mostRecentHash = null
/* eslint-disable-next-line */
let curHash = __webpack_hash__
const hotUpdatePath =
assetPrefix + (assetPrefix.endsWith('/') ? '' : '/') + '_next/static/webpack/'
// Is there a newer version of this code available?
function isUpdateAvailable () {
// __webpack_hash__ is the hash of the current compilation.
// It's a global variable injected by Webpack.
/* eslint-disable-next-line */
return mostRecentHash !== __webpack_hash__
}
// Webpack disallows updates in other states.
function canApplyUpdates () {
return module.hot.status() === 'idle'
}
// This function reads code updates on the fly and hard
// reloads the page when it has changed.
async function tryApplyUpdates () {
if (!isUpdateAvailable() || !canApplyUpdates()) {
return
}
try {
const res = await fetch(`${hotUpdatePath}${curHash}.hot-update.json`)
const data = await res.json()
const curPage = page === '/' ? 'index' : page
const pageUpdated = Object.keys(data.c).some(mod => {
return (
mod.indexOf(
`pages${curPage.substr(0, 1) === '/' ? curPage : `/${curPage}`}`
) !== -1 ||
mod.indexOf(
`pages${
curPage.substr(0, 1) === '/' ? curPage : `/${curPage}`
}`.replace(/\//g, '\\')
) !== -1
)
})
if (pageUpdated) {
document.location.reload(true)
} else {
curHash = mostRecentHash
}
} catch (err) {
console.error('Error occurred checking for update', err)
document.location.reload(true)
}
}
getEventSourceWrapper({
path: `${assetPrefix}/_next/webpack-hmr`
}).addMessageListener(event => {
if (event.data === '\uD83D\uDC93') {
return
}
try {
const message = JSON.parse(event.data)
if (message.action === 'sync' || message.action === 'built') {
if (!message.hash) {
return
}
mostRecentHash = message.hash
tryApplyUpdates()
} else if (message.action === 'reloadPage') {
document.location.reload(true)
}
} catch (ex) {
console.warn('Invalid HMR message: ' + event.data + '\n' + ex)
}
})
setupPing(assetPrefix, () => page)