Page MenuHomePhabricator

MinervaNeue: Desktop mode has invisible menu button
Closed, ResolvedPublicBUG REPORT

Description

Steps to Reproduce:

  1. on desktop computer, go to preferences -> Appearances tab
  2. select MinervaNeue skin
  3. skin should switch and no easily apparent way to logout or switch skin

This is occurring on MediaWiki 1.33.1.

Actual Results:
The expected menu button isn't visible but can be found by hover mouse somewhere on the left near the "Home" button. Users may panic thinking unable to log out or switch skin to a "usable" skin.

Expected Results:
The menu button next to "Home" should be visible allowing to logout or switch skins in preferences

MinervaNeue.PNG (822×1 px, 27 KB)

QA Results

ACStatusDetails
1T239304#5741183

Event Timeline

I am not seeing any notification icon in the screenshot. Is it not being displayed as well?

@Masumrezarock100 no notification icons are showing up despite Echo installed

@Jdrewniak
This is occurring on Google Chrome 78 on Windows 10. No impact in Mozilla Firefox, button displays.

I'm unable to reproduce on Chrome on Windows, but we have gotten reports of this issue sporadically.
Currently I'm seeing a disappearing icon on Mac Safari on the Wikimedia beta cluster. https://en.m.wikipedia.beta.wmflabs.org/wiki/TemplateUsageArticle392#
I also noticed this issue when using the VoiceOver screen-reader on iOS, in which icons disappear after the focus has been placed on them.

I've looked at the issue in Safari and it appears the method for achieving "screen-reader" only text is the culprit. Here the icon pseudo-element is positioned incorrectly because of the line-height: 9999px rule.

Screen Shot 2019-12-04 at 01.43.18.png (1×2 px, 1 MB)

voiceover icons dissapearing.gif (750×421 px, 1 MB)

I think these issues are all one and the same. Hopefully the patch below fixes this once and for all.

https://gerrit.wikimedia.org/r/#/c/mediawiki/skins/MinervaNeue/+/554398/

ovasileva triaged this task as Medium priority.Dec 4 2019, 6:08 PM

Change 554398 merged by jenkins-bot:
[mediawiki/skins/MinervaNeue@master] Remove line-height as a way to create "screen-reader" text for icons.

https://gerrit.wikimedia.org/r/554398

Checked the submitted patch with a +2 in code review yet unable to locate the file referenced by patch....skinStyles/mediawiki.ui.icon/mediawiki.ui.icon.less
I would like to have a working mobile skin for current stable release instead of waiting 2 releases

Checked the submitted patch with a +2 in code review yet unable to locate the file referenced by patch....skinStyles/mediawiki.ui.icon/mediawiki.ui.icon.less
I would like to have a working mobile skin for current stable release instead of waiting 2 releases

It should be in the MinervaNeue repo. If it's not I'm not sure how this problem could impact your wiki since this was introduced when we added that file. Does the skinStyles/mediawiki.ui.icon folder exist? What commit shows up in MinervaNeue in Special:Version ?

skinStyles/mediawiki.ui.icon does not exist, I am still confused what is causing the drop down button to remain hidden for 1.33.1 (security release) on Google Chrome 78. Is it possible that Google made a breaking change regarding MinervaNeue?

skinStyles/mediawiki.ui.icon does not exist, I am still confused what is causing the drop down button to remain hidden for 1.33.1 (security release) on Google Chrome 78. Is it possible that Google made a breaking change regarding MinervaNeue?

This sounds like a different bug then :(

You can try the same code in core/resources/src/mediawiki.ui/components/buttons.less to see if it resolves the problem.

wait, you want me to modify mediawiki core files?

wait, you want me to modify mediawiki core files?

Honestly I don't understand your problem so I don't recommend you do anything that you don't fully understand. I'd suggest raising this issue at https://www.mediawiki.org/wiki/Skin_talk:Minerva_Neue and provide the URL to your mediawiki instance to get the best advice - phabricator is not the best place for this kind of support.

@Jdrewniak it appears there is confusion regarding this bug ticket by QA/web reading team. I have a wikifarm set up consisting of 9 wikis, the issue is occurring on 4 wikis which is ~45%. I followed installation steps for MinervaNeue skin and Extension:MobileFrontEnd, this should not be occurring on latest mediawiki stable - 1.33.1 (a security release for 1.33)

@Jdlrobson
Let's clarify shall we?

  1. MinervaNeue skin is working as expected for mobile.
  2. When MinervaNeue skin is chosen by a user on DESKTOP using Google Chrome as browser (latest is Version 79.0.3945.79 (Official Build) ), Users should not panic thinking things are broken because they no longer see a log out button or an easy way to change the skin to an actual usable skin. In this case the menu toggle (opens the navigation contents) button is invisible. oh sure If I hover my mouse around the top gray bar, I can find the menu button but this is not expected behavior and therefore a bug. Hence this bug report.

@SpookyGhost8: The merged patch made changes to the file [skinStyles/mediawiki.ui.icon/mediawiki.ui.icon.less](https://phabricator.wikimedia.org/diffusion/SMIN/browse/master/skinStyles/mediawiki.ui.icon/mediawiki.ui.icon.less), which is located in the /skins/MinervaNeue/ folder of a MediaWiki installation. If you don't want to wait for 1.33.2 then you'll have to edit and update that file locally.
I currently don't see anything actionable left in this task so I propose to close it as resolved. Once you applied the merged patch locally and it does not fix the issue, feel free to reopen and either include a public URL where the problem can be seen, or a screenshot of the browser's developer tools inspecting the non-displayed icon.

@SpookyGhost8 I'm happy to continue this conversation at https://www.mediawiki.org/wiki/Skin_talk:Minerva_Neue but I'd really need to see a URL to one of the wikis to understand the specific problem you're having. Feel free to ping me on mw.org (User:jdlrobson)

Edtadros added a subscriber: Edtadros.

Test Result

Status: ✅ PASS
OS: macOS Catalina sans Kernel Panic
Browser: Chrome
Device: MBP]

Test Artifact(s):

Steps to Reproduce:

on desktop computer, go to preferences -> Appearances tab
select MinervaNeue skin
skin should switch and no easily apparent way to logout or switch skin
This is occurring on MediaWiki 1.33.1.

Actual Results:
The expected menu button isn't visible but can be found by hover mouse somewhere on the left near the "Home" button. Users may panic thinking unable to log out or switch skin to a "usable" skin.

✅AC1: Expected Results:
The menu button next to "Home" should be visible allowing to logout or switch skins in preferences

T239304.gif (792×677 px, 984 KB)

tested on chrome with minerva, works fine