iOS 17 beta, searchable suggested tokens disappear when query is not empty

Question

Created Aug ’23

Replies 1

Boosts 1

Participants 2

In iOS 16, suggested tokens remain visible when the query updates. I use this guide the user on what to type for more advanced queries. (e.g. if they type backslash, I give them a list of supported commands to use that will be tokenized "hasImage: true" for example).

In iOS 17, the suggested tokens disappear when the query is not empty. Does anyone know of a workaround? I've reported to Apple and hoping others are having this problem, so we can get it fixed before the betas are done.

It does not appear that the value of the suggested tokens state is changing, just that they are no longer visible.

Here's a minimum example, if you run on iOS 16 it runs as expected, on iOS17 it breaks

struct ContentView: View {
  // MARK: Internal
  struct Token: Identifiable, Equatable {

    let text: String

    var id: String {
      text
    }
  }

  var body: some View {
    NavigationStack {
      List {
        VStack {
          Image(systemName: "globe")
            .imageScale(.large)
            .foregroundColor(.accentColor)
          Text("Hello, world!")
        }
        VStack {
          Image(systemName: "globe")
            .imageScale(.large)
            .foregroundColor(.accentColor)
          Text("Hello, world!")
        }
      }
      .navigationTitle("Search Suggestions")
      .searchable(text: $query,
                  tokens: $tokens,
                  suggestedTokens: $suggestions,
                  placement: .toolbar, prompt: "Search") { token in
        Text(token.text)
      }
    }
  }

  // MARK: Private
  @State private var query: String = ""
  @State private var suggestions: [Token] = [Token(text: "One"), Token(text: "Two")]
  @State private var tokens: [Token] = []
}

Boost

Answer 1

BabyJ OP

Aug ’23

From the iOS & iPadOS 17 Beta Release Notes:

SwiftUI

Resolved Issues

Fixed: Suggested search tokens will be hidden by default when the search text is not empty (108381393)

It seems like this behaviour is the default: only show the suggested tokens before the user starts typing.

If you want an alternative solution (not really a workaround as you can't change the default behaviour), you can show your own custom suggested tokens as buttons, and when pressed are added to the tokens array. Here's an example of what it could look like:

struct ContentView: View {
    @State private var query = ""
    @State private var tokens: [Token] = []
    @State private var isSearching = false

    private let suggestions = [Token(text: "One"), Token(text: "Two")]
    
    var body: some View {
        NavigationStack {
            List {
                ...
            }
            .overlay {
                if isSearching { // put here whatever condition you need to show the suggested tokens
                    List(suggestions) { suggestion in
                        Button(suggestion.text) {
                            tokens.append(suggestion)
                        }
                    }
                }
            }
            .navigationTitle("Search Suggestions")
            .searchable(text: $query, tokens: $tokens, isPresented: $isSearching, placement: .toolbar, prompt: "Search") { token in
                Text(token.text)
            }
        }
    }
}

1