TextFiled lost focus and no key input on Japanese input Romaji mode

I write macOS menu app with TextField by SwiftUI on Japanese Input mode. On some conditions, the TextFiled lost focus, no key input, no mouse click. User cannot do anything.

Setup

  • MacOS Ventura 13.3.1 (a)
  • Install Japanese Romaji Input source by System Preferences -> Keyboard
  • Set input mode as "Romaji"

Build test source code

  • On Xcode 14.3, create new macOS app project "FocusTest" with SwiftUI, Swift.
  • Replace FocusTestApp.swift with attached code.
  • Build on Xcode

Steps

  1. Set input mode as "Romaji"
  2. Run FocusTestApp
  3. Click T square icon on top menu
  4. Small windows with globe appear
  5. Click Desktop background area
  6. Click T square icon on top menu
  7. Click PIN
  8. T with PIN textField View appear
  9. That textField lost focus, click inside of textField
  10. Key or click is not accepted.

With US keyboard mode, key input become possible on Step 10. But Focused blue square is missing.

Code of FocusTestApp.swift

import SwiftUI

@main
struct focusTestApp: App {
    var body: some Scene {
        MenuBarExtra("Test", systemImage: "t.square") {
            MainView()
        }.menuBarExtraStyle(.window)
    }
}

struct MainView: View {
    @State private var showingPIN: Bool = false
    var body: some View {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundColor(.accentColor)
            Button("PIN") {
                print("clicked")
                showingPIN = true
            }
        }
        .padding()
        .sheet(isPresented: $showingPIN) {
            PinView()
        }
    }
}

struct PinView: View {
    @Environment(\.presentationMode) var presentationMode
    @State private var pin: String = ""
    @FocusState private var pinIsFocused: Bool

    var body: some View {
        VStack {
            Image(systemName: "t.square")
                .resizable()
                .aspectRatio(contentMode: .fit)
                .frame(width: 64.0, height: 64.0)
                .foregroundColor(.accentColor)
            Text("Enter PIN code")
            HStack {
                TextField("", text: $pin)
                    .font(Font.system(size: 28, design: .default))
                    .frame(width:4*28.0, height:28.0)
                    .focusable()
                    .focused($pinIsFocused)
            }
            .onAppear(){
                pinIsFocused = true
            }
        }
        .padding()
    }
}
Post not yet marked as solved Up vote post of Himadeus Down vote post of Himadeus
948 views