fix: restore puzzle runtime url state

This commit is contained in:
2026-05-25 22:52:38 +08:00
parent 30cf8abbf7
commit eb6ab404e2
12 changed files with 1917 additions and 177 deletions

View File

@@ -0,0 +1,85 @@
import { describe, expect, it, vi } from 'vitest';
import {
clearCreationUrlState,
readCreationUrlState,
writeCreationUrlState,
} from './creationUrlState';
describe('creationUrlState', () => {
it('writes and reads restore state on creation restore paths', () => {
const replaceState = vi.fn();
const env = {
location: {
pathname: '/creation/puzzle/result',
search: '?clientRuntime=wechat_mini_program',
},
history: { replaceState },
};
writeCreationUrlState(
{
sessionId: ' session-1 ',
profileId: 'profile-1',
draftId: 'draft-1',
workId: 'work-1',
},
env,
);
expect(replaceState).toHaveBeenCalledWith(
null,
'',
'/creation/puzzle/result?clientRuntime=wechat_mini_program&sessionId=session-1&profileId=profile-1&draftId=draft-1&workId=work-1',
);
expect(
readCreationUrlState({
location: {
pathname: '/creation/puzzle/result',
search:
'?sessionId=session-1&profileId=profile-1&draftId=draft-1&workId=work-1',
},
}),
).toEqual({
sessionId: 'session-1',
profileId: 'profile-1',
draftId: 'draft-1',
workId: 'work-1',
});
});
it('ignores writes and clears outside creation restore paths', () => {
const replaceState = vi.fn();
const env = {
location: {
pathname: '/works/detail',
search: '?work=PZ-123&sessionId=session-1',
},
history: { replaceState },
};
writeCreationUrlState({ sessionId: 'session-2' }, env);
clearCreationUrlState(env);
expect(replaceState).not.toHaveBeenCalled();
});
it('clears only private restore params on creation restore paths', () => {
const replaceState = vi.fn();
const env = {
location: {
pathname: '/creation/bark-battle/result',
search: '?draftId=draft-1&workId=work-1&clientRuntime=wechat',
},
history: { replaceState },
};
clearCreationUrlState(env);
expect(replaceState).toHaveBeenCalledWith(
null,
'',
'/creation/bark-battle/result?clientRuntime=wechat',
);
});
});

View File

