fetchOptions body is null on form submit with stimulus.js : Uncaught TypeError: Cannot read properties of null (reading 'set')

Question

I'm trying to create a dynamic search with Ruby on Rails using Turbo and Stimulus controllers. I followed a great tutorial (typeahead-search-tutorial) and was able to get this working seamlessly as an independent (simple) app.

Now I'm attempting to integrate it into our larger application and I continue to get a console error. Other than the console error, the functionality seems to be working well.

Here's my code:

<form action="<%= search_legislators_path(turbo_frame: "search_results") %>" 
  data-turbo-frame="search_results" class="peer" id="legislator-search-form" 
  data-controller="form" 
  data-action="invalid->form#hideValidationMessage:capture input->form#submit">
    <input id="search_query" name="query" type="search" pattern=".*\w+.*" required 
      autocomplete="off" data-combobox-target="input" 
      data-action="focus->combobox#start focusout->combobox#stop"  
      class='form-control form-control-custom'>
    <button data-form-target="submit"></button>
</form>
<!--search results-->
<turbo-frame id="search_results" target="_top" class="empty:hidden peer-invalid:hidden">
  <!--empty to start this will be replaced when results are present-->
  <ul role="listbox" data-combobox-target="list">
  </ul>
</turbo-frame>

form_controller.js

import debounce from 'lodash.debounce'
import { Controller } from "@hotwired/stimulus"
import Rails from "@rails/ujs"

export default class extends Controller { 
    static get targets() { return [ "submit" ] }

    initialize() {
      this.submit = debounce(this.submit.bind(this), 200)
    }

    connect() {
      this.submitTarget.hidden = true
    }

    submit() {
      console.log(this.submitTarget)
      this.submitTarget.click()  
    }

    hideValidationMessage(event) {
      event.stopPropagation()
      event.preventDefault()
    }      
}

combobox_controller.js

import { Controller } from "@hotwired/stimulus"
import Combobox from '@github/combobox-nav' 

export default class extends Controller {
  static get targets() { return [ "input", "list" ] }

  disconnect() {
    this.combobox?.destroy()
  }

  listTargetConnected() {
    this.start()
  }

  start() {
    this.combobox?.destroy()
    
    this.combobox = new Combobox(this.inputTarget, this.listTarget)
    this.combobox.start()
  }

  stop() {
    this.combobox?.stop()
  }
}

search_legislators/index.html.erb

<turbo-frame id="<%= params.fetch(:turbo_frame, "search_results") %>">
  <ul role="listbox" data-combobox-target="list" 
      style="width:100%;position:absolute;background:white;list-style-type:none;max-height:150px;overflow-y:scroll;z-index:1;">
    <%if @leg_search_results%>
        <% @leg_search_results.each do |legislator| %>
        <li style="height:30px;text-align:left;">
            <%= link_to highlight(legislator.full_name, params[:query]), legislator_path(legislator),
                id: dom_id(legislator, :search_result), role: "option", class: "aria-selected:outline-black" %>
        </li>
        <% end %>
    <%end %>
  </ul>
</turbo-frame>

search_legislators_controller.rb

class SearchLegislatorsController < ApplicationController       
    # header function for legislator page to search by legislator
    def index
      @leg_search_results = Legislator.containing(params[:query])
    end
end

When I type into the search box, as I mentioned earlier, the results are displayed dynamically, however I get this error in the console:

I appreciate any insight the community has. This is for a basic search for state legislators by name. I didn't include the postgres code behind the search query b/c it seems irrelevant but please let me know if it would help.