Why is my UISearchBar's width 0 after becoming first responder?

Question

I have a UISearchBar in my UIStackView with a button, making a sort of nav bar. Here is what it normally looks like: but when it becomes first responder the UISearchBar's width goes to 0, and it looks like this:

Now the only constraint I have is the width of the UIButton on the right is 44pt and the whole stack view is pinned to the top and sides of the screen. Here's what the console printed out:

I'm not very fluent in NSLayoutConstraint but clearly something is conflicting with the 44pt width constraint on the button. Why is the UISearchbar's width becoming 0?

Here is my code:

override func didTransition(to presentationStyle: MSMessagesAppPresentationStyle) {
    if presentationStyle == .expanded {
        searchController.searchBar.becomeFirstResponder()
        searchController.searchBar.tintColor = UIColor.white
    }
}

func didDismissSearchController(_ searchController: UISearchController) {
    requestPresentationStyle(.compact)
}

override func viewDidLoad() {
    super.viewDidLoad()
    configureSearchController()
}

func configureSearchController() {
    searchController = UISearchController(searchResultsController: nil)
    searchController.dimsBackgroundDuringPresentation = false
    searchController.searchBar.placeholder = "Search here..."
    searchController.searchBar.sizeToFit()
    searchController.searchBar.isTranslucent = false
    searchController.searchBar.delegate = self
    searchController.delegate = self
    searchController.searchBar.barTintColor = addButton.backgroundColor
    stackView.insertArrangedSubview(searchController.searchBar, at: 0)
    //This removes the hairline
    let color = addButton.backgroundColor
    searchController.searchBar.layer.borderWidth = 1
    searchController.searchBar.layer.borderColor = color?.cgColor

}

func searchBarShouldBeginEditing(_ searchBar: UISearchBar) -> Bool {
    if presentationStyle == .expanded {
        return true
    } else {
        requestPresentationStyle(.expanded)
        return false
    }
}

My storyboard as requested:

Answer 1

I'm not very fluent in NSLayoutConstraint but clearly something is conflicting with the 44pt width constraint on the button. Why is the UISearchbar's width becoming 0?

There's clearly a constraint in your ouput for the leading edge of the button--yet you say you only constrained the button's width. The output says that you constrained the leading edge of the button to the leading edge of the stack view.

You can certainly constrain the leading edge of the button to the leading edge of the stack view and make the button 44 wide--if the button is on the left of the search bar. But, because the button is on the right of the search bar, the button can either be 44 wide or it can be constrained to the leading edge of the stack view--but not both.

So, iOS breaks the 44 width constraint, and extends the button all the way to the left so that it lines up with the leading edge of the stack view.

That did not have to be the result. I imagine Apple could have programmed Xcode to ignore the spot where you dragged the button and just obey the constraints, ie move the button so that its leading edge and the stack view's leading edge line up and and give the button a width of 44, thus moving the search bar to the right of the button. But, obviously Apple gave a stronger priority to the ordering of the items in a horizontal stack view, ie because you placed the button to the right of the search bar, that is where it remained.