kate522/wordpress-theme-aksrt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(user-home): hide the old panel content while the tab skeleton loads

Browse Source 
翻页 / 切 tab 是整页替换语义（author.js 最终就是 panel.innerHTML = html），
但加载态只做了骨架的显示，旧卡片与旧页码仍留在屏上，于是先看到
「第 1 页卡片 + 脚下一摞骨架」，等接口返回才换页。

加载期收起 .aksrt-user-home__post-list 的直接子级 .posts-item 与旧翻页控件，
让骨架独占内容区；对齐参考主题 post_ajax() 的 beforeSend（replace 时
$item.remove() + find(pag).remove()）。显隐仍走纯类切换，不写 inline display。

两点刻意的收窄：
- 只收直接子级 .posts-item 而非后代：骨架内层同样带 .posts-item，
  后代选择器会把骨架自己也藏掉，占位就永远出不来。
- 旧页码用 :has(.post_ajax_loader) 限定：关注 / 评论面板没有骨架，
  无条件隐藏会让它们加载时只剩一片空白。

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
kate522
2026-10-04 13:58:09 +08:00
co-authored by Claude Fable 5
parent 45dc909e4c
commit 16d67c8a87
2 changed files with 32 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/widget-system/post-visual-contract.test.cjs
+13
View File
@@ -269,6 +269,19 @@ test('related posts, author page and widgets use their dedicated renderers', ()
assert.match(userHomeCss, /\.aksrt-user-home \.dashboard-panel \.post_ajax_loader \{/);
assert.match(userHomeCss, /\.aksrt-user-home \.dashboard-panel\.is-loading \.post_ajax_loader \{/);
assert.doesNotMatch(userHomeCss, /\.dashboard-panel\.is-loading \{[\s\S]{0,80}opacity: \.6/);
// 翻页 / 切 tab 是整页替换语义（author.js 最终就是 panel.innerHTML = html），
// 骨架必须独占内容区。若骨架只是追加在旧卡片下方，加载期会先看到
// 「第 1 页卡片 + 脚下一摞骨架」再换页。对齐参考主题 post_ajax() 的
// beforeSend：replace 时 $item.remove() + find(pag).remove()。
// 刻意不按 data-view 收窄：card 模式下真实卡片同样是直接子级 .posts-item，
// 也要一起收起，否则卡片面板旧内容不会让位。
assert.match(userHomeCss, /\.dashboard-panel\.is-loading \.aksrt-user-home__post-list > \.posts-item \{\s*display: none;/);
// 必须收「直接子级」而非后代：骨架内层同样带 .posts-item，
// 写成后代选择器会连骨架自己一起隐藏掉，占位也就永远出不来了。
assert.doesNotMatch(userHomeCss, /\.dashboard-panel\.is-loading \.aksrt-user-home__post-list \.posts-item \{/);
// 旧翻页控件高亮的是旧页码，同属被替换的旧页内容。
assert.match(userHomeCss, /\.dashboard-panel\.is-loading:has\(\.post_ajax_loader\) \.profile-pagination \{\s*display: none;/);
assert.match(widgets, /aksrt_render_mini_list/);
assert.match(widgets, /swiper-container swiper-scroll/);
});