stimulus connect() is being called out of order on reload with data-turbo-permanent

[krschacht]

I have data-turbo-permanent on a text field within a form. When the page updates, the permanent element remains and the stimulus controller disconnects and connects. I know this is the expected behavior and normally it works fine.

However, here is the issue:

When my connect() method first runs, it finds the text field by referencing this.inputTarget. But when the page morphs and the stimulus controller disconnects and calls connect() the second time, the this.inputTarget fails with:

Error: Missing target element "input" for "search" controller

I fixed the error by changing from connect() to inputTargetConnected(). But this should not fix the issue according to the stimulus docs. The connect() method is supposed to fire after the individual target connect methods.

The [name]TargetConnected() lifecycle callbacks will fire before the controller’s connect() callback.
from: https://stimulus.hotwired.dev/reference/lifecycle-callbacks