(options)
| 444 | * @returns {StateMachine} overlay |
| 445 | */ |
| 446 | const createOverlay = (options) => { |
| 447 | /** @type {HTMLIFrameElement | null | undefined} */ |
| 448 | let iframeContainerElement; |
| 449 | /** @type {HTMLDivElement | null | undefined} */ |
| 450 | let containerElement; |
| 451 | /** @type {HTMLDivElement | null | undefined} */ |
| 452 | let headerElement; |
| 453 | /** @type {((element: HTMLDivElement) => void)[]} */ |
| 454 | let onLoadQueue = []; |
| 455 | /** @type {Omit<TrustedTypePolicy, "createScript" | "createScriptURL"> | undefined} */ |
| 456 | let overlayTrustedTypesPolicy; |
| 457 | |
| 458 | /** @typedef {Extract<keyof CSSStyleDeclaration, "string">} CSSStyleDeclarationKeys */ |
| 459 | |
| 460 | /** |
| 461 | * @param {HTMLElement} element element |
| 462 | * @param {Partial<CSSStyleDeclaration>} style style |
| 463 | */ |
| 464 | function applyStyle(element, style) { |
| 465 | Object.keys(style).forEach((prop) => { |
| 466 | element.style[/** @type {CSSStyleDeclarationKeys} */ (prop)] = |
| 467 | /** @type {string} */ |
| 468 | (style[/** @type {CSSStyleDeclarationKeys} */ (prop)]); |
| 469 | }); |
| 470 | } |
| 471 | |
| 472 | /** |
| 473 | * @param {string | false | undefined} trustedTypesPolicyName trusted types police name |
| 474 | */ |
| 475 | function createContainer(trustedTypesPolicyName) { |
| 476 | // Enable Trusted Types if they are available in the current browser. |
| 477 | if (window.trustedTypes) { |
| 478 | overlayTrustedTypesPolicy = window.trustedTypes.createPolicy( |
| 479 | trustedTypesPolicyName || "webpack-dev-server#overlay", |
| 480 | { |
| 481 | createHTML: (value) => value, |
| 482 | }, |
| 483 | ); |
| 484 | } |
| 485 | |
| 486 | iframeContainerElement = document.createElement("iframe"); |
| 487 | iframeContainerElement.id = "webpack-dev-server-client-overlay"; |
| 488 | iframeContainerElement.src = "about:blank"; |
| 489 | applyStyle(iframeContainerElement, iframeStyle); |
| 490 | |
| 491 | iframeContainerElement.onload = () => { |
| 492 | const contentElement = |
| 493 | /** @type {Document} */ |
| 494 | ( |
| 495 | /** @type {HTMLIFrameElement} */ |
| 496 | (iframeContainerElement).contentDocument |
| 497 | ).createElement("div"); |
| 498 | containerElement = |
| 499 | /** @type {Document} */ |
| 500 | ( |
| 501 | /** @type {HTMLIFrameElement} */ |
| 502 | (iframeContainerElement).contentDocument |
| 503 | ).createElement("div"); |
no test coverage detected
searching dependent graphs…