859620 - Resizer in menupopup moves popup off of its anchor if popup is anchored on its right-hand side

Status: NEW

(Core :: XUL, defect)

Description

[u462496]

Attachment: extension demonstrating the bug

This bug is observed both on WindowsOS and MacOS.

When putting a resizer in a menupopup, if the popup is anchored on its right-hand size, eg, topright or bottomright, when attempting to resize the popup smaller than than min-width, the entire popup begins moving off of its anchor position.  This does not happen if the popup is anchored on its left-hand side (topleft, bottomleft), ie, it remains in its anchor position even if attempting to resize smaller.

Attached is an extension demonstrating the bug; install addon, enable addons bar, click "Resize Bug Demo" to open demo dialog.

Find two menu buttons, "Test #1" and "Test #2".  Each contain menupopups that have a min-width of 130px.

"Test #1": Popup is anchored bottomleft (after_start); drag the resizer, observe that when attempting to drag to the left to a size smaller than 130px, right-hand edge of popup merely ceases to move.

"Test #2": Popup is anchored bottomright (after_end); drag the resizer, observe that when attempting to drag to the right to a size smaller than 130px, entire popup begins to move to the right, moving it off its anchor.

Comment 1

[Alice0775 White]

Attachment: xul

Comment 2

[u462496]

I am unable to open or view your attachment

Comment 3

[Alice0775 White]

You should allow to open remote xul

Comment 4

[u462496]

Attachment: extension demonstrating the bug

Comment 5

[u462496]

Attachment: XUL 2

Comment 6

[u462496]

The problem occurs when max-width is set also.

If someone can suggest a clean workaround it would be welcome.

Comment 7

[u462496]

Perhaps this will provide a clue? :

In seeking a workaround for this problem, I created a custom resizer that does not use the resizer element at all.  It uses only Javascript and listens for mousemove events, resetting the width of the element with each event.  This simple approach does not move the popup off of its anchor in either direction.

It is also interesting to note that aside from not moving the anchor, the action seems to be smoother than with the resizer element, at least on MacOS.  When resizing with the resizer element, the menu tends to "bounce".  There is a little bit of this "bounciness" with the custom element, but it seems less.  I notice also that with the resizer element, the more times you drag the menu back and forth during a resize action, the more severe the bounciness gets. 

I am attaching a demo of this custom resizer.  Note that it uses a toobarbutton menu, because I have observed that any lack of smoothness manifests itself more prominently when the popup is in the toolbar than in a separate demo window.

The button is labeled "TB RSZR" and has a red right-pointing arrow for an icon.

A menu will open with the two resizers at the top for comparison.

Another thing interesting to observe is that if you resize first using the resizer element, and then resize using the custom element without closing the menu first, the popup is now anchored on the left-hand side.  This will not happen if you use the custom resizer after closing and re-opening the popup.  Somehow the resizer element shifts the anchor to the left?

Comment 8

[u462496]

Attachment: Workaround demo and comparison to resizer element

Comment 9

[u462496]

Been 3 months, anything happening with this?

Comment 10

[Firefox Bug Husbandry Bot]

Moving to Core:XUL per https://bugzilla.mozilla.org/show_bug.cgi?id=1455336