@@ -0,0 +1,220 @@
import {
CUSTOM_WORLD_AGENT_OPERATION_QUERY_KEY,
CUSTOM_WORLD_AGENT_SESSION_QUERY_KEY,
CUSTOM_WORLD_GENERATION_SOURCE_QUERY_KEY,
} from './customWorldAgentUiState';
export const CREATION_URL_SESSION_QUERY_KEY = 'sessionId';
export const CREATION_URL_PROFILE_QUERY_KEY = 'profileId';
export const CREATION_URL_DRAFT_QUERY_KEY = 'draftId';
export const CREATION_URL_WORK_QUERY_KEY = 'workId';
export const CREATION_URL_RESTORE_QUERY_KEYS = [
CUSTOM_WORLD_AGENT_SESSION_QUERY_KEY,
CUSTOM_WORLD_AGENT_OPERATION_QUERY_KEY,
CUSTOM_WORLD_GENERATION_SOURCE_QUERY_KEY,
CREATION_URL_SESSION_QUERY_KEY,
CREATION_URL_PROFILE_QUERY_KEY,
CREATION_URL_DRAFT_QUERY_KEY,
CREATION_URL_WORK_QUERY_KEY,
] as const;
export type CreationUrlState = {
sessionId?: string | null;
profileId?: string | null;
draftId?: string | null;
workId?: string | null;
};
type CreationUrlEnvironment = {
location?: {
pathname: string;
search: string;
} | null;
history?: {
replaceState: (
data: unknown,
unused: string,
url?: string | URL | null,
) => void;
} | null;
};
const CREATION_PATH_PREFIXES = [
'/creation/rpg',
'/creation/big-fish',
'/creation/match3d',
'/creation/square-hole',
'/creation/jump-hop',
'/creation/wooden-fish',
'/creation/bark-battle',
'/creation/visual-novel',
'/creation/baby-object-match',
'/creation/puzzle',
] as const;
function resolveEnvironment(
env?: CreationUrlEnvironment,
): Required<CreationUrlEnvironment> {
if (env) {
return {
location: env.location ?? null,
history: env.history ?? null,
};
}
if (typeof window === 'undefined') {
return {
location: null,
history: null,
};
}
return {
location: window.location,
history: window.history,
};
}
function normalizeValue(value: unknown) {
return typeof value === 'string' && value.trim() ? value.trim() : null;
}
function normalizePathname(value: string | undefined) {
const pathname = value?.trim().toLowerCase() ?? '';
if (!pathname || pathname === '/') {
return '/';
}
return pathname.replace(/\/+$/u, '');
}
export function isCreationRestorePath(pathname: string | undefined) {
const normalizedPathname = normalizePathname(pathname);
return CREATION_PATH_PREFIXES.some(
(pathPrefix) =>
normalizedPathname === pathPrefix ||
normalizedPathname.startsWith(`${pathPrefix}/`),
);
}
export function isSameCreationFlowPath(
currentPathname: string | undefined,
nextPathname: string | undefined,
) {
const normalizedCurrentPath = normalizePathname(currentPathname);
const normalizedNextPath = normalizePathname(nextPathname);
if (
!normalizedCurrentPath ||
!normalizedNextPath ||
normalizedCurrentPath === '/' ||
normalizedNextPath === '/'
) {
return false;
}
const currentCreationPrefix = CREATION_PATH_PREFIXES.find((pathPrefix) =>
normalizedCurrentPath === pathPrefix ||
normalizedCurrentPath.startsWith(`${pathPrefix}/`),
);
const nextCreationPrefix = CREATION_PATH_PREFIXES.find((pathPrefix) =>
normalizedNextPath === pathPrefix ||
normalizedNextPath.startsWith(`${pathPrefix}/`),
);
return Boolean(
currentCreationPrefix &&
nextCreationPrefix &&
currentCreationPrefix === nextCreationPrefix,
);
}
export function buildCreationUrlSearchFromParams(search: string) {
const params = new URLSearchParams(search);
const preservedParams = new URLSearchParams();
CREATION_URL_RESTORE_QUERY_KEYS.forEach((key) => {
const value = normalizeValue(params.get(key));
if (value) {
preservedParams.set(key, value);
}
});
const queryString = preservedParams.toString();
return queryString ? `?${queryString}` : '';
}
export function readCreationUrlState(
env?: CreationUrlEnvironment,
): CreationUrlState {
const resolved = resolveEnvironment(env);
const params = new URLSearchParams(resolved.location?.search ?? '');
return {
sessionId: normalizeValue(params.get(CREATION_URL_SESSION_QUERY_KEY)),
profileId: normalizeValue(params.get(CREATION_URL_PROFILE_QUERY_KEY)),
draftId: normalizeValue(params.get(CREATION_URL_DRAFT_QUERY_KEY)),
workId: normalizeValue(params.get(CREATION_URL_WORK_QUERY_KEY)),
};
}
export function writeCreationUrlState(
state: CreationUrlState,
env?: CreationUrlEnvironment,
) {
const resolved = resolveEnvironment(env);
if (
!resolved.location ||
!resolved.history?.replaceState ||
!isCreationRestorePath(resolved.location.pathname)
) {
return;
}
const params = new URLSearchParams(resolved.location.search);
const entries = [
[CREATION_URL_SESSION_QUERY_KEY, state.sessionId],
[CREATION_URL_PROFILE_QUERY_KEY, state.profileId],
[CREATION_URL_DRAFT_QUERY_KEY, state.draftId],
[CREATION_URL_WORK_QUERY_KEY, state.workId],
] as const;
entries.forEach(([key, rawValue]) => {
const value = normalizeValue(rawValue);
if (value) {
params.set(key, value);
} else {
params.delete(key);
}
});
const search = params.toString();
const nextUrl = search
? `${resolved.location.pathname}?${search}`
: resolved.location.pathname;
resolved.history.replaceState(null, '', nextUrl);
}
export function clearCreationUrlState(env?: CreationUrlEnvironment) {
const resolved = resolveEnvironment(env);
if (
!resolved.location ||
!resolved.history?.replaceState ||
!isCreationRestorePath(resolved.location.pathname)
) {
return;
}
const params = new URLSearchParams(resolved.location.search);
[
CREATION_URL_SESSION_QUERY_KEY,
CREATION_URL_PROFILE_QUERY_KEY,
CREATION_URL_DRAFT_QUERY_KEY,
CREATION_URL_WORK_QUERY_KEY,
].forEach((key) => params.delete(key));
const search = params.toString();
const nextUrl = search
? `${resolved.location.pathname}?${search}`
: resolved.location.pathname;
resolved.history.replaceState(null, '', nextUrl);
}

