Page MenuHomePhabricator

On wide screens the main text area unexpectedly gets narrower as the window width increases
Closed, InvalidPublic

Description

I'm using a wide screen. Starting with a narrow browser window, and gradually pulling the window out to make it wider, this is what happens, in order:

  1. The text initially flows around the infobox, contents list and images, which all fit within the window boundaries (expected)

  1. The white margins get gradually wider (expected)

  1. The infobox and the right-hand images suddenly pop out of the text area into a new right margin, cutting into the overall width. The text area becomes narrower (not expected)

  1. Finally, the contents list and left-hand images suddenly pop out of the text area into a new left margin, cutting further into the overall width. The text area becomes narrower again (not expected), and at the same time the font size of the main text increases (not expected).

On my screen, with a typical article [[Selwyn College, Cambridge]], at level 1 the text area has a width of 23 cm, with 13 words fitting into the first line. By level 4, there is a much narrower text area of only 9 cm, and with the larger font only the opening 3 words of the lead will fit into the first line.

The result is that when I need to use a wide browser window, because for example I'm looking at Google maps, I can't use that same window for Wikipedia at all (because when I switch to a Wikipedia tab the page has become pretty well unreadable). This is surely not useful behaviour.

In case it's relevant, I'm using Firefox 81.0 on a Mac.

Event Timeline

@MichaelMaggs thanks for flagging this. Would you be able to do a video screen capture as you increase and then decrease the width of your browser? For me the width of the column remains consistent (also using Firefox on a Mac). I wonder if there are any user scripts or gadgets you have enabled that could be affecting this?

narrowmediumwide

Sure, happy to do that. Is there somewhere else I can upload the screen capture? It's 40 seconds, and comes out at 114MB which is apparently too big to upload here.

I think my 'wide' is wider than yours, which is pehaps why you don't reach level 4. I'm not aware of any potentially interfering scripts or gadgets.

For me, the overall width of the total viewable area reamains constant at about 35 cm, but with a wide browser window (level 4) much of that is taken up with new left and right 'internal' margins, containing the images, infobox and contents list, which leaves only 9 cm for the actual text.

Sure, happy to do that. Is there somewhere else I can upload the screen capture? It's 40 seconds, and comes out at 114MB which is apparently too big to upload here.

Thanks. People often use this tool and then provide a link to the upload: https://imgur.com/upload

@MichaelMaggs thanks for posting the video. That looks to me like the result of some custom CSS. Would you mind trying as a logged-out user, and also in an private/incognito window to see if the same thing happens?

So far as I can tell, it's not possible to see the new desktop when logged out, is it? But here are the other two tests:

  1. Private Firefox window. I see exactly the same effect: https://imgur.com/04dZoZ7
  1. With https://en.wikipedia.org/wiki/Selwyn_College,_Cambridge?useskinversion=2&safemode=1. This is different. I no longer see the images popping out to left and right. Also, hiding the left toolbar now also removes the left margin, moving everything over to the left: https://imgur.com/4IWJtrL

Thanks for testing! If https://en.wikipedia.org/wiki/Selwyn_College,_Cambridge?useskinversion=2&safemode=1 works as expected, then the problem seems to lie in some custom on-wiki code. You may want to check and edit https://en.wikipedia.org/w/index.php?title=User:MichaelMaggs/common.js

Proposing to close this task as invalid, as it seems that nothing can be done or fixed in the Desktop Improvements codebase itself to avoid this problem...

@MichaelMaggs you can see the new desktop version as a logged-out user by adding ?useskinversion=2 to the end of the URL, or by viewing a page on one of our test Wikis (e.g. French). Sorry for not mentioning this before.

So either visit:

Ok, many thanks for checking. I’ll investigate the common.js file

Curiouser and curiouser...

I still see the same effects on my wide screen Mac Pro, even after temporarily blanking common.js, clearing the cache, and re-booting just to be sure. I don't understand what else could cause this. Could it be something computer or screen-related, as this is not an issue on my laptop? That works entirely as expected, even though it is presumably pre-loading the same stuff from Wikimedia servers.

The most distinctive feature, even at small widow widths, seems to be that when the left toolbar is hidden it disappears but the left margin doesn't close up. That remains the same width, but is then blank. On my laptop, the left margin does close up.

@MichaelMaggs did you try the links I provided in an incognito window?

I’ve repeated everything in a new private Firefox window, while my common.js page is still blanked:

  1. Visiting https://en.wikipedia.org/wiki/Selwyn_College,_Cambridge in the usual way, while logged in: I see this issue as mentioned above (https://imgur.com/04dZoZ7)
  1. Visiting https://en.wikipedia.org/wiki/Selwyn_College,_Cambridge?useskinversion=2&safemode=1 while logged in: again as above the issue vanishes (https://imgur.com/4IWJtrL)
  1. Visiting https://en.wikipedia.org/wiki/Selwyn_College,_Cambridge?useskinversion=2 while logged out. The issue vanishes again.

I’ve also tried a normal logged-in view of https://en.wikipedia.org/wiki/Selwyn_College,_Cambridge on both Chrome and Safari, and I see the problem on both, which seems to suggest it’s not something specific to my Firefox instance on that one machine.

@MichaelMaggs it seems clear that this issue is related to some kind of configuration within your account, rather than being a general issue. I would suggest reviewing any gadgets you have enabled, also look into global settings. Going to close this out. Sorry we couldn't be more helpful in locating your specific issue.