alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-06-26 12:51:16 -03:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): prevent Launch LoRA Manager button from disappearing when opening properties panel in subgraph (#996)

Browse Source
This commit is contained in:
Will Miao
2026-06-25 20:47:29 +08:00
parent 9c95856b2f
commit 0ac10dfd42
1 changed files with 45 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
web/comfyui/top_menu_extension.js
View File

@@ -186,32 +186,59 @@ const createExtensionObject = (useActionBar) => {
}; };
injectStyles(); injectStyles();
const replaceButtonIcon = () => { const applyIconToButton = (button) => {
const buttons = document.querySelectorAll('button[aria-label="Launch LoRA Manager (Shift+Click opens in new window)"]'); // Skip if the SVG icon is already in place
buttons.forEach(button => { if (button.querySelector('svg')) return;
button.classList.add('lm-top-menu-button'); button.classList.add('lm-top-menu-button');
button.innerHTML = getLoraManagerIcon(); button.innerHTML = getLoraManagerIcon();
button.style.borderRadius = '4px'; button.style.borderRadius = '4px';
button.style.padding = '6px'; button.style.padding = '6px';
button.style.backgroundColor = 'var(--primary-bg)'; button.style.backgroundColor = 'var(--primary-bg)';
const svg = button.querySelector('svg'); const svg = button.querySelector('svg');
if (svg) { if (svg) {
svg.style.width = '20px'; svg.style.width = '20px';
svg.style.height = '20px'; svg.style.height = '20px';
}
});
if (buttons.length === 0) {
requestAnimationFrame(replaceButtonIcon);
} }
}; };
requestAnimationFrame(replaceButtonIcon);
// Initial application — retry until the button is rendered by Vue
const pollUntilFound = () => {
const buttons = document.querySelectorAll('button[aria-label="Launch LoRA Manager (Shift+Click opens in new window)"]');
if (buttons.length > 0) {
buttons.forEach(applyIconToButton);
} else {
requestAnimationFrame(pollUntilFound);
}
};
requestAnimationFrame(pollUntilFound);
// MutationObserver: keep the SVG icon in place after Vue re-renders
// (e.g. when the properties panel is toggled inside a subgraph)
if (typeof MutationObserver !== 'undefined') {
const observer = new MutationObserver(() => {
const buttons = document.querySelectorAll('button[aria-label="Launch LoRA Manager (Shift+Click opens in new window)"]');
buttons.forEach(button => {
// Only re-apply when Vue has reset innerHTML back to <i>
if (button.querySelector('i')) {
applyIconToButton(button);
}
});
});
// Watch the action bar and a broad ancestor so we cover re-mounts
const watchNode = document.querySelector('[data-testid="action-bar-buttons"]')
|| document.querySelector('.actionbar-container')
|| document.body;
observer.observe(watchNode, { childList: true, subtree: true });
// Store reference for potential cleanup
window.__lmIconObserver = observer;
}
}, },
}; };
if (useActionBar) { if (useActionBar) {
extensionObj.actionBarButtons = [ extensionObj.actionBarButtons = [
{ {
icon: "icon-[mdi--alpha-l-box] size-4", icon: "icon-[lucide--layers] size-4",
tooltip: BUTTON_TOOLTIP, tooltip: BUTTON_TOOLTIP,
onClick: openLoraManager onClick: openLoraManager
} }