Spaces:
Running
Running
File size: 4,788 Bytes
979bf48 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 | /* @ts-check */ /**
* Style injection mechanism for Next.js devtools with shadow DOM support
* Handles caching of style elements when the nextjs-portal shadow root is not available
*/ // Global cache for style elements when shadow root is not available
"use strict";
if (typeof window !== 'undefined') {
window._nextjsDevtoolsStyleCache = window._nextjsDevtoolsStyleCache || {
pendingElements: [],
isObserving: false,
lastInsertedElement: null,
cachedShadowRoot: null
};
}
/**
* @returns {ShadowRoot | null}
*/ function getShadowRoot() {
const cache = window._nextjsDevtoolsStyleCache;
// Return cached shadow root if available
if (cache.cachedShadowRoot) {
return cache.cachedShadowRoot;
}
// Query the DOM and cache the result if found
const portal = document.querySelector('nextjs-portal');
const shadowRoot = (portal == null ? void 0 : portal.shadowRoot) || null;
if (shadowRoot) {
cache.cachedShadowRoot = shadowRoot;
}
return shadowRoot;
}
/**
* @param {HTMLElement} element
* @param {ShadowRoot} shadowRoot
*/ function insertElementIntoShadowRoot(element, shadowRoot) {
const cache = window._nextjsDevtoolsStyleCache;
if (!cache.lastInsertedElement) {
shadowRoot.insertBefore(element, shadowRoot.firstChild);
} else if (cache.lastInsertedElement.nextSibling) {
shadowRoot.insertBefore(element, cache.lastInsertedElement.nextSibling);
} else {
shadowRoot.appendChild(element);
}
cache.lastInsertedElement = element;
}
function flushCachedElements() {
const cache = window._nextjsDevtoolsStyleCache;
const shadowRoot = getShadowRoot();
if (!shadowRoot) {
return;
}
cache.pendingElements.forEach((element)=>{
insertElementIntoShadowRoot(element, shadowRoot);
});
cache.pendingElements = [];
}
function startObservingForPortal() {
const cache = window._nextjsDevtoolsStyleCache;
if (cache.isObserving) {
return;
}
cache.isObserving = true;
// First check if the portal already exists
const shadowRoot = getShadowRoot() // This will cache it if found
;
if (shadowRoot) {
flushCachedElements();
return;
}
// Set up MutationObserver to watch for the portal element
const observer = new MutationObserver((mutations)=>{
if (mutations.length === 0) {
return;
}
// Check all mutations and all added nodes
for (const mutation of mutations){
if (mutation.addedNodes.length === 0) continue;
for (const addedNode of mutation.addedNodes){
if (addedNode.nodeType !== Node.ELEMENT_NODE) continue;
const mutationNode = addedNode;
let portalNode = null;
if (// app router: body > script[data-nextjs-dev-overlay] > nextjs-portal
mutationNode.tagName === 'SCRIPT' && mutationNode.getAttribute('data-nextjs-dev-overlay')) {
portalNode = mutationNode.firstChild;
} else if (// pages router: body > nextjs-portal
mutationNode.tagName === 'NEXTJS-PORTAL') {
portalNode = mutationNode;
}
if (portalNode) {
// Wait until shadow root is available
const checkShadowRoot = ()=>{
if (getShadowRoot()) {
flushCachedElements();
observer.disconnect();
cache.isObserving = false;
} else {
// Try again after a short delay
setTimeout(checkShadowRoot, 20);
}
};
checkShadowRoot();
return; // Exit early once we find a portal
}
}
}
});
observer.observe(document.body, {
childList: true,
subtree: true
});
}
/**
* @param {HTMLElement} element
*/ function insertAtTop(element) {
// Add special recognizable data prop to element
element.setAttribute('data-nextjs-dev-tool-style', 'true');
const shadowRoot = getShadowRoot();
if (shadowRoot) {
// Shadow root is available, insert directly
insertElementIntoShadowRoot(element, shadowRoot);
} else {
// Shadow root not available, cache the element
const cache = window._nextjsDevtoolsStyleCache;
cache.pendingElements.push(element);
// Start observing for the portal if not already observing
startObservingForPortal();
}
}
module.exports = insertAtTop;
//# sourceMappingURL=devtool-style-inject.js.map |