Bug 2388785 - [webui] cockpit storage getting hidden on small screens behing non scrollable content
Summary: [webui] cockpit storage getting hidden on small screens behing non scrollable...
Keywords:
Status: CLOSED ERRATA
Alias: None
Product: Fedora
Classification: Fedora
Component: cockpit
Version: 43
Hardware: Unspecified
OS: Linux
unspecified
medium
Target Milestone: ---
Assignee: Martin Pitt
QA Contact: Fedora Extras Quality Assurance
URL:
Whiteboard: RejectedBlocker https://discussion.fe...
: 2395911 (view as bug list)
Depends On:
Blocks:
TreeView+ depends on / blocked
 
Reported: 2025-08-15 14:44 UTC by lnie
Modified: 2025-09-23 09:01 UTC (History)
13 users (show)

Fixed In Version: cockpit-345.2-1.fc43
Clone Of:
Environment:
Last Closed: 2025-09-12 19:31:27 UTC
Type: ---
Embargoed:


Attachments (Terms of Use)
webui.log (2.72 KB, text/plain)
2025-08-15 14:48 UTC, lnie
no flags Details
screencast (203.57 KB, video/mp4)
2025-08-15 14:48 UTC, lnie
no flags Details
screencast with Fedora-Workstation-Live-43_Beta-1.3.x86_64.iso (237.69 KB, video/mp4)
2025-09-11 03:31 UTC, lnie
no flags Details
workaround screencast - I clicked on 'vda2' (206.49 KB, video/webm)
2025-09-11 17:34 UTC, Adam Williamson
no flags Details

Description lnie 2025-08-15 14:44:29 UTC
Boot Fedora-Workstation-Live-43-20250814.n.0.x86_64.iso ,launch storage editor, create some(> 3) partitions, left-click the three-points on the right to modify the partition,when you find the delete button is hidden,and you will try to make it shown by scroll the dialog,you will find  you will not able to,as a result you will not able to delete some partitions.

Here is the patch cursor offer,


diff --git a/src/components/app.scss b/src/components/app.scss
index 751930c8..bc1a3517 100644
--- a/src/components/app.scss
+++ b/src/components/app.scss
@@ -12,6 +12,11 @@ html:not(.index-page) body {
   .ct-page-fill {
     height: 100% !important;
   }
+  
+  // Ensure iframe content can scroll properly, especially when containing modal dialogs
+  iframe {
+    overflow: visible !important;
+  }
 }
 
 // Remove the default margin and radius from the main container
