Last modified: 2012-05-09 07:01:48 UTC

Wikimedia Bugzilla is closed!

Wikimedia migrated from Bugzilla to Phabricator. Bug reports are handled in Wikimedia Phabricator.
This static website is read-only and for historical purposes. It is not possible to log in and except for displaying bug reports and their history, links might be broken. See T31002, the corresponding Phabricator task for complete and up-to-date bug report information.
Bug 29002 - Resizing WikiEditor dialogs works wrong when using an RTL language
Resizing WikiEditor dialogs works wrong when using an RTL language
Product: MediaWiki extensions
Classification: Unclassified
WikiEditor (Other open bugs)
All All
: High normal with 1 vote (vote)
: MW 1.20 version
Assigned To: Nobody - You can work on this!
: i18n
Depends on:
Blocks: rtl 36664
  Show dependency treegraph
Reported: 2011-05-15 21:02 UTC by Robin Pepermans (SPQRobin)
Modified: 2012-05-09 07:01 UTC (History)
9 users (show)

See Also:
Web browser: ---
Mobile Platform: ---
Assignee Huggle Beta Tester: ---

Screen recording in Firefox 4/Mac OS X 10.6 (897.18 KB, video/mp4)
2011-08-16 22:15 UTC, Brion Vibber

Description Robin Pepermans (SPQRobin) 2011-05-15 21:02:16 UTC
When editing a page using an RTL language, opening a dialog in the Vector toolbar (like, adding a link), it resizes to the wrong direction.
Comment 1 Siebrand Mazeland 2011-08-02 12:36:07 UTC
Can you add a screenshot if the incorrect behaviour?
Comment 2 Amir E. Aharoni 2011-08-05 21:44:55 UTC
It's kinda hard to take a screenshot of this. To reproduce, just edit any article in an RTL wiki, click the search and replace button and try to resize the window.
Comment 3 Siebrand Mazeland 2011-08-05 22:03:28 UTC
s/screenshot/screen video/
Comment 4 Derk-Jan Hartman 2011-08-06 15:35:32 UTC
I don't seen the problem using Safari. What browser were you using, perhaps it's browser specific.

There are plenty of rtl alignment issues btw, but those are mostly known I think and most are in the jqueryUI toolkit part.
Comment 5 Amir E. Aharoni 2011-08-08 05:39:49 UTC
The behavior on Firefox Aurora, IE8,  Chrome 13, Safari 5.1 and Opera 11.50 on Windows XP is the same: I drag the bottom left corner, and what actually moves is the bottom right corner.

Mileage on other operating systems may vary.
Comment 6 Brion Vibber 2011-08-16 22:15:49 UTC
Created attachment 8929 [details]
Screen recording in Firefox 4/Mac OS X 10.6
Comment 7 Brion Vibber 2011-08-16 22:25:12 UTC
I suspect that jquery.resize still thinks it's operating on the southeast corner... indeed, it's a .ui-resizable-se.

This bit in jquery.ui.dialog.css:

.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }

is being auto-rewritten by ResourceLoader to:

.ui-dialog .ui-resizable-se {
  bottom: 3px;
  height: 14px;
  left: 3px;
  width: 14px;

If we actually create the resize handle as the southwest corner for RTL, and have styles for that that won't get flipped, that may resolve it.
Comment 8 Roan Kattouw 2011-08-17 11:40:42 UTC
So are you just saying that you need the right-left flipping to not happen for that CSS rule, or is there more?
Comment 9 Amir E. Aharoni 2011-09-07 21:46:09 UTC
Adding /* @noflip */ before "right: 3px;" moves the corner handle to the southeast corner and makes resizing by dragging the southeast corner work correctly. This is OK - that's the location of the corner handle in LTR wikis and for RTL users it is reasonable. (The X for closing the dialog is also located in northeast, as in LTR wikis, and AFAIK nobody complains.)

However, resizing by dragging the left and right vertical frames drags the opposite frame, so it's not a complete solution.

BTW, it is not actually important to have the ability to resize the dialogs for Links and Search and Replace. Though it's important to properly fix this bug, these dialogs can just be made non-resizable, like the Insert table dialog.

FWIW: The WikiEditor TOC thing, which can be resized by dragging the vertical grip, works correctly.
Comment 10 Eran Roz 2012-05-03 18:02:28 UTC
I tried adding noflip to the jquery's resize css, and it behaves correctly (dragging left => the dialog is wider to left, dragging right=>the dialog is wider to the right).

Please review:,6542

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