universal-webpack/es6/devtools.js

Isomorphic Webpack

// This is for `extract-text-webpack-plugin` only.
//
// The following code is an advanced topic
// and can be skipped safely.
// This code is not required
// for the whole thing to work.
// It's gonna work fine without this code.
//
// (in development mode)
//
// Removing the now unnecessary `<link rel="stylesheet"/>` tag,
// because the client-side javascript has already kicked-in
// and added all the styles using `style-loader` dynamically.
//
// Should that stylesheet be removed at all?
// Not necessarily.
// It's just, for example, if a developer opens the page,
// then decides to remove some CSS class,
// and switches back to the browser,
// and the CSS class is still there,
// because it was only removed from dynamically added CSS styles,
// not the statically added ones on the server-side.
//
export default function devtools(parameters) {
  var chunks = parameters.chunks();
  var style_url = chunks.styles[parameters.entry];
  var common_style_url = chunks.styles.common;

  var get_style_link_element_script = function get_style_link_element_script(url) {
    return "document.querySelector('head > link[rel=\"stylesheet\"][href=\"".concat(url, "\"]')");
  };

  var script = "\n\t\tdocument.addEventListener('DOMContentLoaded', function(event)\n\t\t{\n\t\t\t// The style-loader has already added <link/>s\n\t\t\t// to its dynamic hot-reloadable styles,\n\t\t\t// so remove the <link/> to the static CSS bundle\n\t\t\t// inserted during server side page rendering.\n\n\t\t\tvar stylesheet\n\t\t\tvar common_stylesheet\n\n\t\t\t".concat(style_url ? 'stylesheet        = ' + get_style_link_element_script(style_url) : '', "\n\t\t\t").concat(common_style_url ? 'common_stylesheet = ' + get_style_link_element_script(common_style_url) : '', "\n\n\t\t\t// Waits a \"magical\" time amount of one second\n\t\t\t// for the dynamically added stylesheets\n\t\t\t// to be parsed and applied to the page.\n\t\t\tsetTimeout(function()\n\t\t\t{\n\t\t\t\tstylesheet        && stylesheet.parentNode.removeChild(stylesheet)\n\t\t\t\tcommon_stylesheet && common_stylesheet.parentNode.removeChild(common_stylesheet)\n\t\t\t},\n\t\t\t1000)\n\t\t})\n\t");
  return script;
} // Smoke screen is for `mini-css-extract-plugin`.
// Because prepending `style-loader` trick doesn't work for it.

var fade_duration = 150;
export var smokeScreen = "\n\t<div\n\t\tid=\"universal-webpack-smoke-screen\"\n\t\tstyle=\"\n\t\t\tposition: fixed;\n\t\t\tleft: 0;\n\t\t\tright: 0;\n\t\t\ttop: 0;\n\t\t\tbottom: 0;\n\t\t\tz-index: 2147483647;\n\t\t\tbackground: white;\n\t\t\topacity: 1;\n\t\t\ttransition: opacity ".concat(fade_duration, "ms ease-out\n\t\t\">\n\t</div>\n");
export var hideSmokeScreen = "\n\tdocument.addEventListener('DOMContentLoaded', function(event)\n\t{\n\t\t// The style-loader has already added <link/>s\n\t\t// to its dynamic hot-reloadable styles,\n\t\t// so remove the white screen.\n\t\tdocument.getElementById('universal-webpack-smoke-screen').style.opacity = 0\n\t\tsetTimeout(() => document.body.removeChild(document.getElementById('universal-webpack-smoke-screen')), ".concat(fade_duration, ")\n\t})\n");
export var hideSmokeScreenAfter = function hideSmokeScreenAfter() {
  var delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
  return "\n\tdocument.addEventListener('DOMContentLoaded', function(event)\n\t{\n\t\tsetTimeout(function()\n\t\t{\n\t\t\t// The style-loader has already added <link/>s\n\t\t\t// to its dynamic hot-reloadable styles,\n\t\t\t// so remove the white screen.\n\n\t\t\tdocument.getElementById('universal-webpack-smoke-screen').style.opacity = 0\n\n\t\t\tsetTimeout(function() {\n\t\t\t\tdocument.body.removeChild(document.getElementById('universal-webpack-smoke-screen'))\n\t\t\t},\n\t\t\t".concat(fade_duration, ")\n\t\t},\n\t\t").concat(delay, ")\n\t})\n");
};
//# sourceMappingURL=devtools.js.map