turbolinksが邪魔をする

47日目です。

Turbolinksとは

Turbolinksはあなたのwebアプリケーションの閲覧を高速化します。

リンクでのページ遷移の際に、非同期でhtmlリクエストを送り、headタグでのcss/js/imgの再読込を省略することで、画面遷移を高速化する ブラウザの進む・戻るによる画面遷移では、キャッシュを利用し復元することで、htmlのリクエストを行わない

とある通り、WEBアプリケーションのページ移動を高速化するGemのこと。

（未完成）Turbolinks 5 のREADME.mdを日本語訳してみる - Qiita

【Rails】【Turbolinks】ページを移動した時にJavascriptが起動しない | エビのテックブログ

なぜ調べたか

現在インクリメンタルサーチを実装しているチャットアプリで、チャット画面からグループ編集画面に遷移した時に、一回リロードしないと追加や削除ができないといった状況に陥ったことにより色々調べました。

解決したかったこと

リロードしないと削除ボタンが反応せず、追加ボタンが表示されない

自力で調べた内容

「JS リロードしないと削除されない」で検索

【turbolinks】WebページのJavaScriptがリロードしないと動いてくれない問題 - Qiita

→turbolinksが悪さをしているらしい

「turbolinks 悪さ」で検索

Ruby on Rails - railsアプリでページ遷移時にjqueryが動かない｜teratail

「turbolinks」のGithubのREADMEを確認

jquery.turbolinks/README.md at master · kossnocorp/jquery.turbolinks · GitHub

→turbolinksのREADMEには下記の順番で記載しろとかかれてある

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//
// ... your other scripts here ...
//
//= require turbolinks

仮説と検証作業の結果

application.jsの記載を下記に変更

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require_tree .
//= require turbolinks

→アプリをリロードする

エラー：「//= require jquery.turbolinks」がないと怒られる
couldn't find file 'jquery.turbolinks' with type 'application/javascript'
Checked in these paths:

→他の検索候補を見ていたら卒業生のブログ発見

『Turbolinks』って、なんぞ？ - 毎日投稿する技術ブログ（WEB系）

Turbolinksは部分的に適用しないか、全て適用しないかの方法がある。
→全て適用しない方法を実践
app/assets/javascripts/application.js から「//= require jquery.turbolinks」と「//= require turbolinks」を削除する。

→リロードしなくても追加・削除ができるようになった

---

本日はインクリメンタルサーチ実装が終わり、自動更新の実装に取り組みました。
これが終わればデプロイに進めるので引き続き頑張ります。