Rails 7 new app with --css bootstrap - turbo buttons won't work

Question

When creating new app Rails 7 with rails new myapp --css bootstrap my turbo button won't work:

= button_to "Sign out", edit_post_path, method: :delete, form: { data: { turbo_confirm: "Are you sure?" } }

"are you sure?" wont popup when clicking on button, so how to fix it?

pop-up should work on turbo

Answer 1

it's bug, found ticket on github. bootstrap installation is broken in new rails.

Use with --javascript=esbuild or if you want to use importmaps than only manual setup is option

Answer 2

You can use:

= button_to "Sign out", edit_post_path, method: :delete,
            data: { turbo_confirm: "Are you sure?" }

I'm not sure about the edit_post_path, for a post resource the delete path would usually be the post_path. What routes do you have setup?

Answer 3

It is solvable. Apparently no bug has been noticed. You have to manually install boostrap yourself.

cd vendor/javascript
npm init
npm install bootstrap @popperjs/core

Then you need to manually add the lines in the config/importmap.rb file

pin "bootstrap", to: "node_modules/bootstrap/dist/js/bootstrap.esm.js" # @5.3.2
pin "@popperjs/core", to: "node_modules/@popperjs/core/lib/index.js" # @2.11.8

Then you need to manually add the lines in the app/javascript/application.js file

import "@popperjs/core"
import "bootstrap"

Can find a lot of advice on how to do this with the ./bin/importmap command, but none of them helped me.