Enable morphing for turbo drive

app/helpers/application_helper.rb

@@ -426,7 +426,7 @@ def locale_first_week_of_year
   # To avoid the menu flickering, disable it
   # by default unless we're in test mode
   def initial_menu_styles(side_displayed)
-    Rails.env.test? || !side_displayed ? "" : "display:none"
+    Rails.env.test? || request.headers["Accept"].include?("text/vnd.turbo-stream.html") || !side_displayed ? "" : "display:none"
   end
 
   def initial_menu_classes(side_displayed, show_decoration)

app/views/custom_fields/edit.html.erb

@@ -45,6 +45,6 @@ See COPYRIGHT and LICENSE files for more details.
                                 url: custom_field_path(@custom_field),
                                 html: { method: :put, id: 'custom_field_form' } do |f| %>
     <%= render partial: 'form', locals: { f: f } %>
-    <%= styled_button_tag t(:button_save), class: '-primary -with-icon icon-checkmark' %>
+    <%= styled_button_tag t(:button_save), class: '-primary -with-icon icon-checkmark', data: { turbo: false } %>
   <% end %>
 <% end %>

app/views/enterprises/_form.html.erb

@@ -19,7 +19,7 @@
                     spellcheck: false %>
 
     <div class="form--space"></div>
-    <%= styled_button_tag t(:button_save), id: 'token-submit-button', class: '-primary -with-icon icon-checkmark' %>
+    <%= styled_button_tag t(:button_save), id: 'token-submit-button', class: '-primary -with-icon icon-checkmark', data: { turbo: false } %>
     <%= link_to t(:button_cancel), { action: :show }, class: 'button -with-icon icon-cancel' %>
   <% end %>
 <% end %>

app/views/groups/_memberships.html.erb

@@ -146,7 +146,7 @@ See COPYRIGHT and LICENSE files for more details.
               <%= labeled_check_box_tags 'membership[role_ids][]', roles %>
             </div>
           </div>
-          <div><%= styled_button_tag t(:button_add), class: '-primary -with-icon icon-checkmark' %></div>
+          <div><%= styled_button_tag t(:button_add), class: '-primary -with-icon icon-checkmark', data: { turbo: false } %></div>
         </fieldset>
       <% end %>
     <% end %>

app/views/individual_principals/_memberships.html.erb

@@ -164,7 +164,7 @@ See COPYRIGHT and LICENSE files for more details.
               <%= labeled_check_box_tags 'membership[role_ids][]', roles %>
             </div>
           </div>
-          <div><%= styled_button_tag t(:button_add), class: '-primary -with-icon icon-checkmark' %></div>
+          <div><%= styled_button_tag t(:button_add), class: '-primary -with-icon icon-checkmark', data: { turbo: false } %></div>
         </fieldset>
       <% end %>
     <% end %>

app/views/layouts/base.html.erb

@@ -40,6 +40,8 @@ See COPYRIGHT and LICENSE files for more details.
   <meta name="current_menu_item" content="<%= current_menu_item %>"/>
   <%# Disable prefetching for now %>
   <meta name="turbo-prefetch" content="false">
+  <meta name="turbo-refresh-method" content="morph">
+  <meta name="turbo-refresh-scroll" content="preserve">
 </head>
 <%= content_tag :body,
                 class: "#{body_css_classes}  __overflowing_element_container __overflowing_body",
@@ -57,15 +59,16 @@ See COPYRIGHT and LICENSE files for more details.
     </p>
   </div>
 </noscript>
-<opce-toasts-container></opce-toasts-container>
-<opce-modal-overlay></opce-modal-overlay>
-<opce-spot-drop-modal-portal></opce-spot-drop-modal-portal>
+<opce-toasts-container data-turbo-permanent></opce-toasts-container>
+<opce-modal-overlay data-turbo-permanent></opce-modal-overlay>
+<opce-spot-drop-modal-portal data-turbo-permanent></opce-spot-drop-modal-portal>
 <% main_menu = render_main_menu(local_assigns.fetch(:menu_name, nil), @project) %>
 <% side_displayed = content_for?(:sidebar) || content_for?(:main_menu) || !main_menu.blank? %>
 <% initial_classes = initial_menu_classes(side_displayed, show_decoration) %>
 <div id="wrapper" style="<%= initial_menu_styles(side_displayed) %>" class="<%= initial_classes %>">
   <% if show_decoration %>
