Page MenuHomePhabricator

Show Preview always scrolls to the top of the page regardless of preview location
Open, Needs TriagePublic

Description

Background
I have CodeMirror installed on a 1.27.1 version of MediaWiki. It works well enough that I would like to keep it. However, there is one quality of life issue that constantly annoys me. As the site administrator, I'm often working on complex templates or making large changes. I hit the Show Preview button almost reflexively after every change and I'm used to being scrolled directly to the preview. I have my preview set to display BELOW the editor. This is for a few reasons but the option exists in MediaWiki preferences so it should be supported.

The Problem
When I press Show Preview with CodeMirror enabled I'm scrolled immediately to the top of the page. Since my preview location is below the editor, this means that I'm scrolled to the editor, basically where I was already, and not to the preview.

The Expected Behavior
When the Show Preview button is pressed the window should scroll to the top of the preview wherever it is located. This is the normal behavior in MediaWiki.

Steps to reproduce the issue:

  • Set the preview to display below the editor (Preferences > Editing > Preview > Uncheck "Show preview before edit box")
  • Edit a page (article, category, any page)
  • Enable CodeMirror if it is not enabled by default
  • Press Show Preview (shortcut: alt + shift + p)

This should cause the page to scroll to the top instead of to the page preview.

Event Timeline

Restricted Application added a project: Community-Tech. · View Herald TranscriptJun 3 2018, 10:03 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript

Hi @CptTwinkie, thanks for taking the time to report this and welcome to Wikimedia Phabricator!

I have CodeMirror installed

Which exact version and branch of it?

on a 1.27.1 version of MediaWiki.

Unrelated: Please upgrade to a supported version (currently: 1.27.4) which has many security issues fixed.

I can confirm this behaviour in the master branch of CodeMirror and MediaWiki, and the latest version of Chrome (MacOS).

I believe normally your browser automagically knows to scroll the textarea to where it previously was. With CodeMirror, the visible editing window is a separate DOM element that is not a true textarea. The CodeMirror JavaScript does keep track of the scrolling position but I'm not sure how we could persist this across requests outside local storage or something.

@CptTwinkie As a workaround, you could install a script that uses AJAX to show a preview, rather than the native system which does a full page refresh. This might also improve your workflow in general. On WMF wikis I use https://en.wikipedia.org/wiki/User:Anomie/ajaxpreview.js and it works well. I think this version of the script will work on your wiki (but I agree with Aklapper that you should consider upgrading).

Let me apologize... I think I misread the issue. For some reason I thought we were talking about the scroll position within the textarea.

I actually cannot reproduce your issue. With CodeMirror turned off, I am still brought to the top of the page on preview.

Anyway, I think the same solution may help: Using some form of AJAX preview will keep your scroll position intact, which should at least bring you closer to the preview area. I've also been informed there is a core solution for this. In your Editing preferences, look for "Show previews without reloading the page". Not sure if this is available in MW 1.27, but if not you could try the aforementioned user script.

Vvjjkkii renamed this task from Show Preview always scrolls to the top of the page regardless of preview location to 0pbaaaaaaa.Jul 1 2018, 1:06 AM
Vvjjkkii triaged this task as High priority.
Vvjjkkii updated the task description. (Show Details)
Vvjjkkii removed a subscriber: Aklapper.
CommunityTechBot raised the priority of this task from High to Needs Triage.
CommunityTechBot renamed this task from 0pbaaaaaaa to Show Preview always scrolls to the top of the page regardless of preview location.
CommunityTechBot added a subscriber: Aklapper.

I have the same frustration but with the opposite (default) preferences. I love the feature, but usually disable it because this issue is too annoying.

I.e. Whenever I click preview (usually 1-10 times per edit) in the 2010 wikitext editor, I expect it to scroll to the top of the Previewed-content (per CptTwinkie) which for me is at the top of the screen; however with Codemirror enabled, it actually loads the preview and then a second later it scrolls the window all the way down to the text-area.

p.s. I suggest retitling this bug "Show Preview always scrolls to the top of the textarea" which I think covers both scenarios. But i'm not 100% sure (need more coffee).