UI Dialog inside non-visible iFrame opens alternatingly with width=0
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 11.3k
- Forks
- 5.2k
- PR merge metrics
- No merged PRs in 30d
Description
It appears if you open a dialog on a page that's inside a now-visble iFrame, where the iFrame wasn't initially visible (display: none or a parent with display: none), the width of the dialog box will alternatingly be set to zero regardless of the width or minWidth options. To be clear, the first time the dialog is opened, the width is correct. If the dialog is closed (e.g. $(this).dialog("close")) and then re-opened (e.g. $(this).dialog("open")), the width will be set to zero. If it's closed/re-opened again, it's correct. And again, it's zero. Etc. In my case, the dialog is modal: true and resizable: false. I've test other configurations but I don't necessarily have access to the code used on the page inside the iFrame.
I dug through the widgets/dialog,js code a bit and I can't seem to find the culprit, except maybe _blockFrames, which sets the width based on the width of iFrames inside the dialog's HTML (my subpage has a couple but they're always display:none so not sure why this hasn't cropped up until now AND I've tried removing them but that didn't help). _blockFrames is called by _makeDraggable and _makeResizeable. Both of those options are false in my configuration so they shouldn't be getting called.
The workaround so far is to force the iFrame to reload once it's visible.
EDIT by @mgol: Fixed code formatting
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start in widgets/dialog.js and reproduce the alternating zero-width behavior with a dialog inside an initially hidden iframe. Trace the reopen path and the mentioned _blockFrames, _makeDraggable, and _makeResizeable entry points; done means repeated close/open cycles preserve the configured width once the iframe is visible.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, jquery
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100