From 5fe08d0bbb7bb58234ec70e55289acfff8da0b8b Mon Sep 17 00:00:00 2001
From: syuilo <4439005+syuilo@users.noreply.github.com>
Date: Thu, 18 Sep 2025 19:18:31 +0900
Subject: [PATCH] =?UTF-8?q?fix(frontend):=20iOS=E3=81=A7=E3=80=81=E3=83=87?=
 =?UTF-8?q?=E3=83=90=E3=82=A4=E3=82=B9=E3=81=8C=E3=83=80=E3=83=BC=E3=82=AF?=
 =?UTF-8?q?=E3=83=A2=E3=83=BC=E3=83=89=E3=81=A0=E3=81=A8=E5=88=9D=E5=9B=9E?=
 =?UTF-8?q?=E8=AA=AD=E3=81=BF=E8=BE=BC=E3=81=BF=E6=99=82=E3=81=AB=E3=82=A8?=
 =?UTF-8?q?=E3=83=A9=E3=83=BC=E3=81=AB=E3=81=AA=E3=82=8B=E5=95=8F=E9=A1=8C?=
 =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fix #16562
---
 CHANGELOG.md                         |  1 +
 packages/frontend/src/boot/common.ts | 26 ++++++++++++++------------
 2 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ea1fd23efb..adeb453795 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@
 - Enhance: チャットの日本語名称がダイレクトメッセージに戻るとともに、ベータ版機能ではなくなりました
 - Enhance: 画像編集にマスクエフェクトを追加
 - Enhance: 時刻計算のための基準値を一か所で管理するようにし、パフォーマンスを向上
+- Fix: iOSで、デバイスがダークモードだと初回読み込み時にエラーになる問題を修正
 
 ### Server
 -
diff --git a/packages/frontend/src/boot/common.ts b/packages/frontend/src/boot/common.ts
index 574012ff78..4becf32ab5 100644
--- a/packages/frontend/src/boot/common.ts
+++ b/packages/frontend/src/boot/common.ts
@@ -151,7 +151,21 @@ export async function common(createVue: () => Promise<App<Element>>) {
 	}
 	//#endregion
 
+	//#region Sync dark mode
+	if (prefer.s.syncDeviceDarkMode) {
+		store.set('darkMode', isDeviceDarkmode());
+	}
+
+	window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (mql) => {
+		if (prefer.s.syncDeviceDarkMode) {
+			store.set('darkMode', mql.matches);
+		}
+	});
+	//#endregion
+
 	// NOTE: この処理は必ずクライアント更新チェック処理より後に来ること(テーマ再構築のため)
+	// NOTE: この処理は必ずダークモード判定処理より後に来ること(初回のテーマ適用のため)
+	// see: https://github.com/misskey-dev/misskey/issues/16562
 	watch(store.r.darkMode, (darkMode) => {
 		const theme = (() => {
 			if (darkMode) {
@@ -183,18 +197,6 @@ export async function common(createVue: () => Promise<App<Element>>) {
 		});
 	}
 
-	//#region Sync dark mode
-	if (prefer.s.syncDeviceDarkMode) {
-		store.set('darkMode', isDeviceDarkmode());
-	}
-
-	window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (mql) => {
-		if (prefer.s.syncDeviceDarkMode) {
-			store.set('darkMode', mql.matches);
-		}
-	});
-	//#endregion
-
 	if (!isSafeMode) {
 		if (prefer.s.darkTheme && store.s.darkMode) {
 			if (miLocalStorage.getItem('themeId') !== prefer.s.darkTheme.id) applyTheme(prefer.s.darkTheme);