From dd0a77bfc919ee70f5c483d407c621046f11399b Mon Sep 17 00:00:00 2001 From: haotool Date: Sun, 28 Jun 2026 01:14:58 +0800 Subject: [PATCH] =?UTF-8?q?fix(ratewise):=20=E4=BF=AE=E5=BE=A9=20Threads?= =?UTF-8?q?=20Barcelona=20UA=20=E5=85=A7=E5=BB=BA=E7=80=8F=E8=A6=BD?= =?UTF-8?q?=E5=99=A8=E5=81=B5=E6=B8=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - pwaInstallGuide SSOT 補 Barcelona token(2024+ Threads 內建瀏覽器 UA) - 新增 iOS/Android production UA 單元測試與 PwaInstallGuide 動畫指引覆蓋 測試:ratewise 目標測試 32 項通過、typecheck 通過 Co-authored-by: Cursor --- .changeset/threads-barcelona-inapp-ua.md | 5 +++++ .../__tests__/PwaInstallGuide.test.tsx | 18 +++++++++++----- .../utils/__tests__/pwaInstallGuide.test.ts | 21 ++++++++++++++++--- apps/ratewise/src/utils/pwaInstallGuide.ts | 3 ++- .../dev/002_development_reward_penalty_log.md | 7 ++++++- 5 files changed, 44 insertions(+), 10 deletions(-) create mode 100644 .changeset/threads-barcelona-inapp-ua.md diff --git a/.changeset/threads-barcelona-inapp-ua.md b/.changeset/threads-barcelona-inapp-ua.md new file mode 100644 index 000000000..95769aa20 --- /dev/null +++ b/.changeset/threads-barcelona-inapp-ua.md @@ -0,0 +1,5 @@ +--- +'@app/ratewise': patch +--- + +修復 Threads 內建瀏覽器無法顯示「在瀏覽器開啟」PWA 安裝指引與右上角動態提示 diff --git a/apps/ratewise/src/components/__tests__/PwaInstallGuide.test.tsx b/apps/ratewise/src/components/__tests__/PwaInstallGuide.test.tsx index a3ecc4b0d..a3d8cdbf3 100644 --- a/apps/ratewise/src/components/__tests__/PwaInstallGuide.test.tsx +++ b/apps/ratewise/src/components/__tests__/PwaInstallGuide.test.tsx @@ -66,11 +66,19 @@ describe('PwaInstallGuide', () => { ); }); - it('renders external-browser guidance inside Threads in-app browser', () => { - mockNavigator( - 'Mozilla/5.0 (iPhone; CPU iPhone OS 18_5 like Mac OS X) AppleWebKit/605.1.15 Mobile/15E148 Threads 337.0 Instagram 337.0', - 'iPhone', - ); + it.each([ + { + label: 'legacy Threads token', + userAgent: + 'Mozilla/5.0 (iPhone; CPU iPhone OS 18_5 like Mac OS X) AppleWebKit/605.1.15 Mobile/15E148 Threads 337.0 Instagram 337.0', + }, + { + label: 'Barcelona iOS token (2025+ production)', + userAgent: + 'Mozilla/5.0 (iPhone; CPU iPhone OS 18_7 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/22H352 Barcelona 431.0.0.25.69 (iPhone13,3; iOS 18_7_8; en_US; en; scale=3.00; 1170x2532; IABMV/1; 979167741)', + }, + ])('renders external-browser guidance inside Threads in-app browser: $label', ({ userAgent }) => { + mockNavigator(userAgent, 'iPhone'); render(); showGuide(); diff --git a/apps/ratewise/src/utils/__tests__/pwaInstallGuide.test.ts b/apps/ratewise/src/utils/__tests__/pwaInstallGuide.test.ts index 11a6e3f96..c055fce09 100644 --- a/apps/ratewise/src/utils/__tests__/pwaInstallGuide.test.ts +++ b/apps/ratewise/src/utils/__tests__/pwaInstallGuide.test.ts @@ -42,11 +42,26 @@ describe('pwaInstallGuide environment detection', () => { expect(environment.shouldShowGuide).toBe(true); }); - it('detects Threads in-app browser and still shows external-browser guide', () => { - const environment = getPwaInstallEnvironment({ + it.each([ + { + label: 'legacy Threads token', userAgent: 'Mozilla/5.0 (iPhone; CPU iPhone OS 18_5 like Mac OS X) AppleWebKit/605.1.15 Mobile/15E148 Threads 337.0 Instagram 337.0', - platform: 'iPhone', + }, + { + label: 'Barcelona iOS token (2025+ production)', + userAgent: + 'Mozilla/5.0 (iPhone; CPU iPhone OS 18_7 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/22H352 Barcelona 431.0.0.25.69 (iPhone13,3; iOS 18_7_8; en_US; en; scale=3.00; 1170x2532; IABMV/1; 979167741)', + }, + { + label: 'Barcelona Android token', + userAgent: + 'Mozilla/5.0 (Linux; Android 14; SM-S921B Build/UP1A.231005.007; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/136.0.7103.125 Mobile Safari/537.36 Barcelona 382.0.0.51.85 Android (34/14; 480dpi; 1080x2109; samsung)', + }, + ])('detects Threads in-app browser: $label', ({ userAgent }) => { + const environment = getPwaInstallEnvironment({ + userAgent, + platform: userAgent.includes('Android') ? 'Linux armv8l' : 'iPhone', maxTouchPoints: 5, }); diff --git a/apps/ratewise/src/utils/pwaInstallGuide.ts b/apps/ratewise/src/utils/pwaInstallGuide.ts index fc585c2f2..2b0abde06 100644 --- a/apps/ratewise/src/utils/pwaInstallGuide.ts +++ b/apps/ratewise/src/utils/pwaInstallGuide.ts @@ -27,8 +27,9 @@ export interface PwaInstallEnvironment { } // Messenger 須先於 facebook:其 UA 含 FBAN/FB_IAB,否則會被 facebook 規則搶先命中。 +// Threads 2024+ 內建瀏覽器 UA 使用內部代號 Barcelona(非 Threads 字串);來源:whatmyuseragent.com / udger UA list。 const IN_APP_BROWSER_PATTERNS: [InAppBrowserKind, RegExp][] = [ - ['threads', /\bThreads\b/i], + ['threads', /\b(Threads|Barcelona)\b/i], ['messenger', /MessengerForiOS|FB_IAB\/MESSENGER|FB_IAB\/Orca|Orca-Android/i], ['instagram', /\bInstagram\b/i], ['facebook', /\b(FBAN|FBAV|FBIOS|FB_IAB|FB4A)\b/i], diff --git a/docs/dev/002_development_reward_penalty_log.md b/docs/dev/002_development_reward_penalty_log.md index 079b32343..bc38b5da5 100644 --- a/docs/dev/002_development_reward_penalty_log.md +++ b/docs/dev/002_development_reward_penalty_log.md @@ -2,7 +2,7 @@ > 版本:outline-v2-ultra > 原則:每筆只保留日期、ID、原因、解法。 -> 本次分數變化:+1(reward 1、penalty 0、neutral 0)|累計總分:+78 +> 本次分數變化:+1(reward 1、penalty 0、neutral 0)|累計總分:+79 ## 新增模板(4 行) @@ -13,6 +13,11 @@ ## 條目(新→舊) +- 日期:2026-06-28 +- ID:reward-threads-barcelona-inapp-ua +- 原因:Threads 2024+ 內建瀏覽器 UA 改用 Barcelona 代號,僅匹配 Threads 字串時 PWA 安裝指引與右上角動畫不顯示 +- 解法:pwaInstallGuide SSOT 補 Barcelona token,並以 production UA 樣本覆蓋 iOS/Android 單元測試 + - 日期:2026-06-27 - ID:reward-cold-start-multi-hydration-fallback - 原因:RememberedHomeRoute 僅依 hasHydrated/onFinishHydration 設 hydrated,SSG/CSR 生產環境 store 已 merge persist 但回呼未觸發,multi 冷啟動無法還原