Upgrade Turbolinks to version 5.2.1

We didn't upgrade Turbolinks when we upgraded to Rails 5 so we didn't
upgrade too many things at the same time, and postponed it... until now
:).

Note upgrading Turbolinks fixes an issue with foundation's sticky when
using the browser's back and forward buttons. We're adding tests for
these scenarios.

Co-authored-by: Senén Rodero Rodríguez <senenrodero@gmail.com>

Gemfile

@@ -53,7 +53,7 @@ gem "sitemap_generator", "~> 6.0.2"
 gem "social-share-button", "~> 1.1"
 gem "sprockets", "~> 3.7.2"
 gem "translator-text", "~> 0.1.0"
-gem "turbolinks", "~> 2.5.3"
+gem "turbolinks", "~> 5.2.1"
 gem "turnout", "~> 2.4.0"
 gem "uglifier", "~> 4.1.2"
 gem "whenever", "~> 0.10.0", require: false

Gemfile.lock

@@ -563,8 +563,9 @@ GEM
     translator-text (0.1.0)
       dry-struct (~> 0.5.0)
       httparty (~> 0.15)
-    turbolinks (2.5.4)
+    turbolinks (5.2.1)
-      coffee-rails
+      turbolinks-source (~> 5.2)
+    turbolinks-source (5.2.0)
     turnout (2.4.1)
       i18n (~> 0.7)
       rack (>= 1.3, < 3)
@@ -690,7 +691,7 @@ DEPENDENCIES
   spring-commands-rspec (~> 1.0.4)
   sprockets (~> 3.7.2)
   translator-text (~> 0.1.0)
-  turbolinks (~> 2.5.3)
+  turbolinks (~> 5.2.1)
   turnout (~> 2.4.0)
   uglifier (~> 4.1.2)
   web-console (~> 3.3.0)

app/assets/javascripts/application.js

@@ -166,10 +166,4 @@ var initialize_modules = function() {
   App.BudgetEditAssociations.initialize();
 };
 
-$(function() {
+$(document).on("turbolinks:load", initialize_modules);
-  "use strict";
-
-  Turbolinks.enableProgressBar();
-});
-$(document).ready(initialize_modules);
-$(document).on("page:load", initialize_modules);

app/assets/javascripts/html_editor.js

@@ -17,6 +17,5 @@
     }
   };
 
-  $(document).on("page:before-unload", App.HTMLEditor.destroy);
+  $(document).on("turbolinks:before-cache", App.HTMLEditor.destroy);
-  $(document).on("page:restore", App.HTMLEditor.initialize);
 }).call(this);

app/assets/javascripts/stat_graphs.js

@@ -9,6 +9,5 @@ var initialize_stats_modules = function() {
   App.Stats.initialize();
 };
 
-$(document).ready(initialize_stats_modules);
+$(document).on("turbolinks:load", initialize_stats_modules);
-$(document).on("page:load", initialize_stats_modules);
 $(document).on("ajax:complete", initialize_stats_modules);

app/assets/javascripts/watch_form_changes.js

@@ -23,7 +23,7 @@
       if (App.WatchFormChanges.forms().length === 0 || App.WatchFormChanges.msg() === undefined) {
         return;
       }
-      $(document).off("page:before-change").on("page:before-change", App.WatchFormChanges.checkChanges);
+      $(document).off("turbolinks:before-visit").on("turbolinks:before-visit", App.WatchFormChanges.checkChanges);
       App.WatchFormChanges.forms().each(function() {
         $(this).data("watchChanges", $(this).serialize());
       });

app/views/admin/budget_investments/show.html.erb

@@ -1,5 +1,5 @@
 <%= link_to admin_budget_budget_investments_path(Budget::Investment.filter_params(params).to_h),
-            class: "back", data: { no_turbolink: true } do %>
+            class: "back", data: { turbolinks: false } do %>
   <span class="icon-angle-left"></span><%= t("shared.back") %>
 <% end %>
 

app/views/admin/stats/budget_supporting.html.erb

@@ -1,5 +1,5 @@
 <% content_for :head do %>
-  <%= javascript_include_tag "stat_graphs", "data-turbolinks-track" => true %>
+  <%= javascript_include_tag "stat_graphs", "data-turbolinks-track" => "reload" %>
 <% end %>
 
 <%= back_link_to budgets_admin_stats_path %>

