Ruby on RailsとBootstrapで作ったページにあるタブの切り替えができない

Rails初心者です。
Ruby on RailsでBootstrapで作ったタブの切り替えができません。

まず、下記のサイトを参考にBootstrapでタブを使ったページをHtmlで作りました。
https://ics.media/entry/190826/

実際にHtml上で動いたのでHamlに変換し、Railsで表示したのですが、何故かタブの切り替えができません。

Hamlのテストコードはこのようになっています。

haml
1%body
2  .container
3    .row
4      .col-3
5      .col-6
6        %ul.nav.nav-tabs
7          %li.nav-item
8            %a.nav-link.active{"data-toggle" => "tab", :href => "#photo1"} テスト１
9          %li.nav-item
10            %a.nav-link{"data-toggle" => "tab", :href => "#photo2"}  テスト２
11          %li.nav-item
12            %a.nav-link{"data-toggle" => "tab", :href => "#photo3"}  テスト３
13        .tab-content
14          #photo1.tab-pane.active
15            テスト１の文章
16          #photo2.tab-pane
17            テスト２の文章
18          #photo3.tab-pane
19            テスト３の文章
20        .col-3

Rails上で生成されたHTMLをhtmlファイルにコピーしたところ、正常に動きました。

まず、jQueryが正常に動いていないんじゃないかを疑ったのですが、調べてみたところ、正常に動いているようです。

更に、タブのボタンを押す度にURLフラグメントがつきます。例えば「%li.nav-item　%a.nav-link.active{"data-toggle" => "tab", :href => "#photo1"} テスト１」というタブを押すとURLが「http://localhost:3000/users/show/test」から「http://localhost:3000/users/show/test#photo1」というURLに変わります。
HTMLの場合はURLフラグメントがつかず、URLが変わりません。一体どういうことなのでしょうか？

あちこちネットで調べてみたのですが、このような現象は他に起きていないようで分かりませんでした。

railsのバージョンは6.0.3.2です。よろしくお願いします。