Run OSC theme detection before TUI startup

Author: brandonkachen

cli/src/hooks/use-theme.tsx

@@ -14,7 +14,6 @@ import {
   detectPlatformTheme,
   detectTerminalOverrides,
   getOscDetectedTheme,
-  initializeOSCDetection,
   initializeThemeWatcher,
   setThemeResolver,
   setLastDetectedTheme,
@@ -125,16 +124,13 @@ export function initializeThemeStore() {
     },
   }))
 
-  // IMPORTANT: Set up the theme watcher BEFORE starting OSC detection
-  // OSC detection is async and calls recomputeSystemTheme() when done,
-  // which needs the themeStoreUpdater to be set
+  // Set up the theme watcher for reactive updates when system theme changes
   initializeThemeWatcher((name: ThemeName) => {
     useThemeStore.getState().setThemeName(name)
   })
 
-  // Start OSC detection AFTER the theme watcher is set up
-  // This ensures recomputeSystemTheme() can update the store when OSC completes
-  initializeOSCDetection()
+  // Note: OSC detection is done earlier in index.tsx before OpenTUI starts,
+  // so the result is already available via getOscDetectedTheme()
 }
 
 export const useTheme = (): ChatTheme => {

cli/src/index.tsx

@@ -22,18 +22,14 @@ import { getUserCredentials } from './utils/auth'
 import { loadAgentDefinitions } from './utils/load-agent-definitions'
 import { getLoadedAgentsData } from './utils/local-agent-registry'
 import { clearLogFile, logger } from './utils/logger'
+import { detectTerminalTheme } from './utils/terminal-color-detection'
+import { setOscDetectedTheme } from './utils/theme-system'
 import { filterNetworkErrors } from './utils/validation-error-helpers'
 
 import type { FileTreeNode } from '@codebuff/common/util/file'
 
 const require = createRequire(import.meta.url)
 
-const INTERNAL_OSC_FLAG = '--internal-osc-detect'
-
-function isOscDetectionRun(): boolean {
-  return process.argv.includes(INTERNAL_OSC_FLAG)
-}
-
 function loadPackageVersion(): string {
   if (process.env.CODEBUFF_CLI_VERSION) {
     return process.env.CODEBUFF_CLI_VERSION
@@ -131,6 +127,20 @@ function parseArgs(): ParsedArgs {
 }
 
 async function main(): Promise<void> {
+  // Run OSC theme detection BEFORE anything else.
+  // This MUST happen before OpenTUI starts because OSC responses come through stdin,
+  // and OpenTUI also listens to stdin. Running detection here ensures stdin is clean.
+  if (process.stdin.isTTY && process.platform !== 'win32') {
+    try {
+      const oscTheme = await detectTerminalTheme()
+      if (oscTheme) {
+        setOscDetectedTheme(oscTheme)
+      }
+    } catch {
+      // Silently ignore OSC detection failures
+    }
+  }
+
   const {
     initialPrompt,
     agent,
@@ -140,7 +150,7 @@ async function main(): Promise<void> {
     cwd,
   } = parseArgs()
 
-  await initializeApp({ cwd, isOscDetectionRun: isOscDetectionRun() })
+  await initializeApp({ cwd })
 
   // Handle publish command before rendering the app
   if (process.argv.includes('publish')) {

cli/src/init/init-app.ts

@@ -2,22 +2,13 @@ import { enableMapSet } from 'immer'
 
 import { initializeThemeStore } from '../hooks/use-theme'
 import { setProjectRoot } from '../project-files'
-import { runOscDetectionSubprocess } from './osc-subprocess'
 import { findGitRoot } from '../utils/git'
 import { initTimestampFormatter } from '../utils/helpers'
 import { enableManualThemeRefresh } from '../utils/theme-system'
 
 export async function initializeApp(params: {
   cwd?: string
-  isOscDetectionRun: boolean
 }): Promise<void> {
-  const { isOscDetectionRun } = params
-
-  if (isOscDetectionRun) {
-    await runOscDetectionSubprocess()
-    return
-  }
-
   const projectRoot =
     findGitRoot({ cwd: params.cwd ?? process.cwd() }) ?? process.cwd()
   setProjectRoot(projectRoot)

cli/src/init/osc-subprocess.ts

@@ -88,23 +88,33 @@ function buildOscQuery(oscCode: number): string {
 }
 
 /**
- * Query the terminal for OSC color information
- * Writes query to /dev/tty and reads response from stdin using event-based reading
- * Terminal responses come back through the PTY, which appears on stdin
+ * Query the terminal for OSC color information.
+ * 
+ * IMPORTANT: This function reads from stdin because OSC responses come through
+ * the PTY which appears on stdin. This means it MUST be run BEFORE any other
+ * stdin listeners (like OpenTUI) are attached. The subprocess approach via
+ * --internal-osc-detect flag ensures this.
+ * 
+ * @param ttyPath - Path to TTY for writing the query
+ * @param query - The OSC query string to send
  * @returns The raw response string or null if query failed
  */
 async function sendOscQuery(
   ttyPath: string,
   query: string,
 ): Promise<string | null> {
   return new Promise((resolve) => {
+    // Guard: Must have TTY for both reading and writing
+    if (!process.stdin.isTTY) {
+      resolve(null)
+      return
+    }
+
     let ttyWriteFd: number | null = null
     let timeoutId: NodeJS.Timeout | null = null
     let resolved = false
-    let wasRawMode = false
-    let wasFlowing = false
-    let didResume = false
     let response = ''
+    let wasRawMode = false
     let dataHandler: ((data: Buffer) => void) | null = null
 
     const cleanup = () => {
@@ -115,27 +125,30 @@ async function sendOscQuery(
         clearTimeout(timeoutId)
         timeoutId = null
       }
+
       // Remove data handler from stdin
       if (dataHandler) {
         process.stdin.removeListener('data', dataHandler)
         dataHandler = null
       }
-      // Restore raw mode state if we changed it
+
+      // Restore raw mode state
       if (process.stdin.isTTY && process.stdin.setRawMode) {
         try {
           process.stdin.setRawMode(wasRawMode)
         } catch {
           // Ignore errors restoring raw mode
         }
       }
-      // Only pause stdin if we were the ones who resumed it
-      if (didResume && !wasFlowing) {
-        try {
-          process.stdin.pause()
-        } catch {
-          // Ignore pause errors
-        }
+
+      // Pause stdin so the subprocess can exit cleanly
+      try {
+        process.stdin.pause()
+      } catch {
+        // Ignore pause errors
       }
+
+      // Close TTY write fd
       if (ttyWriteFd !== null) {
         try {
           closeSync(ttyWriteFd)
@@ -153,37 +166,33 @@ async function sendOscQuery(
     }
 
     try {
-      // Check if stdin is a TTY - required for reading responses
-      if (!process.stdin.isTTY) {
-        resolveWith(null)
-        return
-      }
-
       // Open TTY for writing the query
-      const O_WRONLY = constants.O_WRONLY
       try {
-        ttyWriteFd = openSync(ttyPath, O_WRONLY)
+        ttyWriteFd = openSync(ttyPath, constants.O_WRONLY)
       } catch {
         resolveWith(null)
         return
       }
 
-      // Save current raw mode state and enable raw mode to capture escape sequences
-      try {
-        wasRawMode = process.stdin.isRaw ?? false
-        if (!wasRawMode && process.stdin.setRawMode) {
+      // Save current raw mode state and enable raw mode to capture escape sequences.
+      // Without raw mode, the terminal buffers input line-by-line and OSC responses
+      // (which don't end with newlines) would never be delivered.
+      wasRawMode = process.stdin.isRaw ?? false
+      if (process.stdin.setRawMode) {
+        try {
           process.stdin.setRawMode(true)
+        } catch {
+          // Continue anyway - some terminals might work without raw mode
         }
-      } catch {
-        // Continue anyway - some terminals might work without raw mode
       }
 
-      // Set overall timeout
+      // Set up timeout
       timeoutId = setTimeout(() => {
         resolveWith(response.length > 0 ? response : null)
       }, OSC_QUERY_TIMEOUT_MS)
 
-      // Set up event-based reading from stdin
+      // Set up event-based reading from stdin.
+      // OSC responses come through the PTY which appears on stdin.
       dataHandler = (data: Buffer) => {
         if (resolved) return
 
@@ -200,18 +209,13 @@ async function sendOscQuery(
 
         // A complete response has RGB data AND a terminator (BEL or ST)
         // Some terminals might send RGB without proper terminator, so we accept that too
-        if (hasRGB && (hasBEL || hasST || response.length > 20)) {
+        if (hasRGB && (hasBEL || hasST || response.length > 30)) {
           resolveWith(response)
         }
       }
 
-      // Track if stdin was already flowing before we resume
-      // readableFlowing is true if flowing, false if paused, null if not yet consumed
-      wasFlowing = process.stdin.readableFlowing === true
-
       process.stdin.on('data', dataHandler)
       process.stdin.resume()
-      didResume = true
 
       // Write the OSC query to TTY
       try {

cli/src/utils/terminal-color-detection.ts

@@ -3,8 +3,6 @@ import { homedir } from 'os'
 import { dirname, join } from 'path'
 
 import { logger } from './logger'
-import { detectTerminalTheme } from './terminal-color-detection'
-import { withTerminalInputGuard } from './terminal-input-guard'
 
 import type { MarkdownPalette } from './markdown-renderer'
 import type {
@@ -985,6 +983,9 @@ let pendingRecomputeTimer: NodeJS.Timeout | null = null
 let themeResolver: (() => ThemeName) | null = null
 
 export const getOscDetectedTheme = (): ThemeName | null => oscDetectedTheme
+export const setOscDetectedTheme = (theme: ThemeName | null): void => {
+  oscDetectedTheme = theme
+}
 export const setThemeResolver = (resolver: () => ThemeName) => {
   themeResolver = resolver
 }
@@ -1115,64 +1116,11 @@ export function enableManualThemeRefresh() {
 
 /**
  * OSC Terminal Theme Detection
- * Query terminal colors once at startup using OSC 10/11
- */
-
-const OSC_DETECTION_TIMEOUT_MS = 3000 // Global timeout for OSC detection
-
-/**
- * Initialize OSC theme detection with a one-time check
- * Runs in a separate process to avoid blocking and hiding I/O from user
- */
-export function initializeOSCDetection(): void {
-  const ideTheme = detectIDETheme()
-  if (ideTheme) {
-    return
-  }
-  void detectOSCInBackground()
-}
-
-/**
- * Run OSC detection with terminal input guard and global timeout
- * This prevents blocking the main thread and hides terminal I/O from the user
+ * 
+ * OSC detection is now run synchronously at app startup in index.tsx,
+ * BEFORE OpenTUI is initialized. This avoids stdin conflicts since
+ * OpenTUI hasn't attached its listeners yet.
+ * 
+ * The detected theme is stored via setOscDetectedTheme() and retrieved
+ * via getOscDetectedTheme() when building the theme.
  */
-async function detectOSCInBackground(): Promise<void> {
-  // Skip on Windows where OSC queries can hang PowerShell
-  if (process.platform === 'win32') {
-    return
-  }
-
-  // Create a timeout promise that will resolve to undefined
-  let timeoutId: NodeJS.Timeout | null = null
-  const timeoutPromise = new Promise<void>((resolve) => {
-    timeoutId = setTimeout(() => {
-      resolve()
-    }, OSC_DETECTION_TIMEOUT_MS)
-  })
-
-  // Create the actual detection promise
-  const detectionPromise = (async () => {
-    try {
-      await withTerminalInputGuard(async () => {
-        const theme = await detectTerminalTheme()
-        if (theme) {
-          oscDetectedTheme = theme
-          recomputeSystemTheme()
-        }
-      })
-    } catch (error) {
-      logger.warn(
-        { error: error instanceof Error ? error.message : String(error) },
-        'OSC detection failed',
-      )
-    }
-  })()
-
-  // Race between detection and timeout
-  await Promise.race([detectionPromise, timeoutPromise])
-
-  // Clean up timeout
-  if (timeoutId) {
-    clearTimeout(timeoutId)
-  }
-}