-    <header class="op-app-header<%= ' op-app-header_development' if OpenProject::Configuration.development_highlight_enabled? %>">
+    <header class="op-app-header<%= ' op-app-header_development' if OpenProject::Configuration.development_highlight_enabled? %>"
+    data-turbo-permanent>
       <div class="op-app-header--start">
         <h1 class="hidden-for-sighted">
           <%= t(:label_top_menu) %>
@@ -94,10 +97,9 @@ See COPYRIGHT and LICENSE files for more details.
         id="main-menu"
         class="main-menu"
         data-controller="menus--main"
-        data-application-target="dynamic"
-      >
+        data-application-target="dynamic">
         <h1 class="hidden-for-sighted"><%= t(:label_main_menu) %></h1>
-        <opce-main-menu-resizer></opce-main-menu-resizer>
+        <opce-main-menu-resizer data-turbo-permanent></opce-main-menu-resizer>
         <div id="menu-sidebar">
           <%= main_menu %>
           <%= content_for :main_menu %>

app/views/roles/edit.html.erb

@@ -43,5 +43,5 @@ See COPYRIGHT and LICENSE files for more details.
   <%= hidden_field_tag :id, @role.id %>
   <%= render partial: 'form', locals: { f: f , role: @role } %>
   <br/>
-  <%= styled_button_tag t(:button_save), class: '-with-icon icon-checkmark' %>
+  <%= styled_button_tag t(:button_save), class: '-with-icon icon-checkmark', data: { turbo: false } %>
 <% end %>

app/views/roles/new.html.erb

@@ -42,5 +42,5 @@ See COPYRIGHT and LICENSE files for more details.
 <%= labelled_tabular_form_for @role, :url => { :action => 'create' }, :html => {:id => 'role_form'}, :as => :role do |f| %>
 <%= render partial: 'form', locals: { f: f, role: @role, roles: @roles } %>
 <br/>
-<%= styled_button_tag t(:button_create), class: '-with-icon icon-checkmark' %>
+<%= styled_button_tag t(:button_create), class: '-with-icon icon-checkmark', data: { turbo: false } %>
 <% end %>

frontend/src/turbo/turbo-global-listeners.ts

@@ -64,4 +64,13 @@ export function addTurboGlobalListeners() {
     activateFlashNotice();
     activateFlashError();
   });
+
+  document.addEventListener('turbo:before-morph-element', (event) => {
+    const element = event.target as HTMLElement;
+
+    // In case the element is an OpenProject custom dom element, morphing is prevented.
+    if (element.tagName.startsWith('OPCE-')) {
+      event.preventDefault();
+    }
+  });
 }

modules/meeting/app/views/meeting_contents/_form.html.erb

@@ -49,7 +49,8 @@ See COPYRIGHT and LICENSE files for more details.
   <p><%= f.text_field :journal_notes, label: :comments %></p>
   <%= styled_button_tag t(:button_save),
                         class: '-primary -with-icon icon-checkmark button--save-agenda',
-                        data: { disable_with: I18n.t(:label_loading) } %>
+                        data: { disable_with: I18n.t(:label_loading),
+                                turbo: false } %>
   <%= link_to t(:button_cancel),
               "#",
               data: {

spec/features/custom_fields/custom_fields_spec.rb

@@ -205,16 +205,11 @@ def expect_page_not_to_have_texts(*text)
     end
 
     before do
-      cf_page.visit!
-      wait_for_reload
-
-      click_on custom_field.name
-      wait_for_reload
+      visit edit_custom_field_path(custom_field)
     end
 
     it "adds new options" do
       page.find_test_selector("add-custom-option").click
-      wait_for_reload
 
       expect(page).to have_css(".custom-option-row", count: 5)
       within all(".custom-option-row").last do

spec/features/principals/shared_memberships_examples.rb

@@ -17,6 +17,8 @@
 
     principal_page.add_to_project! project.name, as: "Manager"
 
+    principal_page.expect_and_dismiss_flash message: "Successful creation."
+
     member = principal.memberships.where(project_id: project.id).first
     principal_page.edit_roles!(member, %w(Manager Developer))