mirror of
https://github.com/go-gitea/gitea
synced 2025-07-05 10:07:22 +00:00
Fix duplicate dropdown dividers (#32760)
Fix #27466 The problem is that any item in the menu could be hidden, pure CSS won't work, and dropdown's builtin "hideDividers" doesn't work with our "scope dividers". The newly introduced "archived" label makes the dividers regression more.
This commit is contained in:
56
web_src/js/modules/fomantic/dropdown.test.ts
Normal file
56
web_src/js/modules/fomantic/dropdown.test.ts
Normal file
@ -0,0 +1,56 @@
|
||||
import {createElementFromHTML} from '../../utils/dom.ts';
|
||||
import {hideScopedEmptyDividers} from './dropdown.ts';
|
||||
|
||||
test('hideScopedEmptyDividers-simple', () => {
|
||||
const container = createElementFromHTML(`<div>
|
||||
<div class="divider"></div>
|
||||
<div class="item">a</div>
|
||||
<div class="divider"></div>
|
||||
<div class="divider"></div>
|
||||
<div class="divider"></div>
|
||||
<div class="item">b</div>
|
||||
<div class="divider"></div>
|
||||
</div>`);
|
||||
hideScopedEmptyDividers(container);
|
||||
expect(container.innerHTML).toEqual(`
|
||||
<div class="divider hidden transition"></div>
|
||||
<div class="item">a</div>
|
||||
<div class="divider hidden transition"></div>
|
||||
<div class="divider hidden transition"></div>
|
||||
<div class="divider"></div>
|
||||
<div class="item">b</div>
|
||||
<div class="divider hidden transition"></div>
|
||||
`);
|
||||
});
|
||||
|
||||
test('hideScopedEmptyDividers-hidden1', () => {
|
||||
const container = createElementFromHTML(`<div>
|
||||
<div class="item">a</div>
|
||||
<div class="divider" data-scope="b"></div>
|
||||
<div class="item tw-hidden" data-scope="b">b</div>
|
||||
</div>`);
|
||||
hideScopedEmptyDividers(container);
|
||||
expect(container.innerHTML).toEqual(`
|
||||
<div class="item">a</div>
|
||||
<div class="divider hidden transition" data-scope="b"></div>
|
||||
<div class="item tw-hidden" data-scope="b">b</div>
|
||||
`);
|
||||
});
|
||||
|
||||
test('hideScopedEmptyDividers-hidden2', () => {
|
||||
const container = createElementFromHTML(`<div>
|
||||
<div class="item" data-scope="">a</div>
|
||||
<div class="divider" data-scope="b"></div>
|
||||
<div class="item tw-hidden" data-scope="b">b</div>
|
||||
<div class="divider" data-scope=""></div>
|
||||
<div class="item" data-scope="">c</div>
|
||||
</div>`);
|
||||
hideScopedEmptyDividers(container);
|
||||
expect(container.innerHTML).toEqual(`
|
||||
<div class="item" data-scope="">a</div>
|
||||
<div class="divider hidden transition" data-scope="b"></div>
|
||||
<div class="item tw-hidden" data-scope="b">b</div>
|
||||
<div class="divider hidden transition" data-scope=""></div>
|
||||
<div class="item" data-scope="">c</div>
|
||||
`);
|
||||
});
|
Reference in New Issue
Block a user