ページ移動時のエラー[Uncaught TypeError: Cannot read property 'classList' of null]解決

はじめに

タイトルについて記事にしました。
この記事で得る内容は以下の通りです。

・ HTML,JavaScriptの基礎知識が増える
・ turbolinksについて
・ エラーMSG[Uncaught TypeError: Cannot read property 'classList' of null]の解決方法

■ 参考
・ 5分でわかるTurbolinks入門【Ruby on Rails】
・ turbolinksチートシート

例

サイトの中にトップに戻るボタンがあり、リンク先に移動すると、指定したclassListがないと怒られています
トップに戻るボタンのJSファイルをjavascript_pack_tagでリンク元だけ指定しているのですが・・・

コンソール

原因

大元のapplication.html.hamlにあるdata-turbolinks-trackを疑ってみました

・ data-turbolinks-track

・ Rails4.0から採用されたgemで最初からインストールされている
・ Webアプリケーションの動作を速くする
・ a hrefタグでのページ遷移時、JSや他の要素を読み込まずにbody要素だけ入れ替える
→ つまり、リンク元のJSをそのまま持ってきて、エラーを引き起こしている

解決方法

該当のa hrefタグのみturbolinksを無効にします（直接指定するか、親要素に指定してもOK）

index.html.haml

%a(data-turbolinks="false"){href: hoge_index_path}

便利なんだか、不便なんだか・・・公式採用するくらいならメリット100%のやつ作れよ('A`)ボソッ