fix: 长分类名称省略时保留数量
This commit is contained in:
@@ -593,6 +593,35 @@ app.whenReady().then(async () => {
|
||||
});
|
||||
})()`)
|
||||
);
|
||||
const longShelfName = 'TheArtOfComputerProgramming超长分类名称';
|
||||
library.updateShelf(researchShelf.id, { name: longShelfName });
|
||||
await pollJs(
|
||||
'超长分类名称刷新',
|
||||
`Array.from(document.querySelectorAll('#libraryShelfList .library-filter'))
|
||||
.some((button) => button.firstElementChild.textContent === ${JSON.stringify(longShelfName)})`
|
||||
);
|
||||
check(
|
||||
'超长分类只省略名称并完整保留数量与操作区',
|
||||
await js(`(() => {
|
||||
const button = Array.from(document.querySelectorAll('#libraryShelfList .library-filter'))
|
||||
.find((candidate) => candidate.firstElementChild.textContent === ${JSON.stringify(longShelfName)});
|
||||
const name = button.firstElementChild;
|
||||
const count = button.querySelector('.library-filter-count');
|
||||
const actions = button.closest('.library-shelf-row').querySelector('.library-shelf-actions');
|
||||
return getComputedStyle(button).display === 'flex'
|
||||
&& getComputedStyle(name).textOverflow === 'ellipsis'
|
||||
&& name.scrollWidth > name.clientWidth
|
||||
&& count.textContent === '(1)'
|
||||
&& count.getBoundingClientRect().width > 0
|
||||
&& count.getBoundingClientRect().right <= actions.getBoundingClientRect().left + 1;
|
||||
})()`)
|
||||
);
|
||||
library.updateShelf(researchShelf.id, { name: researchShelf.name });
|
||||
await pollJs(
|
||||
'恢复研究书架名称',
|
||||
`Array.from(document.querySelectorAll('#libraryShelfList .library-filter'))
|
||||
.some((button) => button.firstElementChild.textContent === ${JSON.stringify(researchShelf.name)})`
|
||||
);
|
||||
check(
|
||||
'标签侧栏显示真实聚合计数',
|
||||
await js(`(() => {
|
||||
|
||||
@@ -620,7 +620,15 @@ test('侧栏行内操作不占据布局,选中高亮与静态筛选项等宽',
|
||||
assert.doesNotMatch(css, /\.library-shelf-actions\s*\{\s*display:\s*flex;\s*flex:\s*none/);
|
||||
assert.match(css, /\.library-shelf-row \.library-filter,\s*\n\.library-tag-row \.library-filter\s*\{[^}]*padding-right:\s*48px/);
|
||||
// 分类数量紧跟名称显示为「分类(数量)」,不再像标签数量那样浮到右侧
|
||||
assert.match(css, /#libraryTab \.library-filter\[data-shelf\] \.library-filter-count,\s*\n\.library-shelf-row \.library-filter-count\s*\{\s*float:\s*none/);
|
||||
assert.match(css, /\.library-shelf-row \.library-filter\s*\{[^}]*display:\s*flex/);
|
||||
const shelfName = css.match(
|
||||
/\.library-shelf-row \.library-filter > span:first-child\s*\{([^}]*)\}/
|
||||
);
|
||||
assert.ok(shelfName, '缺少长分类名称的独立省略样式');
|
||||
assert.match(shelfName[1], /min-width:\s*0/);
|
||||
assert.match(shelfName[1], /overflow:\s*hidden/);
|
||||
assert.match(shelfName[1], /text-overflow:\s*ellipsis/);
|
||||
assert.match(css, /#libraryTab \.library-filter\[data-shelf\] \.library-filter-count,\s*\n\.library-shelf-row \.library-filter-count\s*\{[^}]*flex:\s*none;[^}]*float:\s*none/);
|
||||
const actionButtons = css.match(
|
||||
/\.library-shelf-actions \.notes-icon-btn,\s*\n\.library-tag-actions \.notes-icon-btn\s*\{([^}]*)\}/
|
||||
);
|
||||
|
||||
+14
-1
@@ -714,6 +714,16 @@ body {
|
||||
.library-tag-row { position: relative; display: flex; align-items: center; }
|
||||
.library-shelf-row .library-filter,
|
||||
.library-tag-row .library-filter { flex: 1; padding-right: 48px; }
|
||||
.library-shelf-row .library-filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.library-shelf-row .library-filter > span:first-child {
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.library-shelf-actions,
|
||||
.library-tag-actions {
|
||||
position: absolute;
|
||||
@@ -741,7 +751,10 @@ body {
|
||||
}
|
||||
.library-filter-count { float: right; color: var(--text-dim); }
|
||||
#libraryTab .library-filter[data-shelf] .library-filter-count,
|
||||
.library-shelf-row .library-filter-count { float: none; }
|
||||
.library-shelf-row .library-filter-count {
|
||||
flex: none;
|
||||
float: none;
|
||||
}
|
||||
.library-content { min-width: 0; }
|
||||
.library-search {
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user