Turbo event is not being fired

Hi, so i have this controller


import { Controller } from "stimulus"

export default class extends Controller {
    initialize() {
        this.addTurboStreamHeaders = this.addTurboStreamHeaders.bind(this)
    }

    connect() {
        this.element.addEventListener(
            "turbo:before-fetch-request",
            this.addTurboStreamHeaders
        )
    }

    disconnect() {
        document.removeEventListener(
            "turbo:before-fetch-request",
            this.addTurboStreamHeaders
        )
    }

    addTurboStreamHeaders(event) {

        console.log("getting dem headers")
        const { headers } = event.detail.fetchOptions || {}

        console.log("getting dem headers")
        if (headers) {
            headers.Accept = ["text/vnd.turbo-stream.html", headers.Accept].join(", ")
        }
    }
}

this basically changes the format of GET request to turbo_streams. When i use it one a form, like so

  <%= button_to business_inbox_conversation_path(business_id: business, id: conversation, params: { filter: params[:filter] }), action: "turbo:before-fetch-request->accept-turbo-stream#addTurboStreamHeaders" }, data: { action: 'click->radio#check' } do %>

The event is not being fired, hence the format is sent as html, but i want it to be turbo_stream,

any ideas