View File

@@ -0,0 +1,114 @@
import { describe, expect, it, vi } from 'vitest';
import {
clearPuzzleRuntimeUrlState,
readPuzzleRuntimeUrlState,
writePuzzleRuntimeUrlState,
} from './puzzleRuntimeUrlState';
describe('puzzleRuntimeUrlState', () => {
it('writes puzzle runtime identity on runtime paths', () => {
const replaceState = vi.fn();
const env = {
location: {
pathname: '/runtime/puzzle',
search: '?clientRuntime=wechat_mini_program',
},
history: { replaceState },
};
writePuzzleRuntimeUrlState(
{
runtimeSessionId: 'puzzle-session-1',
runtimeProfileId: 'puzzle-profile-1',
runtimeLevelId: 'puzzle-level-2',
publicWorkCode: 'PZ-12345678',
mode: 'draft',
},
env,
);
expect(replaceState).toHaveBeenCalledWith(
null,
'',
'/runtime/puzzle?clientRuntime=wechat_mini_program&runtimeProfileId=puzzle-profile-1&runtimeSessionId=puzzle-session-1&runtimeLevelId=puzzle-level-2&work=PZ-12345678&mode=draft',
);
expect(
readPuzzleRuntimeUrlState({
location: {
pathname: '/runtime/puzzle',
search:
'?runtimeProfileId=puzzle-profile-1&runtimeSessionId=puzzle-session-1&runtimeLevelId=puzzle-level-2&work=PZ-12345678&mode=draft',
},
}),
).toEqual({
runtimeProfileId: 'puzzle-profile-1',
runtimeSessionId: 'puzzle-session-1',
runtimeLevelId: 'puzzle-level-2',
publicWorkCode: 'PZ-12345678',
mode: 'draft',
});
});
it('ignores writes outside puzzle runtime paths', () => {
const replaceState = vi.fn();
const env = {
location: {
pathname: '/creation/puzzle/result',
search: '?sessionId=puzzle-session-1',
},
history: { replaceState },
};
writePuzzleRuntimeUrlState({ runtimeSessionId: 'puzzle-session-2' }, env);
expect(replaceState).not.toHaveBeenCalled();
});
it('can write runtime state to an explicit puzzle runtime pathname', () => {
const replaceState = vi.fn();
const env = {
location: {
pathname: '/creation/puzzle/result',
search: '?clientRuntime=wechat_mini_program',
},
history: { replaceState },
};
writePuzzleRuntimeUrlState(
{
runtimeProfileId: 'puzzle-profile-1',
mode: 'published',
publicWorkCode: 'PZ-12345678',
},
env,
{ pathname: '/runtime/puzzle' },
);
expect(replaceState).toHaveBeenCalledWith(
null,
'',
'/runtime/puzzle?clientRuntime=wechat_mini_program&runtimeProfileId=puzzle-profile-1&work=PZ-12345678&mode=published',
);
});
it('clears only puzzle runtime restore params on runtime paths', () => {
const replaceState = vi.fn();
const env = {
location: {
pathname: '/runtime/puzzle',
search:
'?runtimeSessionId=puzzle-session-1&runtimeProfileId=puzzle-profile-1&runtimeLevelId=puzzle-level-1&work=PZ-12345678&mode=draft&clientRuntime=wechat',
},
history: { replaceState },
};
clearPuzzleRuntimeUrlState(env);
expect(replaceState).toHaveBeenCalledWith(
null,
'',
'/runtime/puzzle?clientRuntime=wechat',
);
});
});

View File

