Bartosz Dziewoński has uploaded a new change for review. https://gerrit.wikimedia.org/r/175926
Change subject: MessageDialog: Actually correctly calculate and set height ...................................................................... MessageDialog: Actually correctly calculate and set height We want to know the height necessary to display the dialog without scrollbars. However, we have been calculating it with scrollbars visible – so, the height necessary to get disabled scrollbars if they are visible, like with 'overflow: scroll'. Simple workaround: set 'overflow: hidden' before calculating height, then reset it to previous value. …ha-ha, I've got you, not so easy. The first issue is that Chromium doesn't update sizes of child elements when scrollbars disappear (this appears to be a flavor of https://code.google.com/p/chromium/issues/detail?id=387290). IE11 has the same issue. Easy fix: force reflow. Except that it doesn't suffice for Chromium. Hiding all child notes, then forcing reflow, then showing them back seems to work; you're unable to find a less invasive method. Now you might think that we are done, but no! Remember the Firefox hack we had to twiddle the 'overflow' property to make it realize that it doesn't need scrollbars anymore and hide them? Well, it's back, and it affects all browsers you test this time. Easy fix: force reflow more. …had you there. Of course it doesn't work on Chromium (other browsers are fine). Something that works consistently is, again, the hide-reflow-show dance. It is 3 AM. You re-test four browsers, trying to see the dialog imperceptibly flicker, and submit the whole mess for review. You vow never to use 'overflow: auto' ever again, but know that tomorrow, there will be more rogue scrollbars to defeat. Bug: T72061 Change-Id: Ic56871a46b4f8c1bf52c7359cba61b6221649b22 --- M src/dialogs/MessageDialog.js 1 file changed, 25 insertions(+), 6 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/26/175926/1 diff --git a/src/dialogs/MessageDialog.js b/src/dialogs/MessageDialog.js index 9886038..a5cde82 100644 --- a/src/dialogs/MessageDialog.js +++ b/src/dialogs/MessageDialog.js @@ -135,7 +135,21 @@ * @inheritdoc */ OO.ui.MessageDialog.prototype.getBodyHeight = function () { - return Math.round( this.text.$element.outerHeight( true ) ); + var bodyHeight, oldOverflow, + $scrollable = this.container.$element; + + oldOverflow = $scrollable[0].style.overflow; + $scrollable[0].style.overflow = 'hidden'; + + // Force… ugh… something to happen + $scrollable.contents().hide(); + $scrollable.height(); + $scrollable.contents().show(); + + bodyHeight = Math.round( this.text.$element.outerHeight( true ) ); + $scrollable[0].style.overflow = oldOverflow; + + return bodyHeight; }; /** @@ -145,13 +159,18 @@ var $scrollable = this.container.$element; OO.ui.MessageDialog.super.prototype.setDimensions.call( this, dim ); - // Firefox hack: - // Twiddle the overflow property, otherwise an unnecessary scrollbar may be produced. + // Twiddle the overflow property, otherwise an unnecessary scrollbar will be produced. // Need to do it after transition completes (250ms), add 50ms just in case. setTimeout( function () { - $scrollable.css( 'overflow', 'hidden' ); - $scrollable.height(); // Force reflow - $scrollable.css( 'overflow', '' ); + var oldOverflow = $scrollable[0].style.overflow; + $scrollable[0].style.overflow = 'hidden'; + + // Force… ugh… something to happen + $scrollable.contents().hide(); + $scrollable.height(); + $scrollable.contents().show(); + + $scrollable[0].style.overflow = oldOverflow; }, 300 ); return this; -- To view, visit https://gerrit.wikimedia.org/r/175926 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: Ic56871a46b4f8c1bf52c7359cba61b6221649b22 Gerrit-PatchSet: 1 Gerrit-Project: oojs/ui Gerrit-Branch: master Gerrit-Owner: Bartosz Dziewoński <matma....@gmail.com> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
