Page MenuHomePhabricator

[Unplanned] Vector 2022 sidebar is automatically collapsed on exactly 1000px breakpoint
Open, MediumPublic1 Estimated Story PointsBUG REPORT

Description

Steps to replicate the issue (include links if applicable):

  • While authenticated, Open any page on ro.wikipedia.org (desktop version) from Firefox for Android
  • Click on the burger button to show the sidebar
  • Click on any Wikipedia link from the page

What happens?: on the new page, the sidebar is no longer displayed.

What should have happened instead?: the sidebar should have been displayed until hidden again, like for desktop browsers.

Software version (skip for WMF-hosted wikis like Wikipedia):

Other information (browser name/version, screenshots, etc.): FF 104.2.0 on Android 12

Event Timeline

Jdlrobson renamed this task from The option to show the Vector 2022 sidebar is not saved on FF mobile to [Firefox mobile] Vector 2022 sidebar is automatically collapsed.EditedOct 27 2022, 3:08 PM
Jdlrobson added a subscriber: Jdlrobson.

The preference seems to be saved. What's happening is we have code that is collapsing the sidebar at lower resolutions and incorrectly this is being triggered in the browser.

This seems like an upstream Firefox bug. It is using the device width rather than the viewport width from what I can see.

Jdlrobson renamed this task from [Firefox mobile] Vector 2022 sidebar is automatically collapsed to [Mobile] Vector 2022 sidebar is automatically collapsed.EditedOct 27 2022, 3:10 PM
Jdlrobson added a project: Readers-Web-Backlog.

Also happening on Chrome for Android. I think the matchMedia query should be 1px less.

Jdlrobson renamed this task from [Mobile] Vector 2022 sidebar is automatically collapsed to Vector 2022 sidebar is automatically collapsed on exactly 1000px breakpoint.Oct 27 2022, 3:14 PM

I'm not so sure that would help in my case. The screen resolution is (2340 ×1080 pixels), but experimenting with the basic code from Mozilla seems to indicate the limit is ~200px in portrait mode and ~750px in landscape. Do you have any idea why I would see these results?

I'm not so sure that would help in my case. The screen resolution is (2340 ×1080 pixels), but experimenting with the basic code from Mozilla seems to indicate the limit is ~200px in portrait mode and ~750px in landscape. Do you have any idea why I would see these results?

If you load Wikipedia on your phone and view source you will see the following:
<meta name="viewport" content="width=1000"/>

So whatever your device / screen resolution the site is being told to render at 1000px.
My best guess is this line: https://github.com/wikimedia/Vector/blob/master/resources/skins.vector.js/sidebarPersistence.js#L118 should be var mediaQuery = window.matchMedia( '(max-width: 999px)' );

Change 859591 had a related patch set uploaded (by Jdlrobson; author: Jdlrobson):

[mediawiki/skins/Vector@master] Bug: Fix when Vector 2022 sidebar collapses

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

Change 859591 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Bug: Fix when Vector 2022 sidebar collapses

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

Jdlrobson added a subscriber: ovasileva.

@ovasileva this one came up while I was analysing T322051 (was a one line change) so moving into board and into QA.

Jdlrobson renamed this task from Vector 2022 sidebar is automatically collapsed on exactly 1000px breakpoint to [Unplanned] Vector 2022 sidebar is automatically collapsed on exactly 1000px breakpoint.Thu, Dec 1, 9:20 PM
Jdlrobson assigned this task to Edtadros.
Jdlrobson set the point value for this task to 1.