Icard/angular-clarity-master(work.../node_modules/webpack-dev-server/client/overlay.js

268 lines
11 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
// The error overlay is inspired (and mostly copied) from Create React App (https://github.com/facebookincubator/create-react-app)
// They, in turn, got inspired by webpack-hot-middleware (https://github.com/glenjamin/webpack-hot-middleware).
import ansiHTML from "ansi-html-community";
import { encode } from "html-entities";
import { listenToRuntimeError, listenToUnhandledRejection, parseErrorToStacks } from "./overlay/runtime-error.js";
import createOverlayMachine from "./overlay/state-machine.js";
import { containerStyle, dismissButtonStyle, headerStyle, iframeStyle, msgStyles, msgTextStyle, msgTypeStyle } from "./overlay/styles.js";
var colors = {
reset: ["transparent", "transparent"],
black: "181818",
red: "E36049",
green: "B3CB74",
yellow: "FFD080",
blue: "7CAFC2",
magenta: "7FACCA",
cyan: "C3C2EF",
lightgrey: "EBE7E3",
darkgrey: "6D7891"
};
ansiHTML.setColors(colors);
/**
* @param {string} type
* @param {string | { file?: string, moduleName?: string, loc?: string, message?: string; stack?: string[] }} item
* @returns {{ header: string, body: string }}
*/
function formatProblem(type, item) {
var header = type === "warning" ? "WARNING" : "ERROR";
var body = "";
if (typeof item === "string") {
body += item;
} else {
var file = item.file || "";
// eslint-disable-next-line no-nested-ternary
var moduleName = item.moduleName ? item.moduleName.indexOf("!") !== -1 ? "".concat(item.moduleName.replace(/^(\s|\S)*!/, ""), " (").concat(item.moduleName, ")") : "".concat(item.moduleName) : "";
var loc = item.loc;
header += "".concat(moduleName || file ? " in ".concat(moduleName ? "".concat(moduleName).concat(file ? " (".concat(file, ")") : "") : file).concat(loc ? " ".concat(loc) : "") : "");
body += item.message || "";
}
if (Array.isArray(item.stack)) {
item.stack.forEach(function (stack) {
if (typeof stack === "string") {
body += "\r\n".concat(stack);
}
});
}
return {
header: header,
body: body
};
}
/**
* @typedef {Object} CreateOverlayOptions
* @property {string | null} trustedTypesPolicyName
* @property {boolean | (error: Error) => void} [catchRuntimeError]
*/
/**
*
* @param {CreateOverlayOptions} options
*/
var createOverlay = function createOverlay(options) {
/** @type {HTMLIFrameElement | null | undefined} */
var iframeContainerElement;
/** @type {HTMLDivElement | null | undefined} */
var containerElement;
/** @type {HTMLDivElement | null | undefined} */
var headerElement;
/** @type {Array<(element: HTMLDivElement) => void>} */
var onLoadQueue = [];
/** @type {TrustedTypePolicy | undefined} */
var overlayTrustedTypesPolicy;
/**
*
* @param {HTMLElement} element
* @param {CSSStyleDeclaration} style
*/
function applyStyle(element, style) {
Object.keys(style).forEach(function (prop) {
element.style[prop] = style[prop];
});
}
/**
* @param {string | null} trustedTypesPolicyName
*/
function createContainer(trustedTypesPolicyName) {
// Enable Trusted Types if they are available in the current browser.
if (window.trustedTypes) {
overlayTrustedTypesPolicy = window.trustedTypes.createPolicy(trustedTypesPolicyName || "webpack-dev-server#overlay", {
createHTML: function createHTML(value) {
return value;
}
});
}
iframeContainerElement = document.createElement("iframe");
iframeContainerElement.id = "webpack-dev-server-client-overlay";
iframeContainerElement.src = "about:blank";
applyStyle(iframeContainerElement, iframeStyle);
iframeContainerElement.onload = function () {
var contentElement = /** @type {Document} */
/** @type {HTMLIFrameElement} */
iframeContainerElement.contentDocument.createElement("div");
containerElement = /** @type {Document} */
/** @type {HTMLIFrameElement} */
iframeContainerElement.contentDocument.createElement("div");
contentElement.id = "webpack-dev-server-client-overlay-div";
applyStyle(contentElement, containerStyle);
headerElement = document.createElement("div");
headerElement.innerText = "Compiled with problems:";
applyStyle(headerElement, headerStyle);
var closeButtonElement = document.createElement("button");
applyStyle(closeButtonElement, dismissButtonStyle);
closeButtonElement.innerText = "×";
closeButtonElement.ariaLabel = "Dismiss";
closeButtonElement.addEventListener("click", function () {
// eslint-disable-next-line no-use-before-define
overlayService.send({
type: "DISMISS"
});
});
contentElement.appendChild(headerElement);
contentElement.appendChild(closeButtonElement);
contentElement.appendChild(containerElement);
/** @type {Document} */
/** @type {HTMLIFrameElement} */
iframeContainerElement.contentDocument.body.appendChild(contentElement);
onLoadQueue.forEach(function (onLoad) {
onLoad( /** @type {HTMLDivElement} */contentElement);
});
onLoadQueue = [];
/** @type {HTMLIFrameElement} */
iframeContainerElement.onload = null;
};
document.body.appendChild(iframeContainerElement);
}
/**
* @param {(element: HTMLDivElement) => void} callback
* @param {string | null} trustedTypesPolicyName
*/
function ensureOverlayExists(callback, trustedTypesPolicyName) {
if (containerElement) {
containerElement.innerHTML = "";
// Everything is ready, call the callback right away.
callback(containerElement);
return;
}
onLoadQueue.push(callback);
if (iframeContainerElement) {
return;
}
createContainer(trustedTypesPolicyName);
}
// Successful compilation.
function hide() {
if (!iframeContainerElement) {
return;
}
// Clean up and reset internal state.
document.body.removeChild(iframeContainerElement);
iframeContainerElement = null;
containerElement = null;
}
// Compilation with errors (e.g. syntax error or missing modules).
/**
* @param {string} type
* @param {Array<string | { moduleIdentifier?: string, moduleName?: string, loc?: string, message?: string }>} messages
* @param {string | null} trustedTypesPolicyName
* @param {'build' | 'runtime'} messageSource
*/
function show(type, messages, trustedTypesPolicyName, messageSource) {
ensureOverlayExists(function () {
headerElement.innerText = messageSource === "runtime" ? "Uncaught runtime errors:" : "Compiled with problems:";
messages.forEach(function (message) {
var entryElement = document.createElement("div");
var msgStyle = type === "warning" ? msgStyles.warning : msgStyles.error;
applyStyle(entryElement, _objectSpread(_objectSpread({}, msgStyle), {}, {
padding: "1rem 1rem 1.5rem 1rem"
}));
var typeElement = document.createElement("div");
var _formatProblem = formatProblem(type, message),
header = _formatProblem.header,
body = _formatProblem.body;
typeElement.innerText = header;
applyStyle(typeElement, msgTypeStyle);
if (message.moduleIdentifier) {
applyStyle(typeElement, {
cursor: "pointer"
});
// element.dataset not supported in IE
typeElement.setAttribute("data-can-open", true);
typeElement.addEventListener("click", function () {
fetch("/webpack-dev-server/open-editor?fileName=".concat(message.moduleIdentifier));
});
}
// Make it look similar to our terminal.
var text = ansiHTML(encode(body));
var messageTextNode = document.createElement("div");
applyStyle(messageTextNode, msgTextStyle);
messageTextNode.innerHTML = overlayTrustedTypesPolicy ? overlayTrustedTypesPolicy.createHTML(text) : text;
entryElement.appendChild(typeElement);
entryElement.appendChild(messageTextNode);
/** @type {HTMLDivElement} */
containerElement.appendChild(entryElement);
});
}, trustedTypesPolicyName);
}
var overlayService = createOverlayMachine({
showOverlay: function showOverlay(_ref) {
var _ref$level = _ref.level,
level = _ref$level === void 0 ? "error" : _ref$level,
messages = _ref.messages,
messageSource = _ref.messageSource;
return show(level, messages, options.trustedTypesPolicyName, messageSource);
},
hideOverlay: hide
});
if (options.catchRuntimeError) {
/**
* @param {Error | undefined} error
* @param {string} fallbackMessage
*/
var handleError = function handleError(error, fallbackMessage) {
var errorObject = error instanceof Error ? error : new Error(error || fallbackMessage);
var shouldDisplay = typeof options.catchRuntimeError === "function" ? options.catchRuntimeError(errorObject) : true;
if (shouldDisplay) {
overlayService.send({
type: "RUNTIME_ERROR",
messages: [{
message: errorObject.message,
stack: parseErrorToStacks(errorObject)
}]
});
}
};
listenToRuntimeError(function (errorEvent) {
// error property may be empty in older browser like IE
var error = errorEvent.error,
message = errorEvent.message;
if (!error && !message) {
return;
}
handleError(error, message);
});
listenToUnhandledRejection(function (promiseRejectionEvent) {
var reason = promiseRejectionEvent.reason;
handleError(reason, "Unknown promise rejection reason");
});
}
return overlayService;
};
export { formatProblem, createOverlay };