app/views/admin/stats/graph.html.erb

@@ -1,5 +1,5 @@
 <% content_for :head do %>
-  <%= javascript_include_tag "stat_graphs", "data-turbolinks-track" => true %>
+  <%= javascript_include_tag "stat_graphs", "data-turbolinks-track" => "reload" %>
 <% end %>
 
 <%= render "graph", name: @name, event: @event, count: @count %>

app/views/budgets/groups/show.html.erb

@@ -36,7 +36,7 @@
               <%= link_to heading.name,
                           budget_investments_path(heading_id: heading.id,
                                                   filter: @current_filter),
-                          data: { no_turbolink: true } %><br>
+                          data: { turbolinks: false } %><br>
             </span>
           <% end %>
         </div>

app/views/budgets/show.html.erb

@@ -64,7 +64,7 @@
                             budget_investments_path(@budget,
                               heading_id: group.headings.first.id,
                               filter: @current_filter),
-                            data: { no_turbolink: true } %>
+                            data: { turbolinks: false } %>
               <% else %>
                 <%= link_to group.name,
                             budget_group_path(@budget, group,

app/views/dashboard/progress.html.erb

@@ -29,7 +29,7 @@
          class="c3 proposal-graph"></div>
   </div>
 
-  <%= javascript_include_tag "dashboard_graphs", "data-turbolinks-track" => true %>
+  <%= javascript_include_tag "dashboard_graphs", "data-turbolinks-track" => "reload" %>
 <% end %>
 
 <%= render "next_goal" %>

app/views/layouts/_common_head.html.erb

@@ -3,7 +3,7 @@
 <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 <title><%= content_for?(:title) ? yield(:title) : default_title %></title>
 <%= stylesheet_link_tag "application" %>
-<%= javascript_include_tag "application", "data-turbolinks-track" => true %>
+<%= javascript_include_tag "application", "data-turbolinks-track" => "reload" %>
 <%= csrf_meta_tags %>
 <%= favicon_link_tag "favicon.ico" %>
 <%= render "layouts/disable_animations_in_tests" if Rails.env.test? %>

app/views/layouts/dashboard.html.erb

@@ -9,7 +9,7 @@
     <title><%= content_for?(:title) ? yield(:title) : setting["org_name"] %></title>
     <%= content_for :canonical %>
     <%= stylesheet_link_tag "application" %>
-    <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
+    <%= javascript_include_tag "application", "data-turbolinks-track" => "reload" %>
     <%= csrf_meta_tags %>
     <%= favicon_link_tag "favicon.ico" %>
     <%= favicon_link_tag image_path_for("apple-touch-icon-200.png"),

app/views/layouts/proposals_dashboard.html.erb

@@ -9,7 +9,7 @@
     <title><%= content_for?(:title) ? yield(:title) : setting["org_name"] %></title>
     <%= content_for :canonical %>
     <%= stylesheet_link_tag "application" %>
-    <%= javascript_include_tag "application", "data-turbolinks-track" => true %>
+    <%= javascript_include_tag "application", "data-turbolinks-track" => "reload" %>
     <%= csrf_meta_tags %>
     <%= favicon_link_tag "favicon.ico" %>
     <%= favicon_link_tag image_path_for("apple-touch-icon-200.png"),

spec/system/proposals_spec.rb

@@ -233,6 +233,42 @@ describe "Proposals" do
         expect(page).not_to have_css(".is-anchored")
       end
     end
+
+    scenario "After using the browser's back button" do
+      proposal = create(:proposal)
+
+      visit proposal_path(proposal)
+      click_link "Go back"
+
+      expect(page).to have_link proposal.title
+
+      go_back
+
+      within("#proposal_sticky") do
+        expect(page).to have_css(".is-stuck")
+        expect(page).not_to have_css(".is-anchored")
+      end
+    end
+
+    scenario "After using the browser's forward button" do
+      proposal = create(:proposal)
+
+      visit proposals_path
+      click_link proposal.title
+
+      expect(page).not_to have_link proposal.title
+
+      go_back
+
+      expect(page).to have_link proposal.title
+
+      go_forward
+
+      within("#proposal_sticky") do
+        expect(page).to have_css(".is-stuck")
+        expect(page).not_to have_css(".is-anchored")
+      end
+    end
   end
 
   context "Embedded video" do