diff --git a/packages/react-server/core/util/ClientCssHelper.js b/packages/react-server/core/util/ClientCssHelper.js index e8512cf77..949d2b792 100644 --- a/packages/react-server/core/util/ClientCssHelper.js +++ b/packages/react-server/core/util/ClientCssHelper.js @@ -12,7 +12,6 @@ module.exports = { if (SERVER_SIDE) { throw new Error("ClientCssHelper.registerPageLoad can't be called server-side"); } - const urlBase = location.protocol + "//" + location.host; // for each css node in the head that the react-server server wrote to the response, note it down in the cache, so that // we can remove it on a page to page transition. @@ -20,15 +19,7 @@ module.exports = { for (var i = 0; i < serverWrittenLinkNodes.length; i++) { var key, styleNode = serverWrittenLinkNodes[i]; if (styleNode.href) { - key = styleNode.href; - - // The browser will give us a full URL even if we only put a - // path in on the server. So, if we're comparing against just - // a path here we need to strip the base off to avoid a flash - // of unstyled content. - if (key.indexOf(urlBase) === 0) { - key = key.substr(urlBase.length); - } + key = normalizeLocalUrl(styleNode.href); } else { key = styleNode.innerHTML; } @@ -100,6 +91,20 @@ module.exports = { }, _keyFromStyleSheet: function(style) { - return style.href || style.text; + return normalizeLocalUrl(style.href) || style.text; }, } + +function normalizeLocalUrl(url) { + const urlBase = location.protocol + "//" + location.host; + + // The browser will give us a full URL even if we only put a + // path in on the server. So, if we're comparing against just + // a path here we need to strip the base off to avoid a flash + // of unstyled content. + if (url && url.indexOf(urlBase) === 0) { + url = url.substr(urlBase.length); + } + + return url; +}