diff --git a/CHANGELOG.md b/CHANGELOG.md index 948b32343..c67f66245 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ Please follow the recommendations outlined at [keepachangelog.com](http://keepac Changes since last non-beta release. *Please add entries here for your pull requests that are not yet released.* +- Fix additional cases of client startup failing during interactive readyState ### [11.1.5] - 2018-09-12 #### Fixed diff --git a/node_package/src/clientStartup.js b/node_package/src/clientStartup.js index 93a4a9a91..7f421a257 100644 --- a/node_package/src/clientStartup.js +++ b/node_package/src/clientStartup.js @@ -177,6 +177,32 @@ function reactOnRailsPageUnloaded() { forEachComponent(unmount); } +function renderInit() { + // Install listeners when running on the client (browser). + // We must do this check for turbolinks AFTER the document is loaded because we load the + // Webpack bundles first. + if (!turbolinksInstalled() || !turbolinksSupported()) { + debugTurbolinks('NOT USING TURBOLINKS: calling reactOnRailsPageLoaded'); + reactOnRailsPageLoaded(); + return; + } + + if (turbolinksVersion5()) { + debugTurbolinks( + 'USING TURBOLINKS 5: document added event listeners ' + + 'turbolinks:before-render and turbolinks:render.'); + document.addEventListener('turbolinks:before-render', reactOnRailsPageUnloaded); + document.addEventListener('turbolinks:render', reactOnRailsPageLoaded); + reactOnRailsPageLoaded(); + } else { + debugTurbolinks( + 'USING TURBOLINKS 2: document added event listeners page:before-unload and ' + + 'page:change.'); + document.addEventListener('page:before-unload', reactOnRailsPageUnloaded); + document.addEventListener('page:change', reactOnRailsPageLoaded); + } +} + export function clientStartup(context) { const document = context.document; @@ -196,45 +222,9 @@ export function clientStartup(context) { debugTurbolinks('Adding DOMContentLoaded event to install event listeners.'); - window.setTimeout(() => { - if (!turbolinksInstalled() || !turbolinksSupported()) { - if (document.readyState === 'complete') { - debugTurbolinks( - 'NOT USING TURBOLINKS: DOM is already loaded, calling reactOnRailsPageLoaded', - ); - - reactOnRailsPageLoaded(); - } else { - document.addEventListener('DOMContentLoaded', () => { - debugTurbolinks( - 'NOT USING TURBOLINKS: DOMContentLoaded event, calling reactOnRailsPageLoaded', - ); - reactOnRailsPageLoaded(); - }); - } - } - }); - - document.addEventListener('DOMContentLoaded', () => { - // Install listeners when running on the client (browser). - // We must do this check for turbolinks AFTER the document is loaded because we load the - // Webpack bundles first. - - if (turbolinksInstalled() && turbolinksSupported()) { - if (turbolinksVersion5()) { - debugTurbolinks( - 'USING TURBOLINKS 5: document added event listeners ' + - 'turbolinks:before-render and turbolinks:render.'); - document.addEventListener('turbolinks:before-render', reactOnRailsPageUnloaded); - document.addEventListener('turbolinks:render', reactOnRailsPageLoaded); - reactOnRailsPageLoaded(); - } else { - debugTurbolinks( - 'USING TURBOLINKS 2: document added event listeners page:before-unload and ' + - 'page:change.'); - document.addEventListener('page:before-unload', reactOnRailsPageUnloaded); - document.addEventListener('page:change', reactOnRailsPageLoaded); - } - } - }); + if (document.readyState === 'complete') { + window.setTimeout(renderInit); + } else { + document.addEventListener('DOMContentLoaded', renderInit); + } }