usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(frontend): applyThemeのstartViewTransitionでエラーハンドリングする

This commit is contained in:
tamaina 2025-09-18 21:01:01 +09:00
parent 5fe08d0bbb
commit ecc8686a82
1 changed files with 18 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
packages/frontend/src/theme.ts
View File

@ -133,7 +133,7 @@ function applyThemeInternal(theme: Theme, persist: boolean) {
let timeout: number | null = null; let timeout: number | null = null;
let currentTheme: Theme | null = null; let currentTheme: Theme | null = null;
export function applyTheme(theme: Theme, persist = true) { export async function applyTheme(theme: Theme, persist = true) {
if (timeout) { if (timeout) {
window.clearTimeout(timeout); window.clearTimeout(timeout);
timeout = null; timeout = null;
@ -144,15 +144,26 @@ export function applyTheme(theme: Theme, persist = true) {
currentTheme = deepClone(theme); currentTheme = deepClone(theme);
if (window.document.startViewTransition != null) { if (window.document.startViewTransition != null) {
window.document.documentElement.classList.add('_themeChanging_'); // startViewTransitionはいくつかの理由でエラーになることがあり、特にここはブートエラーになりやすいのでエラーハンドリングする
window.document.startViewTransition(async () => { // See https://github.com/misskey-dev/misskey/issues/16562
applyThemeInternal(theme, persist);
await nextTick(); let applied = false;
}).finished.then(() => { try {
window.document.documentElement.classList.add('_themeChanging_');
await window.document.startViewTransition(async () => {
applyThemeInternal(theme, persist);
applied = true;
await nextTick();
}).finished;
} catch (e) {
console.error('applyTheme: something happened while ViewTransition', e);
if (!applied) applyThemeInternal(theme, persist);
} finally {
window.document.documentElement.classList.remove('_themeChanging_'); window.document.documentElement.classList.remove('_themeChanging_');
// 色計算など再度行えるようにクライアント全体に通知 // 色計算など再度行えるようにクライアント全体に通知
globalEvents.emit('themeChanged'); globalEvents.emit('themeChanged');
}); }
} else { } else {
applyThemeInternal(theme, persist); applyThemeInternal(theme, persist);
// 色計算など再度行えるようにクライアント全体に通知 // 色計算など再度行えるようにクライアント全体に通知