Page MenuHomePhabricator

Show syntax highlighting on View Source/protected pages
Closed, ResolvedPublicFeature

Description

Feature summary (what you would like to be able to do and where):

I would like to see syntax highlighting on View Source/protected pages.

Use case(s) (list the steps that you performed to discover that problem, and describe the actual underlying problem which you want to solve. Do not describe only a solution):

I wanted to try to analyze the template code of Template:Community Wishlist Survey/Proposal header but it was really hard to do because the page is protected and the View Source code does not have syntax highlighting:

image.png (969×964 px, 138 KB)

So I was forced to copy and paste the code into an editor that did have syntax highlighting:

image.png (995×663 px, 124 KB)

Benefits (why should this be implemented?):

Users looking at protected templates will be able to better-understand them.

Acceptance criteria

  • WikiEditor should now load on read-only wikitext pages. (i.e. if you're logged out or not an admin on Beta enwiki, try https://en.wikipedia.beta.wmflabs.org/wiki/Main_Page?action=edit)
  • The WikiEditor toolbar should contain only the CodeMirror toggle, and no other buttons
  • CodeMirror should be enabled on page load only if the user has the preference set (via the toggle button in the toolbar)
    • Logged out users always have CodeMirror disabled on page load
  • The textarea is read-only, but not editable – meaning you will have a cursor and be able to do all the things you can do in CodeMirror, but you can't actually change the content.

QA Results - Beta

Related Objects

StatusSubtypeAssignedTask
ResolvedFeatureMusikAnimal
OpenNone
ResolvedGoalMusikAnimal
ResolvedFeatureMusikAnimal
ResolvedMusikAnimal
ResolvedMusikAnimal
ResolvedMusikAnimal
ResolvedBhsd
ResolvedBUG REPORTBhsd
ResolvedMusikAnimal
ResolvedMusikAnimal
OpenNone
ResolvedTheresNoTime
ResolvedMusikAnimal
ResolvedBUG REPORTBhsd
ResolvedMusikAnimal
ResolvedBUG REPORTMusikAnimal
ResolvedBUG REPORTFunc
ResolvedBUG REPORTMusikAnimal
DeclinedNone
ResolvedBUG REPORTFunc
ResolvedBUG REPORTFunc
ResolvedMusikAnimal
ResolvedMusikAnimal
ResolvedMusikAnimal
ResolvedMusikAnimal
ResolvedMusikAnimal
ResolvedBhsd
OpenMusikAnimal
ResolvedMusikAnimal
ResolvedBUG REPORTBhsd
ResolvedFeatureBhsd
ResolvedMusikAnimal
ResolvedMusikAnimal
ResolvedMusikAnimal

Event Timeline

There is no wikiEditor loaded for readonly text areas (please refer to T41577 for more information), which means there is currently no icon button to switch on/off CodeMirror.

@Lectrician1 The Commtech team reviewed this today and we thought this would make a good proposal.

That old task T41577: Toolbar shouldn't appear in view source if page is protected was also talking about the RefToolbar gadget on enwiki, which is what was allowing it to insert text in the protected page. WikiEditor when enabled on protected pages doesn't allow anything to be changed in the textbox (or rather TextSelection, which is used by WikiEditor and CodeMirror, doesn't).

It's reasonably easy to enable WikiEditor on readonly editing forms, but the buttons will (mostly) be non-functional. Is that okay? I suspect it is, as it's how CodeEditor does things too. We could disable the built-in obviously non-useful buttons (formatting etc) but it's trickier to do that in a general way I think — CodeMirror of course should remain enabled, and possibly the new Preview button. Alternatively, we could de-couple CodeMirror from WikiEditor and show syntax highlighting without the toolbar.

Change 891089 had a related patch set uploaded (by Samwilson; author: Samwilson):

[mediawiki/extensions/WikiEditor@master] Load WikiEditor on readonly edits (e.g. protected pages)

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

It's reasonably easy to enable WikiEditor on readonly editing forms, but the buttons will (mostly) be non-functional. Is that okay? I suspect it is, as it's how CodeEditor does things too.

I think we should be careful here. CodeEditor has a much more limited audience, who are all much more familiar with MediaWiki, so they know what 'view source' implies. The buttons used by CodeEditor are also far less related to editing (most have to do with the view).

This editor however can be encountered by any and all editors (including anonymous editors) and I would expect "why does pressing this button not work"-feedback from that audience.

Ideally we'd disable buttons that don't work, but buttons for WikiEditor 2010 have no disabled variant (it was made before stuff was designed to such levels). I'm not even sure there is a disabled state to begin with.

This is also a 2023 CWS wish. I think it should not be implemented before the survey concludes, so that any eventual suggestions by the voters can be addressed.

Yes, absolutely, you're both right. I didn't mean to rush ahead here! I was just looking into it briefly and thought I'd upload the patch just for interests' sake. Nothing will be done till we're actually sure we want to do it! :-)

Okay, thanks for making the patch WIP!

Change 891089 abandoned by Samwilson:

[mediawiki/extensions/WikiEditor@master] Load WikiEditor on readonly edits (e.g. protected pages)

Reason:

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

MusikAnimal subscribed.

Should be much easier with the advent of CodeMirror 6, which is currently in development.

Change 989260 had a related patch set uploaded (by MusikAnimal; author: MusikAnimal):

[mediawiki/extensions/CodeMirror@master] CodeMirror 6: show wikitext highlighting on protected pages

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

Asking as my search failed, is there a related task (even declined) to allow for starting up the editor on a protected page to make use of the preview function, for pages that you do not have permissions to edit?

Asking as my search failed, is there a related task (even declined) to allow for starting up the editor on a protected page to make use of the preview function, for pages that you do not have permissions to edit?

Not that I remember. There are several UX problems that would present for having the editors load for pages that you are not actually able to edit. It's not a concept that is very common in other software and generally there are workarounds available (Special:ExpandTemplates and /sandbox). The only place where I have truly found a use for it, is with Template Sandbox previews, but that is a pretty niche group of users.

It was raised by @Tacsipacsi that there should be a way to turn off CodeMirror in this situation, out of respect for users with low-end devices. Provided CodeMirror 6 is fast enough (it should be, n.b. T303664), are there any concerns with having no way to turn it off? I feel like loading WikiEditor and running all its hooks etc. could cause more of a strain than just vanilla CodeMirror, and certainly require more bandwidth. The other option is to introduce a new toggle component for this situation (where we don't use WikiEditor).

r989260 does respect the usecodemirror preference, at least. On that note -- With CodeMirror 6, we no longer require WikiEditor to get syntax highlighting, so I was thinking it might make sense to add a checkbox for usecodemirror under "Accessibility" in preferences. That way, logged-in users have a way to turn it off without having to use WikiEditor, which I think makes sense if we're going to add CodeMirror to more non-WikiEditor places.

Thoughts?

Provided CodeMirror 6 is fast enough (it should be, n.b. T303664), are there any concerns with having no way to turn it off?

I’m once again judging by my CodeMirror 5 experience, but I have two issues in addition to performance:

  • Text I select when CodeMirror is active isn’t considered a primary select, i.e. I cannot paste it somewhere with a middle click on Linux. (This works in Flow and probably anywhere else where VisualEditor’s wikitext editor is used. It may also work in CM6.)
  • It took me quite some time to figure out how to configure a browser extension I have to not handle it as if it was a rich text editor (since contenteditable is usually a rich text editor) and behave as if it was a plain