Merge pull request #243 from opf/fix/61546-danger-dialog-scroll-behaviour

[#61546] Fix DangerDialog scroll behaviour w/form

Author: HDinger

.changeset/soft-pots-return.md

@@ -0,0 +1,5 @@
+---
+'@openproject/primer-view-components': patch
+---
+
+Fix DangerDialog body scroll behaviour when containing a form: the dialog's confirm and cancel buttons should now always be visible in the viewport, never scrolling with the other dialog content.

app/components/primer/open_project/danger_dialog_form_helper.ts

@@ -6,12 +6,21 @@ const SUBMIT_BUTTON_SELECTOR = 'input[type=submit],button[type=submit],button[da
 class DangerDialogFormHelperElement extends HTMLElement {
   @target checkbox: HTMLInputElement | undefined
 
+  get form() {
+    return this.querySelector('form')
+  }
+
   get submitButton() {
     return this.querySelector<HTMLInputElement | HTMLButtonElement>(SUBMIT_BUTTON_SELECTOR)!
   }
 
   connectedCallback() {
+    // makes the custom element behave as if it doesn't exist in the DOM structure, passing all
+    // styles directly to its children.
     this.style.display = 'contents'
+    if (this.form) {
+      this.form.style.display = 'contents'
+    }
     this.#reset()
   }