Last modified: 2014-09-11 18:54:30 UTC
Created attachment 13077 [details] Screenshot FF, vector skin, mediawiki,ca-action [Regression]: mw-notification-area makes vector-hover-dropdown closing ---- How to reproduce: * Be an admin at Commons or have otherwise at least 3 entries in your ca-action dropdown. * Fire mw.notify('foo') in your js-console * Scroll to top * Click the message ('foo') to "hide" it * Hover the ca-action arrow. * Try to click "protect" (see screenshot) As soon as your cursor is over the mw-notification-area (made visible in other screenshot), the dropdown closes. ---- Expected behaviour: Can move/protect page. Dropdown does not close out of the blue.
Created attachment 13078 [details] Screenshot FF, vector skin, mediawiki, mw-notify I suppose this regression was introduced by fixing https://bugzilla.wikimedia.org/show_bug.cgi?id=50870 - When I test locally (codebase about 4 weeks old), the menu/dropdown does not close unexpectedly.
The culprit is this line: padding: 1em 1em 0 0; in mediawiki.notification.css. It causes .mw-notification-area to have a non-zero height and thus cover other elements, like the dropdown. There are two obvious ways to fix it which don't work: * Change the padding to margin. This causes the notifications to "jump" slightly when scrolling, as detailed in commit message of https://gerrit.wikimedia.org/r/#/c/75614/ * Add .mw-notification-area:empty { display: none; }. This doesn't work on IE<9 and other old browsers. [http://caniuse.com/#feat=css-sel3] Unless somebody has a better idea, we should probably implement toggling 'display' in JavaScript.
*** Bug 55457 has been marked as a duplicate of this bug. ***
From bug 55457 comment 0: | 1. Trigger a notification | 2. Click on the notification to dismiss it | 3. The notification area (<div id="mw-notification-area">) is now empty, but | still obscures a narrow strip in the top right corner: | | > $('#mw-notification-area').outerHeight() | 12 | > $('#mw-notification-area').outerWidth() | 269 | > $('#mw-notification-area').position() | Object {top: 89.59375, left: 1251.203125} | > $('#mw-notification-area').css('z-index') | "10000" | | This is a problem because the div steals events and mouse interaction from the | UI elements below it. For instance, in VisualEditor: | 1. Open a page in VE | 2. Type '[['. The wikitext warning appears | 3. Click the warning to dismiss it | 4. Reveal #mw-notification-area in the inspector and observe how it's on top | of part of the save button | 5. Very carefully move the mouse over the save button, and you'll notice a | small (12px tall) area where mouse pointer is a normal pointer instead of a | hand. Clicking in this area does not press the save button.
So I was right that VE is *pushed* by the Wikimedia Foundation: https://bugzilla.wikimedia.org/show_activity.cgi?id=52659
(In reply to comment #5) > So I was right that VE is *pushed* by the Wikimedia Foundation: > https://bugzilla.wikimedia.org/show_activity.cgi?id=52659 I'm confused. What are you saying?
(In reply to comment #2) > Unless somebody has a better idea, we should probably implement toggling > 'display' in JavaScript. If the ca-action dropdown is the only exposed UI problem, perhaps the ca-action dropdown buttons could have a higher z-index, as a temporary fix at least? (In reply to comment #5) > So I was right that VE is *pushed* by the Wikimedia Foundation: > https://bugzilla.wikimedia.org/show_activity.cgi?id=52659 It certainly is. While this regression outside of VisualEditor codebase is regrettable, and hopefully will be fixed soon, the VE team have pushed lots of great JS into core, and fixed bugs like bug 38081 which will benefit Wikimedia Commons. I have bumped the importance up (but not wedded to it) as it is a regression caused by VE and affecting non-VE environments, and was reported two months ago, and the code change causing it was deployed in July. In addition to impacting sysops with three ca-actions, it also affects non-sysops on every wiki, although not as pronounced. Non sysops only have the the 'Move' button in the ca-action dropdown of Vector, and it is partially inaccessible. If the user slowly moves their mouse cursor down into the dropdown, they can click the move icon if the click on the first few pixels above the word 'Move' - if they continue going down so that their mouse cursor hovers over the word 'Move', the drop down disappears.
jforrester: Should this really be highest priority (set in comment 7), or be kept as high (as you did in comment 4)?
I am resetting this to high priority only as per the maintainer judgement in comment 4.
Ugh, I guess no one will do this if I don't.
Change 109124 had a related patch set uploaded by Bartosz Dziewoński: mediawiki.notification: Hide #mw-notification-area when it's empty https://gerrit.wikimedia.org/r/109124
Thanks, Bartosz.
Rephrasing bug title as it was cut-off.
Change 109124 merged by jenkins-bot: mediawiki.notification: Hide #mw-notification-area when it's empty https://gerrit.wikimedia.org/r/109124
Change 158659 had a related patch set uploaded by Catrope: Followup 6c5b246: also hide #mw-notification-area upon creation https://gerrit.wikimedia.org/r/158659
Change 158659 merged by jenkins-bot: mediawiki.notification: Also hide #mw-notification-area upon creation https://gerrit.wikimedia.org/r/158659
