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

feat(ui): add keyboard shortcut cue in search bar, fix clear button positioning

Browse Source
This commit is contained in:
Will Miao
2026-06-24 20:21:15 +08:00
parent 845815b9b7
commit 8052cefd46
4 changed files with 121 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
tests/frontend/components/pageControls.filtering.test.js
View File

@@ -96,6 +96,7 @@ function renderControlsDom(pageKey) {
<div class="search-container">
<input id="searchInput" />
<i class="fas fa-search search-icon"></i>
<span class="search-shortcut-cue" id="searchShortcutCue"><kbd>Ctrl</kbd><kbd>F</kbd></span>
<button id="searchOptionsToggle" class="search-options-toggle"></button>
<button id="filterButton" class="search-filter-toggle">
<span id="activeFiltersCount" class="filter-badge" style="display: none">0</span>
@@ -215,6 +216,40 @@ describe('SearchManager filtering scenarios', () => {
expect(loadMoreWithVirtualScrollMock).toHaveBeenCalledWith(true, false);
expect(loadMoreWithVirtualScrollMock).toHaveBeenCalledTimes(1);
});
it.each([
['loras'],
['checkpoints'],
])('toggles clear button and shortcut cue visibility for %s page', async (pageKey) => {
vi.useFakeTimers();
renderControlsDom(pageKey);
const stateModule = await import('../../../static/js/state/index.js');
stateModule.initPageState(pageKey);
const { SearchManager } = await import('../../../static/js/managers/SearchManager.js');
new SearchManager({ page: pageKey, searchDelay: 0 });
const input = document.getElementById('searchInput');
const cue = document.getElementById('searchShortcutCue');
const clearBtn = document.querySelector('.search-clear');
// Initially empty: cue visible, clear hidden
expect(cue.classList.contains('hidden')).toBe(false);
expect(clearBtn.classList.contains('visible')).toBe(false);
// Type something: cue hidden, clear visible
input.value = 'flux';
input.dispatchEvent(new Event('input', { bubbles: true }));
expect(cue.classList.contains('hidden')).toBe(true);
expect(clearBtn.classList.contains('visible')).toBe(true);
// Clear via click: cue visible, clear hidden
clearBtn.click();
expect(input.value).toBe('');
expect(cue.classList.contains('hidden')).toBe(false);
expect(clearBtn.classList.contains('visible')).toBe(false);
});
});
describe('FilterManager tag and base model filters', () => {