修复推荐页滑动切换回弹
为推荐页滑动提交后的 rail 复位增加无过渡 resetting 状态 补充推荐滑动状态模型测试覆盖 resetting 类名 补齐推荐页交互测试中的小程序运行态 mock
This commit is contained in:
@@ -200,6 +200,7 @@ const authServiceMocks = vi.hoisted(() => ({
|
||||
token: 'runtime-guest-token',
|
||||
expiresAt: '2099-01-01T00:00:00.000Z',
|
||||
})),
|
||||
isWechatMiniProgramWebViewRuntime: vi.fn(() => false),
|
||||
getPublicAuthUserByCode: vi.fn(
|
||||
async (publicUserCode: string): Promise<PublicUserSummary> => ({
|
||||
id: `public-user-${publicUserCode}`,
|
||||
@@ -222,6 +223,8 @@ const authServiceMocks = vi.hoisted(() => ({
|
||||
|
||||
vi.mock('../../services/authService', () => ({
|
||||
ensureRuntimeGuestToken: authServiceMocks.ensureRuntimeGuestToken,
|
||||
isWechatMiniProgramWebViewRuntime:
|
||||
authServiceMocks.isWechatMiniProgramWebViewRuntime,
|
||||
getPublicAuthUserByCode: authServiceMocks.getPublicAuthUserByCode,
|
||||
getPublicAuthUserById: authServiceMocks.getPublicAuthUserById,
|
||||
}));
|
||||
|
||||
@@ -3421,6 +3421,8 @@ export function RpgEntryHomeView({
|
||||
const [recommendDragOffsetY, setRecommendDragOffsetY] = useState(0);
|
||||
const [recommendDragCommitDirection, setRecommendDragCommitDirection] =
|
||||
useState<RecommendSwipeDirection | null>(null);
|
||||
const [isRecommendDragResetting, setIsRecommendDragResetting] =
|
||||
useState(false);
|
||||
const activeRecommendEntryKeyForSelection =
|
||||
recommendFeedWindow.activeEntryKey;
|
||||
const recommendCardStageRef = useRef<HTMLDivElement | null>(null);
|
||||
@@ -3435,6 +3437,7 @@ export function RpgEntryHomeView({
|
||||
return;
|
||||
}
|
||||
|
||||
setIsRecommendDragResetting(false);
|
||||
setRecommendDragCommitDirection(direction);
|
||||
const panelHeight =
|
||||
recommendCardStageRef.current?.getBoundingClientRect().height ?? 0;
|
||||
@@ -3451,8 +3454,12 @@ export function RpgEntryHomeView({
|
||||
} else {
|
||||
onSelectPreviousRecommendEntry?.(activeRecommendEntryKeyForSelection);
|
||||
}
|
||||
setIsRecommendDragResetting(true);
|
||||
setRecommendDragOffsetY(0);
|
||||
setRecommendDragCommitDirection(null);
|
||||
window.requestAnimationFrame(() => {
|
||||
setIsRecommendDragResetting(false);
|
||||
});
|
||||
}, RECOMMEND_ENTRY_COMMIT_ANIMATION_MS);
|
||||
},
|
||||
[
|
||||
@@ -3514,6 +3521,7 @@ export function RpgEntryHomeView({
|
||||
const deltaY = event.clientY - drag.startY;
|
||||
const commitDirection = resolveRecommendDragCommitDirection(deltaY);
|
||||
if (!commitDirection) {
|
||||
setIsRecommendDragResetting(false);
|
||||
setRecommendDragOffsetY(0);
|
||||
return;
|
||||
}
|
||||
@@ -3529,6 +3537,7 @@ export function RpgEntryHomeView({
|
||||
event.currentTarget.releasePointerCapture?.(drag.pointerId);
|
||||
}
|
||||
recommendDragStartRef.current = null;
|
||||
setIsRecommendDragResetting(false);
|
||||
setRecommendDragOffsetY(0);
|
||||
},
|
||||
[],
|
||||
@@ -3539,6 +3548,7 @@ export function RpgEntryHomeView({
|
||||
const recommendRailClassName = buildRecommendSwipeRailClassName({
|
||||
offsetY: recommendDragOffsetY,
|
||||
commitDirection: recommendDragCommitDirection,
|
||||
isResetting: isRecommendDragResetting,
|
||||
});
|
||||
const selectNextRecommendEntry = useCallback(() => {
|
||||
if (
|
||||
|
||||
@@ -38,6 +38,13 @@ describe('rpgEntryRecommendSwipeDeckModel', () => {
|
||||
expect(
|
||||
buildRecommendSwipeRailClassName({ offsetY: -320, commitDirection: 1 }),
|
||||
).toBe('platform-recommend-swipe-rail--committing');
|
||||
expect(
|
||||
buildRecommendSwipeRailClassName({
|
||||
offsetY: 0,
|
||||
commitDirection: null,
|
||||
isResetting: true,
|
||||
}),
|
||||
).toBe('platform-recommend-swipe-rail--resetting');
|
||||
|
||||
expect(
|
||||
shouldAnimateRecommendSwipe({
|
||||
|
||||
@@ -9,6 +9,7 @@ export type RecommendSwipeDirection = 1 | -1;
|
||||
export type RecommendSwipeRailState = {
|
||||
offsetY: number;
|
||||
commitDirection: RecommendSwipeDirection | null;
|
||||
isResetting?: boolean;
|
||||
};
|
||||
|
||||
/** 收口推荐卡纵向滑动的纯判定,页面只保留 pointer 与动画副作用。 */
|
||||
@@ -47,6 +48,10 @@ export function resolveRecommendCommitOffset(
|
||||
export function buildRecommendSwipeRailClassName(
|
||||
state: RecommendSwipeRailState,
|
||||
) {
|
||||
if (state.isResetting) {
|
||||
return 'platform-recommend-swipe-rail--resetting';
|
||||
}
|
||||
|
||||
if (state.commitDirection) {
|
||||
return 'platform-recommend-swipe-rail--committing';
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user