@@ -0,0 +1,155 @@
export const PUZZLE_RUNTIME_WORK_QUERY_KEY = 'work';
export const PUZZLE_RUNTIME_PROFILE_QUERY_KEY = 'runtimeProfileId';
export const PUZZLE_RUNTIME_SESSION_QUERY_KEY = 'runtimeSessionId';
export const PUZZLE_RUNTIME_LEVEL_QUERY_KEY = 'runtimeLevelId';
export const PUZZLE_RUNTIME_MODE_QUERY_KEY = 'mode';
export type PuzzleRuntimeUrlMode = 'draft' | 'published';
export type PuzzleRuntimeUrlState = {
runtimeProfileId?: string | null;
runtimeSessionId?: string | null;
runtimeLevelId?: string | null;
publicWorkCode?: string | null;
mode?: PuzzleRuntimeUrlMode | null;
};
type PuzzleRuntimeUrlEnvironment = {
location?: {
pathname: string;
search: string;
} | null;
history?: {
replaceState: (
data: unknown,
unused: string,
url?: string | URL | null,
) => void;
} | null;
};
type WritePuzzleRuntimeUrlOptions = {
pathname?: string;
};
function resolveEnvironment(
env?: PuzzleRuntimeUrlEnvironment,
): Required<PuzzleRuntimeUrlEnvironment> {
if (env) {
return {
location: env.location ?? null,
history: env.history ?? null,
};
}
if (typeof window === 'undefined') {
return {
location: null,
history: null,
};
}
return {
location: window.location,
history: window.history,
};
}
function normalizeValue(value: unknown) {
return typeof value === 'string' && value.trim() ? value.trim() : null;
}
function normalizeRuntimeMode(value: unknown): PuzzleRuntimeUrlMode | null {
const normalized = normalizeValue(value);
return normalized === 'draft' || normalized === 'published'
? normalized
: null;
}
function isPuzzleRuntimePath(pathname: string | undefined) {
return pathname?.trim().toLowerCase().replace(/\/+$/u, '') === '/runtime/puzzle';
}
export function readPuzzleRuntimeUrlState(
env?: PuzzleRuntimeUrlEnvironment,
): PuzzleRuntimeUrlState {
const resolved = resolveEnvironment(env);
const params = new URLSearchParams(resolved.location?.search ?? '');
return {
runtimeProfileId: normalizeValue(
params.get(PUZZLE_RUNTIME_PROFILE_QUERY_KEY),
),
runtimeSessionId: normalizeValue(
params.get(PUZZLE_RUNTIME_SESSION_QUERY_KEY),
),
runtimeLevelId: normalizeValue(params.get(PUZZLE_RUNTIME_LEVEL_QUERY_KEY)),
publicWorkCode: normalizeValue(params.get(PUZZLE_RUNTIME_WORK_QUERY_KEY)),
mode: normalizeRuntimeMode(params.get(PUZZLE_RUNTIME_MODE_QUERY_KEY)),
};
}
export function writePuzzleRuntimeUrlState(
state: PuzzleRuntimeUrlState,
env?: PuzzleRuntimeUrlEnvironment,
options: WritePuzzleRuntimeUrlOptions = {},
) {
const resolved = resolveEnvironment(env);
const pathname = options.pathname ?? resolved.location?.pathname;
if (
!resolved.location ||
!resolved.history?.replaceState ||
!isPuzzleRuntimePath(pathname)
) {
return;
}
const params = new URLSearchParams(resolved.location.search);
const entries = [
[PUZZLE_RUNTIME_PROFILE_QUERY_KEY, state.runtimeProfileId],
[PUZZLE_RUNTIME_SESSION_QUERY_KEY, state.runtimeSessionId],
[PUZZLE_RUNTIME_LEVEL_QUERY_KEY, state.runtimeLevelId],
[PUZZLE_RUNTIME_WORK_QUERY_KEY, state.publicWorkCode],
[PUZZLE_RUNTIME_MODE_QUERY_KEY, state.mode],
] as const;
entries.forEach(([key, rawValue]) => {
const value = normalizeValue(rawValue);
if (value) {
params.set(key, value);
} else {
params.delete(key);
}
});
const search = params.toString();
const nextPathname = pathname ?? resolved.location.pathname;
const nextUrl = search ? `${nextPathname}?${search}` : nextPathname;
resolved.history.replaceState(null, '', nextUrl);
}
export function clearPuzzleRuntimeUrlState(env?: PuzzleRuntimeUrlEnvironment) {
const resolved = resolveEnvironment(env);
if (
!resolved.location ||
!resolved.history?.replaceState ||
!isPuzzleRuntimePath(resolved.location.pathname)
) {
return;
}
const params = new URLSearchParams(resolved.location.search);
[
PUZZLE_RUNTIME_PROFILE_QUERY_KEY,
PUZZLE_RUNTIME_SESSION_QUERY_KEY,
PUZZLE_RUNTIME_LEVEL_QUERY_KEY,
PUZZLE_RUNTIME_WORK_QUERY_KEY,
PUZZLE_RUNTIME_MODE_QUERY_KEY,
].forEach((key) => params.delete(key));
const search = params.toString();
const nextUrl = search
? `${resolved.location.pathname}?${search}`
: resolved.location.pathname;
resolved.history.replaceState(null, '', nextUrl);
}