diff --git a/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.jsx b/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.jsx
index 1d49615f..5d208e69 100644
--- a/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.jsx
+++ b/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.jsx
@@ -70,7 +70,18 @@ export const useMaybeBackdrop = () => {
     useEffect(() => {
         const handleStorageEvent = (event) => {
             if (event.key === "cockpit_has_modal") {
-                setHasDialogOpen(event.newValue === "true");
+                const hasModal = event.newValue === "true";
+                setHasDialogOpen(hasModal);
+                
+                // Add or remove has-modal class to iframe to improve modal dialog display
+                const iframe = document.getElementById("cockpit-storage-frame");
+                if (iframe) {
+                    if (hasModal) {
+                        iframe.classList.add("has-modal");
+                    } else {
+                        iframe.classList.remove("has-modal");
+                    }
+                }
             }
         };
 
diff --git a/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.scss b/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.scss
index c862f597..77bc79ee 100644
--- a/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.scss
+++ b/src/components/storage/cockpit-storage-integration/CockpitStorageIntegration.scss
@@ -32,6 +32,8 @@
     border-radius: var(--pf-t--global--border--radius--medium);
     border: var(--pf-t--global--border--width--box--default) solid var(--pf-t--global--border--color--default);
     background-clip: content-box; /* Fix weird anti-alaising */
+    /* Ensure iframe content can scroll properly */
+    overflow: auto;
 }
 
 .cockpit-storage-integration-page-section-cockpit-storage {
@@ -97,3 +99,54 @@ iframe {
     z-index: 9;
   }
 }
+
+// Ensure iframe modal dialogs can display and scroll properly
+.cockpit-storage-integration-iframe-cockpit-storage {
+  // Provide proper z-index and positioning for iframe modal dialogs
+  iframe {
+    // Allow iframe content to display beyond boundaries (for modal dialogs)
+    overflow: visible;
+    
+    // Ensure modal dialogs can display outside iframe boundaries
+    body {
+      overflow: visible !important;
+    }
+  }
+}
+
+// Improve modal dialog display within iframes
+.cockpit-storage-integration-modal-page-section iframe {
+  // Allow proper positioning of modal dialogs in iframe content
+  overflow: visible;
+  
+  // Ensure modal dialogs are not clipped by iframe boundaries
+  clip: unset;
+  -webkit-clip-path: none;
+  clip-path: none;
+  clip: unset;
+  -webkit-clip-path: none;
+  clip-path: none;
+}
+
+// Specifically handle scrolling issues for modal dialogs within iframes
+.cockpit-storage-integration-modal-page-section {
+  // Ensure modal dialog container can handle overflow content
+  overflow: visible;
+  
+  // Provide sufficient z-index for iframe to display modal dialogs
+  iframe {
+    position: relative;
+    z-index: 1000;
+    
+    // Ensure modal dialogs within iframe can display correctly
+    &::content {
+      overflow: visible !important;
+    }
+  }
+}
+
+// Add specific styles to handle modal dialogs in Cockpit storage interface
+.cockpit-storage-integration-iframe-cockpit-storage {
+  // When modal dialog is open, ensure iframe can display complete content
+  &.has-modal {
+    overflow: visible;
+    min-height: 100vh;
+  }
+}

it addresses the iframe modal dialog scrolling issue by:
1.CSS Improvements: Added proper overflow handling for iframe content
Dynamic Class Management: JavaScript automatically applies has-modal class when modals open
2.Scrolling Support: Ensures modal dialogs can scroll when content exceeds viewport
3.Backward Compatibility: Maintains existing functionality while fixing the display issues

I'm not familiar with the code, but looks like a valid solution.


Reproducible: Always

Comment 1 lnie 2025-08-15 14:48:11 UTC
Created attachment 2103728 [details]
webui.log

Comment 2 lnie 2025-08-15 14:48:48 UTC
Created attachment 2103729 [details]
screencast

Comment 3 Fedora Blocker Bugs Application 2025-08-18 08:19:56 UTC
Proposed as a Blocker for 43-beta by Fedora user lnie using the blocker tracking app because:

 seems violates:
https://fedoraproject.org/wiki/Fedora_43_Beta_Release_Criteria#Custom_partitioning

Comment 4 Adam Williamson 2025-08-25 15:11:04 UTC
+7 in https://pagure.io/fedora-qa/blocker-review/issue/1873 , marking accepted.

Comment 5 bciconel 2025-08-29 19:34:21 UTC
I had trouble reproducing this on a 1440p monitor, but after moving the browser window to a lower resolution screen I accidentally reproduced it.

Setting the resolution to 720p makes reproducing it even easier.

Comment 6 Kamil Páral 2025-09-09 08:36:25 UTC
Hello, is there any progress on this accepted blocker? Thanks!

Comment 7 bciconel 2025-09-09 18:44:02 UTC
Yes. The problem is on cockpit side and also affects it. A fix is in progress at the moment, but it is not ready yet (https://github.com/cockpit-project/cockpit/pull/22413).

In the meantime, we made a smaller change that would affect anaconda-webui exclusively, which is already merged (https://github.com/cockpit-project/cockpit/pull/22420).

Comment 8 Martin Pitt 2025-09-10 07:06:26 UTC
Will do a point release with just this patch.

Comment 9 Martin Pitt 2025-09-10 07:35:11 UTC
https://github.com/cockpit-project/cockpit/releases/tag/345.1

https://github.com/cockpit-project/cockpit/compare/345...345.1

Unfortunately packit is AWOL, it only submitted the F41 dist-git MR so far (which I closed, we only need 43). If it doesn't catch up in the next hour, I'll bite the bullet and do this manually.

Comment 10 Fedora Update System 2025-09-10 08:16:48 UTC
FEDORA-2025-1393cb46db (cockpit-345.1-1.fc43) has been submitted as an update to Fedora 43.
https://bodhi.fedoraproject.org/updates/FEDORA-2025-1393cb46db

Comment 11 Martin Pitt 2025-09-10 08:17:06 UTC
For the record, https://dashboard.packit.dev/jobs/propose-downstream/20380 was skipped because 346 was already in dist-git. I unpushed https://bodhi.fedoraproject.org/updates/FEDORA-2025-ca5be198f5 , reverted the dist-git commit, and built the release manually.

Comment 12 Adam Williamson 2025-09-10 14:45:03 UTC
uff, sorry, this was just about an hour after I sent the candidate compose request :/ I'll request another with this fix.

Comment 13 Fedora Update System 2025-09-11 02:22:12 UTC
FEDORA-2025-1393cb46db has been pushed to the Fedora 43 testing repository.
Soon you'll be able to install the update with the following command:
`sudo dnf upgrade --enablerepo=updates-testing --refresh --advisory=FEDORA-2025-1393cb46db`
You can provide feedback for this update here: https://bodhi.fedoraproject.org/updates/FEDORA-2025-1393cb46db

See also https://fedoraproject.org/wiki/QA:Updates_Testing for more information on how to test updates.

Comment 14 lnie 2025-09-11 03:31:01 UTC
 I checked with Fedora-Workstation-Live-43_Beta-1.3.x86_64.iso on vm, it seems the bug is still there.

Comment 15 lnie 2025-09-11 03:31:50 UTC
Created attachment 2106258 [details]
screencast with Fedora-Workstation-Live-43_Beta-1.3.x86_64.iso

Comment 16 Martin Pitt 2025-09-11 04:34:22 UTC
@lnie On download.fedoraproject I see

Fedora-Workstation-Live-43-20250910.n.0.x86_64.iso 10-Sep-2025 08:43          2797148160

I.e. the build happened before this fix was uploaded. The iso has to be refreshed to pick this up. You can verify with `rpm -q cockpit-storaged`, it must be 345.1 for the fix, not 345. Or did you manually update to that on the live system?

Comment 17 Adam Williamson 2025-09-11 05:46:20 UTC
yeah, the update didn't actually show up in time to be in 1.2 or 1.3, unfortunately.

Comment 18 lnie 2025-09-11 07:31:02 UTC
hmmm,I boot with Beta-1.3, and download and installed the update from #commen13,which contains cockpit-storaged-346-1.fc43.noarch.rpm,still the same symptom.

Comment 19 bciconel 2025-09-11 08:26:16 UTC
OK, we have found the root cause of the issue. When we made the patch we missed one commit that the fix depends.

Comment 20 Martin Pitt 2025-09-11 09:06:08 UTC
lnie: 346 does *not* contain the fix. That was https://bodhi.fedoraproject.org/updates/FEDORA-2025-ca5be198f5 which landed much earlier, and I retracted it to clear the path for this urgent update.

I cherry-picked the second missing patch now, and will release 345.2. Sorry for the hassle!

Comment 22 Martin Pitt 2025-09-11 10:24:39 UTC
https://bodhi.fedoraproject.org/updates/FEDORA-2025-210b8731cb ships this now, please re-test. Thanks!

Comment 23 lnie 2025-09-11 10:59:17 UTC
works now,I'm able to scroll up the dialog to get the delete button shown,thanks.

Comment 24 Fedora Update System 2025-09-11 14:11:16 UTC
FEDORA-2025-210b8731cb (cockpit-345.2-1.fc43) has been submitted as an update to Fedora 43.
https://bodhi.fedoraproject.org/updates/FEDORA-2025-210b8731cb

Comment 25 Adam Williamson 2025-09-11 17:33:02 UTC
I actually ran into this while testing the RAID bug yesterday, I think. I think I also found a workaround: you can click on the partition and get a 'details' screen where you can do all the 'missing' operations. that is, click vda4 (or vda3, vda2 etc). I'll attach a screencast.

Comment 26 Adam Williamson 2025-09-11 17:34:00 UTC
Created attachment 2106378 [details]
workaround screencast - I clicked on 'vda2'

Comment 27 Adam Williamson 2025-09-11 19:14:00 UTC
Marking CommonBugs so we can document this for the Beta, as we're releasing Beta-1.3 without the fix.

Comment 28 Adam Williamson 2025-09-11 19:15:45 UTC
Discussed in the 2025-09-11 Fedora 43 Beta go/no-go meeting, acting as a blocker review meeting - https://meetbot-raw.fedoraproject.org/meeting_matrix_fedoraproject-org/2025-09-11/ . We re-reviewed this and decided to reject it as a blocker, as the workaround does allow all the required operations.

Comment 29 Fedora Update System 2025-09-12 02:44:32 UTC
FEDORA-2025-210b8731cb has been pushed to the Fedora 43 testing repository.
Soon you'll be able to install the update with the following command:
`sudo dnf upgrade --enablerepo=updates-testing --refresh --advisory=FEDORA-2025-210b8731cb`
You can provide feedback for this update here: https://bodhi.fedoraproject.org/updates/FEDORA-2025-210b8731cb

See also https://fedoraproject.org/wiki/QA:Updates_Testing for more information on how to test updates.

Comment 30 Kamil Páral 2025-09-12 11:25:56 UTC
Common Issue documentation:
https://discussion.fedoraproject.org/t/common-issue/164173

Comment 31 Fedora Update System 2025-09-12 19:31:27 UTC
FEDORA-2025-210b8731cb (cockpit-345.2-1.fc43) has been pushed to the Fedora 43 stable repository.
If problem still persists, please make note of it in this bug report.

Comment 32 Katerina Koukiou 2025-09-23 09:01:45 UTC
*** Bug 2395911 has been marked as a duplicate of this bug. ***


Note You need to log in before you can comment on or make changes to this bug.