Page MenuHomePhabricator

Add CodeMirror integration in WikiLambda as an alternative to CodeEditor
Open, Needs TriagePublic

Description

There are efforts to explore MediaWiki-extensions-CodeMirror as an alternative for CodeEditor across the wikiverse. CodeMirror integration in WikiLambda would be required for this effort to be feature-complete.

There appears to be a Vue component that is a wrapper around Ace/CodeEditor. It looks like it currently is meant to support Python and JavaScript. This would require Python be added as a mode in CodeMirror.

Additionally, we'll need configuration flags to control the use of CodeMirror over CodeEditor. Other extensions are doing this with a pair of flags, which in this case would be $wgWikiLambdaUseCodeEditor and $wgWikiLambdaUseCodeMirror.

Event Timeline

Jdforrester-WMF subscribed.

We sadly don't extend CodeEditor yet, as no-one has done T289097: CodeEditor extension should provide a Vue component of the Ace editor (so WikiLambda doesn't have to) for us. If you could build the equivalent in CodeMirror, we could switch to that!

We sadly don't extend CodeEditor yet, as no-one has done T289097: CodeEditor extension should provide a Vue component of the Ace editor (so WikiLambda doesn't have to) for us. If you could build the equivalent in CodeMirror, we could switch to that!

Okay! Do we want a dedicated ResourceLoader module for the Vue component? Or could we get by with WikiLambda loading it via $wgExtensionAssetsPath? I'm just trying to think ahead when CodeMirror has a ton of modes like CodeEditor currently does.

I see the current Vue component allows for changing the theme. This is not supported yet in CodeMirror (T163533). My impression thus far is users generally don't care about themes beyond a dark mode, which CM does support. So, I wasn't planning to implement more themes unless there is demand. Does WikiLambda have any particular need for themes?

We sadly don't extend CodeEditor yet, as no-one has done T289097: CodeEditor extension should provide a Vue component of the Ace editor (so WikiLambda doesn't have to) for us. If you could build the equivalent in CodeMirror, we could switch to that!

Okay! Do we want a dedicated ResourceLoader module for the Vue component? Or could we get by with WikiLambda loading it via $wgExtensionAssetsPath? I'm just trying to think ahead when CodeMirror has a ton of modes like CodeEditor currently does.

A dedicated module would probably make most sense.

I see the current Vue component allows for changing the theme. This is not supported yet in CodeMirror (T163533). My impression thus far is users generally don't care about themes beyond a dark mode, which CM does support. So, I wasn't planning to implement more themes unless there is demand. Does WikiLambda have any particular need for themes?

We're not changing the theme? We're just setting Ace to use its default, which is needed to start things up. OTOH, if CodeMirror needs to have a different theme related to dark mode support maybe it is needed?