[#61546] Fix DangerDialog scroll behaviour w/form + system test

Gemfile

@@ -51,7 +51,7 @@ group :development do
   gem "allocation_stats", "~> 0.1"
   gem "benchmark-ips", "~> 2.13.0"
   gem "capybara", "~> 3.40.0"
-  gem "cuprite", "~> 0.15"
+  gem "cuprite", "~> 0.15", github: "myabc/cuprite", branch: "feature/support-node-obscured"
   gem "debug"
   gem "erb_lint", "~> 0.6"
   gem "erblint-github", "~> 1.0"

Gemfile.lock

@@ -1,3 +1,12 @@
+GIT
+  remote: https://github.com/myabc/cuprite.git
+  revision: d29cde6c0f3b0eed4325a7be8ad9c146bff0ddb2
+  branch: feature/support-node-obscured
+  specs:
+    cuprite (0.15.1)
+      capybara (~> 3.0)
+      ferrum (~> 0.16.0)
+
 PATH
   remote: .
   specs:
@@ -38,8 +47,8 @@ GEM
       minitest (>= 5.1)
       mutex_m
       tzinfo (~> 2.0)
-    addressable (2.8.6)
-      public_suffix (>= 2.0.2, < 6.0)
+    addressable (2.8.7)
+      public_suffix (>= 2.0.2, < 7.0)
     allocation_stats (0.1.5)
     ansi (1.5.0)
     ast (2.4.2)
@@ -66,7 +75,7 @@ GEM
       regexp_parser (>= 1.5, < 3.0)
       xpath (~> 3.2)
     coderay (1.1.3)
-    concurrent-ruby (1.3.4)
+    concurrent-ruby (1.3.5)
     connection_pool (2.4.1)
     crack (1.0.0)
       bigdecimal
@@ -76,9 +85,6 @@ GEM
       addressable
     cssbundling-rails (1.4.1)
       railties (>= 6.0.0)
-    cuprite (0.15)
-      capybara (~> 3.0)
-      ferrum (~> 0.14.0)
     debug (1.9.2)
       irb (~> 1.10)
       reline (>= 0.3.8)
@@ -94,11 +100,12 @@ GEM
       smart_properties
     erblint-github (1.0.1)
     erubi (1.13.0)
-    ferrum (0.14)
+    ferrum (0.16)
       addressable (~> 2.5)
+      base64 (~> 0.2)
       concurrent-ruby (~> 1.1)
       webrick (~> 1.7)
-      websocket-driver (>= 0.6, < 0.8)
+      websocket-driver (~> 0.7)
     ffi (1.16.3)
     hashdiff (1.1.0)
     htmlbeautifier (1.4.3)
@@ -135,17 +142,17 @@ GEM
     matrix (0.4.2)
     method_source (1.1.0)
     mini_mime (1.1.5)
-    mini_portile2 (2.8.7)
+    mini_portile2 (2.8.8)
     minitest (5.25.1)
     mocha (2.3.0)
       ruby2_keywords (>= 0.0.5)
     msgpack (1.7.2)
     mutex_m (0.2.0)
     nio4r (2.7.3)
-    nokogiri (1.16.7)
+    nokogiri (1.18.3)
       mini_portile2 (~> 2.8.2)
       racc (~> 1.4)
-    nokogiri (1.16.7-x86_64-linux)
+    nokogiri (1.18.3-x86_64-linux-gnu)
       racc (~> 1.4)
     openproject-octicons (19.20.0)
     parallel (1.26.3)
@@ -157,18 +164,18 @@ GEM
       method_source (~> 1.0)
     psych (5.1.2)
       stringio
-    public_suffix (5.0.5)
+    public_suffix (6.0.1)
     puma (6.4.2)
       nio4r (~> 2.0)
     racc (1.8.1)
-    rack (3.1.7)
+    rack (3.1.10)
     rack-cors (2.0.2)
       rack (>= 2.0.0)
     rack-proxy (0.7.7)
       rack
     rack-session (2.0.0)
       rack (>= 3.0.0)
-    rack-test (2.1.0)
+    rack-test (2.2.0)
       rack (>= 1.3)
     rackup (2.1.0)
       rack (>= 3)
@@ -196,7 +203,7 @@ GEM
     rdoc (6.7.0)
       psych (>= 4.0.0)
     redcarpet (3.6.0)
-    regexp_parser (2.9.2)
+    regexp_parser (2.10.0)
     reline (0.5.10)
       io-console (~> 0.5)
     rexml (3.3.7)
@@ -277,9 +284,10 @@ GEM
       addressable (>= 2.8.0)
       crack (>= 0.3.2)
       hashdiff (>= 0.4.0, < 2.0.0)
-    webrick (1.8.1)
+    webrick (1.9.1)
     websocket (1.2.10)
-    websocket-driver (0.7.6)
+    websocket-driver (0.7.7)
+      base64
       websocket-extensions (>= 0.1.0)
     websocket-extensions (0.1.5)
     xpath (3.2.0)
@@ -300,7 +308,7 @@ DEPENDENCIES
   bootsnap (>= 1.4.2)
   capybara (~> 3.40.0)
   cssbundling-rails (~> 1.4)
-  cuprite (~> 0.15)
+  cuprite (~> 0.15)!
   debug
   erb_lint (~> 0.6)
   erblint-github (~> 1.0)

previews/primer/open_project/danger_dialog_preview.rb

@@ -96,6 +96,12 @@ def with_form_builder_form_test(route_format: :html)
       def with_form_test(route_format: :html)
         render_with_template(locals: { route_format: route_format })
       end
+
+      # @label With form and long additional details for testing purposes
+      # @hidden
+      def with_form_long_additional_details_test(route_format: :html)
+        render_with_template(locals: { route_format: route_format })
+      end
     end
   end
 end

previews/primer/open_project/danger_dialog_preview/with_form_long_additional_details_test.html.erb

@@ -0,0 +1,14 @@
+<%= render(Primer::OpenProject::DangerDialog.new(
+    title: "Delete dialog",
+    form_arguments: { action: generic_form_submission_path(route_format) }
+  )) do |dialog| %>
+  <% dialog.with_show_button { "Click me" } %>
+  <% dialog.with_confirmation_message do |message|
+      message.with_heading(tag: :h2).with_content("Permanently delete this item?")
+      message.with_description_content("This action is not reversible. Please proceed with caution.")
+     end %>
+  <% dialog.with_additional_details do %>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nunc tellus, finibus vitae purus vitae, venenatis sodales nibh. Duis orci quam, vehicula sed iaculis et, dignissim vel felis. Cras ac pretium nisl. Proin efficitur vehicula dui, eu pulvinar neque convallis et. Nam interdum imperdiet urna, at aliquam lectus mattis nec. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Donec cursus dolor et eros ornare, id pretium magna interdum. Cras cursus lorem eu semper bibendum. Nulla facilisi. In accumsan dignissim arcu vel congue. Sed auctor lacus ipsum, vitae posuere purus scelerisque ac. Suspendisse tincidunt justo eget libero luctus semper. Vivamus vitae erat ut erat malesuada volutpat.</p>
+  <% end %>
+  <% dialog.with_confirmation_check_box_content("I understand that this deletion cannot be reversed") %>
+<% end %>

test/system/open_project/danger_dialog_test.rb

@@ -3,6 +3,8 @@
 require "system/test_case"
 
 class IntegrationOpenProjectDangerDialogTest < System::TestCase
+  include Primer::WindowTestHelpers
+
   def test_submit_button_enabled_on_dialog_open_default
     visit_preview(:default)
 
@@ -62,6 +64,18 @@ def test_submit_button_submits_form
     assert_equal "1", form_params["confirm_dangerous_action"]
   end
 
+  def test_buttons_visible_without_scrolling_with_form
+    visit_preview(:with_form_long_additional_details_test, route_format: :json)
+    window.resize(height: 250)
+
+    click_button("Click me")
+
+    assert_selector(".DangerDialog") do
+      assert_selector("button[data-close-dialog-id]", obscured: false)
+      assert_selector("button[data-submit-dialog-id]", obscured: false)
+    end
+  end
+
   def test_submit_button_submits_form_builder_form
     visit_preview(:with_form_builder_form_test, route_format: :json)
 

test/test_helpers/window_test_helpers.rb

@@ -11,7 +11,7 @@ def initialize(page)
         @page = page
       end
 
-      def resize(width:, height:)
+      def resize(width: viewport_width, height: viewport_height)
         if firefox?
           page.driver.browser.manage.window.resize_to(width, height)
         elsif chrome?
@@ -27,6 +27,14 @@ def viewport_size
           page.driver.browser.viewport_size
         end
       end
+
+      def viewport_width
+        viewport_size[0]
+      end
+
+      def viewport_height
+        viewport_size[1]
+      end
     end
 
     module MethodOverrides