From ecc8686a8228c278aca7fa19b450869ac336abf5 Mon Sep 17 00:00:00 2001
From: tamaina <tamaina@hotmail.co.jp>
Date: Thu, 18 Sep 2025 21:01:01 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20applyTheme=E3=81=AEstartViewTr?=
 =?UTF-8?q?ansition=E3=81=A7=E3=82=A8=E3=83=A9=E3=83=BC=E3=83=8F=E3=83=B3?=
 =?UTF-8?q?=E3=83=89=E3=83=AA=E3=83=B3=E3=82=B0=E3=81=99=E3=82=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 packages/frontend/src/theme.ts | 25 ++++++++++++++++++-------
 1 file changed, 18 insertions(+), 7 deletions(-)

diff --git a/packages/frontend/src/theme.ts b/packages/frontend/src/theme.ts
index 4d03b1d0e9..3d0f5d1f2b 100644
--- a/packages/frontend/src/theme.ts
+++ b/packages/frontend/src/theme.ts
@@ -133,7 +133,7 @@ function applyThemeInternal(theme: Theme, persist: boolean) {
 let timeout: number | null = null;
 let currentTheme: Theme | null = null;
 
-export function applyTheme(theme: Theme, persist = true) {
+export async function applyTheme(theme: Theme, persist = true) {
 	if (timeout) {
 		window.clearTimeout(timeout);
 		timeout = null;
@@ -144,15 +144,26 @@ export function applyTheme(theme: Theme, persist = true) {
 	currentTheme = deepClone(theme);
 
 	if (window.document.startViewTransition != null) {
-		window.document.documentElement.classList.add('_themeChanging_');
-		window.document.startViewTransition(async () => {
-			applyThemeInternal(theme, persist);
-			await nextTick();
-		}).finished.then(() => {
+		// startViewTransitionはいくつかの理由でエラーになることがあり、特にここはブートエラーになりやすいのでエラーハンドリングする
+		// See https://github.com/misskey-dev/misskey/issues/16562
+
+		let applied = false;
+		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_');
 			// 色計算など再度行えるようにクライアント全体に通知
 			globalEvents.emit('themeChanged');
-		});
+		}
 	} else {
 		applyThemeInternal(theme, persist);
 		// 色計算など再度行えるようにクライアント全体に通知