Commit graph

538 commits

Author SHA1 Message Date
bhsd 0e0e4927ab codemirror.mediawiki.js: add Mod-Shift-x
This patch adds a keyboard shortcut `Mod-Shift-x` to toggle between left-to-right (LTR) and right-to-left (RTL) text directions.

Bug: T170001
Change-Id: Ia857ad0b0aff0bb206b45e4d27dee6e91a3effce
2024-07-20 17:29:09 +08:00
MusikAnimal 08730d2a85 CM5 mediawiki.less: Inherit font color from skin
This is a short-gap measure to make the 2017 editor + dark theme more
readable. Implementing a dark theme for all of the MediaWiki tokens will
come in a future patch.

Bug: T365311
Change-Id: Ie56b88960eb0d27e9a1f821101dfa14af37c0130
2024-06-25 00:43:18 +00:00
Ed Sanders b3316356c0 Remove unnecessary local context variables
Change-Id: If73c0cfca93711003ece3332c9cdc6f3e3fa4944
2024-06-22 10:26:58 +01:00
Ed Sanders f0fb93d3e1 ESLint: Enforce prefer-const
Change-Id: I7f45137a47dddcd2fc70201f28680edce907b522
2024-06-22 10:26:58 +01:00
Ed Sanders 1b101f09ee ESLint: Update syntax to ES6 and autofix
Change-Id: I613cc64a9bf3f375a40f75a1441b83f181a2ab42
2024-06-22 10:26:58 +01:00
Ed Sanders 6958b99f2e build: Update eslint-config-wikimedia to 0.28.2 and autofix
Change-Id: I622f53bf5f56782b7a0529cdc6bb27c1315ff5a0
2024-06-17 13:02:26 +00:00
MusikAnimal 293a15725d ext.CodeMirror.visualEditor: check language dir of html for new pages
New pages do not have body content yet, so the LTR check added with
If3825d6e54 failed. This commit adds the document root (<html> element)
as the fallback, so CodeMirror can be used on new pages.

This is just a quick fix. CM6 for VE 2017 wikitext editor is almost
done, and that will come with RTL support (T357482).

Bug: T366201
Bug: T363752
Follow-Up: If3825d6e5467d2bcff2d83e838081bf041243920
Change-Id: I9d4a4b817ac2462396c159ceae6f1510c0fae64d
2024-05-30 23:48:05 -04:00
MusikAnimal 7856e62dea CodeMirror: +rectangularSelection and crosshairCursor as def extensions
These were default in CM5

To be added to the preferences panel once that's a thing (T359498)

Change-Id: I5a8b330444dd2dff0acfbd8e2d429a5b5273cd61
2024-05-21 22:52:08 -04:00
MusikAnimal 0e5fe342d9 CodeMirror: make bracket matching match CJK full-width brackets
This is only done for wikitext because CJK brackets can cause unexpected
errors in other languages.

Bug: T362992
Change-Id: Icf98e8fd7e0392845df2e3b7d3201e7f94f95a3f
2024-05-21 23:17:43 +00:00
jenkins-bot b23a901106 Merge "CM6: Add 'ext.CodeMirror.input' hook; improve code examples" 2024-05-14 01:48:35 +00:00
jenkins-bot d594143c04 Merge "CM6: Rework ResourceLoader modules" 2024-05-14 01:23:01 +00:00
jenkins-bot f4e9eb38e2 Merge "ext.CodeMirror.visualEditor: don't load on RTL pages" 2024-05-13 23:46:31 +00:00
MusikAnimal c873f9d9fa ext.CodeMirror.visualEditor: don't load on RTL pages
CodeMirror 5 does not work on RTL pages. This commit does a crude check
of the `dir` attribute of `.mw-body-content .mw-parser-output` because
the VisualEditor surface and even the native textarea isn't available
when the module is first loaded.

Bug: T363752
Change-Id: If3825d6e5467d2bcff2d83e838081bf041243920
2024-04-29 15:31:23 -04:00
bhsd 52471d4b8f CodeMirrorModeMediaWiki: one-line definition list
Add highlighting for a special one-line definition list syntax `;a:b`. Also highlight `;a` in bold.

Bug: T170042
Change-Id: Ia3bdf481469368fcb5a7651729dde4b5f3682ed8
2024-04-29 09:44:27 +08:00
MusikAnimal 2aa6d5c564 CM6: Add 'ext.CodeMirror.input' hook; improve code examples
A 'ext.CodeMirror.input' hook is added to give integrations direct
access to the ViewUpdate object when changes are made in CodeMirror.

Bug: T174811
Change-Id: Idb6166996abb7d64ac8a956f362aea5eda0392bc
2024-04-18 16:33:32 -04:00
MusikAnimal c853e9587d CM6: Rework ResourceLoader modules
Documentation is at https://w.wiki/9kxt

The idea is that modules ending in `.init` imply they initialize
CodeMirror and maniuplate the DOM. The others only export classes for
use in integreations.

In doing so, 'ext.CodeMirror.v6.WikiEditor' now only exports the
CodeMirrorWikiEditor class, while 'ext.CodeMirror.v6.WikiEditor.init'
is added for use on #wpTextbox1 through action=edit.

Bug: T174811
Change-Id: Iec62ac9dc77918904bed886d2d46ccc03e0927f7
2024-04-15 12:40:16 -04:00
MusikAnimal 3339cbb3a5 CodeMirrorModeMediaWiki: put bidi isolation behind URL feature flag
Bidi isolation is still not exactly 'stable'. Instead of removing it, we
look for the URL query param `cm6bidi=1`. This allows users to test out
bidi isolation and give feedback as we iterate on it. Once stable, this
should be removed and bidi isolation should be on by default -- and
eventually, can be opted out of via CodeMirror preferences (T359498).

Bug: T358804
Change-Id: If7e024f0da71ddf1b0a38c0fc49f033ddbe745fd
2024-04-14 17:05:39 -04:00
MusikAnimal fcb7633eb1 CodeMirrorModeMediaWikiConfig: add missing TagStyle for cm-mw-link
The number sign in `[[Link#Section]]` is supposed to have the class
.cm-mw-link, but didn't because it was missing a TagStyle which actually
gives it the CSS class. Now it does.

Add test case for all known CSS classes.

Bug: T348019
Follow-Up: I8f8a81f362bed60dea14ecde9487a2b0c89225e8
Change-Id: I613f8bead76523fbe1a9f05ed75d81893b8737d3
2024-04-11 14:02:24 -04:00
jenkins-bot b97d51ff51 Merge "CM6: Add syntax highlighting preference for users without WikiEditor" 2024-04-11 14:00:05 +00:00
jenkins-bot f609267612 Merge "Remove wait for DOM ready before attach to hook 'wikiEditor.toolbarReady'" 2024-04-10 13:05:49 +00:00
MusikAnimal f3f46d8e05 CM6: Add syntax highlighting preference for users without WikiEditor
This adds the `ext.CodeMirror.v6.init` ResourceLoader module which
allows use of CodeMirror on `#wpTextbox1` without the use of WikiEditor
(the 'usebetatoolbar' preference). In order for users to opt-in to using
CodeMirror, we make the existing 'usecodemirror' option into a visible
preference. In addition, with two preferences related to CodeMirror, we
group them under a new heading 'Syntax highlighting'. More preferences
may be added later to this section following T359498.

When WikiEditor is not enabled, the layout of the action=edit page has
the textarea as a sibling to other visible content, like `.editOptions`.
Because of this, we can't simply append the CodeMirror DOM to the parent
like we were before, as that would put the visible editor beneath the
edit summary, Publish button, etc. Instead we rework the CodeMirror to
first add a wrapper around the textarea and use that as the parent. This
way, `.cm-editor` is always in the same place in the DOM as the native
textarea.

Line wrapping and focus/blur events are also moved to CodeMirror, as
these are needed when not using WikiEditor.

Bug: T190108
Change-Id: I4bc069e0d398aa7088e4f50bbd0ddda458b289c3
2024-04-09 22:05:20 -04:00
MusikAnimal e1f397f048 CodeMirrorBidiIsolation: fix for when the tag is the first element
This fixes a careless error introduced in I1338afeefa where we don't do
a strict equality test and thus if the tag is the first element (at
position 0), the following bracket is also treated as the start
position. Here we simply do a strict equality test against null (the
reset value), and viola, several issues are fixed.

Bug: T358804
Change-Id: I86021d363ecc33a7551bc887439dc1902914026f
2024-04-09 22:04:45 -04:00
jenkins-bot ffef86bb36 Merge "CodeMirror 6 template folding: foldAll" 2024-04-10 01:39:53 +00:00
MusikAnimal efd6682398 CM6: ensure search panel is in the same direction as the interface lang
We don't have access to the HTML attributes for .cm-panels, so we just
use CSS to set the direction.

Bug: T359611
Change-Id: I1d40ae4f7dc093f585051d388c70cde151faa5e6
2024-04-09 19:20:18 -04:00
MusikAnimal 512403afa7 CodeMirrorWikiEditor: add Realtime Preview handler
Realtime Preview is unique to WikiEditor, so we only add support in
CodeMirrorWikiEditor.

Bug: T360708
Change-Id: I2122a114359c74d311777b5f2872149e64d95254
2024-03-26 13:36:30 -04:00
MusikAnimal 432e868f2e CodeMirror: copy tabindex attribute from textarea
The Tab key should navigate to the edit summary from the editor, or to
the Realtime Preview pane if it is open.

Change-Id: I7810bfd098f6b9dd5afab9aa534685d3e4166af6
2024-03-26 13:36:18 -04:00
MusikAnimal 6be3bf62f0 CM6: add destroy method, fix removal of textSelection, add more hooks
CodeMirror is meant to be used without WikiEditor, so we add a destroy()
method that does much the same things as CodeMirrorWikiEditor.

The hooks added with this patch aren't used by anything yet, but offer
feature parity with CodeMirrorWikiEditor, which fires the
'ext.CodeMirror.switch' hook. That hook can't be moved for
backwards-compatibility reasons.

The actual fix for T360075 here was to nullify the `textSelection` class
property.

Bug: T360075
Change-Id: Ife6a3f1ef90df66cd1bf8bab33c9ef3b39ed17a0
2024-03-26 13:35:58 -04:00
MusikAnimal d652f3d2a2 CM6: Add jsdoc build step, fix JSDoc annotations, and add @stable tags
There is a known bug with JSDoc and using `export default`. These must
be separate statements for JSDoc to parse properly.
See https://github.com/jsdoc/jsdoc/issues/1132

Update README; change log now lives on the wiki.

Bug: T359986
Depends-On: I58a0766e35eddaf7bebe2c080757bb09963d8555
Change-Id: Ibc2212ef9eab512511b13a99ecc2ccbda8c52ece
2024-03-26 13:35:47 -04:00
bhsd 351d24d7a4 CodeMirror 6 template folding: foldAll
Add a command `foldAll` using CM6's default keymap.

Bug: T30684
Change-Id: I2e26e5c0c00b23086e390d4ca5ab8c68cff73640
2024-03-24 01:07:28 +08:00
MusikAnimal ca02360228 CM6: Switch to using Rollup instead of Webpack; make RL-compatible
See https://w.wiki/9Twh for example usage with ResourceLoader.

Webpack is retired in favor of Rollup, which allows us to convert the
ECMAScript Modules into CommonJS modules for use by ResourceLoader.
We now have a file in dist/ for each RL module that we want to offer,
including the 'lib' module which includes the CM library itself.

Because Rollup has no knowledge of the ResourceLoader module registry,
the generated output requires other modules via relative path, when it
needs to be the RL module name. To get around this, we do a crude
find/replace after the files are generated. Hacky, but necessary to make
CodeMirror usable by gadgets and scripts that don't also want
WikiEditor.

Add new RL modules 'ext.CodeMirror.v6.lib' (vendor code) and
'ext.CodeMirror.v6' (the main CodeMirror class, sans WikiEditor).

Clean up extension.json, listing the v6 modules beneath the old ones.

Bug: T214989
Change-Id: Ide716247e545cf2bdd977bea645729564ebbe6e2
2024-03-19 22:48:52 -04:00
MusikAnimal 00f947e97f CM6: move bidiIsolation to be part of CodeMirrorModeMediaWiki
The extension is custom built for MediaWiki (i.e. handling of extension
tags like <ref> that aren't HTML tags), so it only makes sense to bundle
it as part of the MediaWiki language mode.

Resultantly, we can no longer check the direction of the textarea where
we enable bidi isolation, because the language mode should have no
knowledge of the textarea. Instead we offer a `config` object (akin to
other language modes offered by CodeMirror), with currently only one
option: `bidiIsolation`. It is the responsibility of the caller to
enable this where desired.

Also make templateFolding and CodeMirrorModeMediaWiki use
`export default` since they both only export one thing.

This commit is in preparation for Ide716247e5, where we need bidi
isolation separated from the CodeMirror class due to its dependency on
CodeMirrorModeMediaConfig.

Bug: T358804
Bug: T214989
Change-Id: If3211bd259bd7833919a627faabd86ae7aa81b53
2024-03-19 22:48:34 -04:00
MusikAnimal b18ded0a13 CM6: move more Extensions to CodeMirror so they don't require WikiEditor
We want CodeMirror to be usable outside WikiEditor. This commit moves
the more critical extensions from the CodeMirrorWikiEditor class to the
parent CodeMirror class.

The linked tasks are only broadly related. In Ide716247e5 we will
introduce a ResourceLoader module that makes CodeMirror usable on any
textarea.

Bug: T214989
Bug: T190108
Change-Id: Ib199cf700c3235812f7c9a9bcb3703917f0887de
2024-03-19 22:48:17 -04:00
jenkins-bot ffa569a472 Merge "CM6: put template folding behind feature flag and rework config settings" 2024-03-19 05:45:49 +00:00
Derk-Jan Hartman fbf02b1dc2 Remove dependency on jquery.ui from CodeMirror
Now that RTP has been enabled for a while, we no longer need this and
jquery.ui is deprecated.

Bug: T323329
Change-Id: Idbb92bd4f18e2c6e0adc51d1a3fa909efc129686
2024-03-18 22:19:08 +00:00
Fomafix ea21513d07 Remove wait for DOM ready before attach to hook 'wikiEditor.toolbarReady'
The hook gets fired after DOM ready.

Change-Id: I658c6a45de213653303c3374a431fc3dc246b72a
2024-03-16 09:18:24 +00:00
MusikAnimal 7e9d90bb52 CM6: put template folding behind feature flag and rework config settings
Template folding is likely going to be a big 'hit' of a feature, but not
everyone will want it. Until CodeMirror prefs are introduced (T359498),
we need a way to control the rollout of template folding. This commit
adds $wgCodeMirrorTemplateFoldingNamespaces which acts similar to the
existing $wgCodeMirrorLineNumberingNamespaces.

We also move template folding to be part of CodeMirrorModeMediaWiki,
since the feature is unique to MediaWiki wikitext.

Move configuration settings to be part of the DataScript, thus removing
the need for the ResourceLoaderGetConfigVarsHook (which unnecessarily
makes the config settings available on every page load).

Other minor changes like adding missing JSDoc blocks.

Bug: T30684
Change-Id: I67518c0968f64c79e290f57b4884d30a161212d3
2024-03-14 23:54:39 -04:00
jenkins-bot 6b2edf37a6 Merge "Remove WikiEditor toolbar z-index override" 2024-03-15 00:27:42 +00:00
Ed Sanders a4027375c3 Remove WikiEditor toolbar z-index override
Upstreamed in I85ca9727b0

Bug: T360084
Change-Id: Ic87b8c377cb9c68f97009070525284b7cd95c933
2024-03-14 10:16:26 -07:00
MusikAnimal 911b2d3d46 CodeMirror: add 'dir' and 'lang' attrs to .cm-editor and not .cm-content
Before we were adding these attributes to .cm-content, which didn't
encompass the gutter (line numbers). When you edited a LTR page in a RTL
interface language (or vice versa), the line gutter appeared on the
wrong side, which caused the cursor to be misaligned.

This commit fixes this by applying the direction and language to the
entire editor (.cm-editor), and not just .cm-content. However this means
the search panel could be in the page language when it should be the
interface language. This will be addressed in a follow-up patch.

Other attributes like 'class' that are copied from the textarea must
remain on .cm-content, because the parent .cm-scroller would otherwise
override them.

Bug: T359589
Change-Id: Id805944231fd75c1dc1c336e3cd4c7bc5c42c036
2024-03-13 11:19:16 -04:00
MusikAnimal aa3876a97e CodeMirrorWikiEditor: Remove hack to fix height in WikiEditor
WikiEditor's ResizingDragBar makes the editor resizable, so we need to
set the height to 100%. This was attempted in Ib49d1d9e71 and
I4deeda192b but both ultimately suffer from race conditions. Instead
we're setting the height in WikiEditor with Ia5e9767e08.

The heightExtension in the CodeMirror class still remains, in the event
a subclass wishes to override the default behaviour in CM directly and
not with CSS.

Bug: T357794
Depends-On: Ia5e9767e0814eac29d58bc0d9c1023344a29dd84
Change-Id: Ic55dd098d70fd173ddee7100e392b889ee6ddd08
2024-03-13 11:18:20 -04:00
jenkins-bot c63e81539a Merge "CodeMirror: fix implementation of jQuery.textSelection encapsulate" 2024-03-13 00:28:26 +00:00
jenkins-bot 8dd82a8b86 Merge "CodeMirror 6: show wikitext highlighting on protected pages" 2024-03-12 18:47:28 +00:00
jenkins-bot 6281f799c8 Merge "CodeMirror 6: Add bidi isolation to HTML tags" 2024-03-12 18:47:22 +00:00
MusikAnimal d927b01ec1 CodeMirror: fix implementation of jQuery.textSelection encapsulate
In Idc0abb64eb we added support for 'encapsulateSelection' and multiple
cursors, but broke other jQuery.textSelection functionality in the
process. In this commit, we move the logic to a dedicated class, and
more fully and accurately mimic the native implementation.

All functionality in WikiEditor should now be supported.

Bug: T359671
Follow-Up: Idc0abb64eb036fa4a60382aca401d1dba1722405
Change-Id: I9b947d80616bd4c4372b981b2271a281d1fc0252
2024-03-11 17:38:20 -04:00
MusikAnimal 63cd3e4ff8 CodeMirror 6: show wikitext highlighting on protected pages
It is necessary to have a way to toggle CodeMirror on and off, so we use
WikiEditor and hide all other buttons. This is more costly than loading
just vanilla CodeMirror, but it ensures a consistent experience with
pages that are editable, with the toggle button in the familiar place.
At a later time, WikiEditor may be updated to better support read only
pages in a lightweight fashion (T188817).

Bug: T301615
Change-Id: I8ea7597d07ff60a3f58ba306d2d6d12d3ec08b16
2024-03-11 17:35:20 -04:00
MusikAnimal 18a92122ef CodeMirror 6: Add bidi isolation to HTML tags
HTML tags and similar markup may appear jumbled on RTL pages due to the
standard algorithm used for character placement. With this patch, we
detect all tags (HTML or MediaWiki-supplied) and wrap them with
<span class=cm-bidi-isolate>. This CSS class forces the content to be
LTR, making the tags easier to work with on RTL pages.

Bug: T358804
Change-Id: I1338afeefa16102d5cc8fd6c8a236c144e5cf81f
2024-03-11 17:34:41 -04:00
Volker E 0e0e55e143 styles: Replace error color with #d73333
This patch promotes a consistent design decision across projects in
MediaWiki core, extensions, and skins. The darker red color meets the
W3C Web Content Accessibility Guidelines (WCAG) at Level AA that text
or images of text must have a contrast ratio of at least 4.5:1.

Bug: T343239
Change-Id: Id66e6636e2237ae956d3c0e4821e862f875a6e30
2024-03-11 22:03:30 +01:00
bhsd 506d998767 CodeMirror 6 template folding
This patch adds an icon displayed above the cursor inside a template. By clicking it, the template parameters become hidden and replaced by three dots, while the template name remains visible. Clicking the dots will unfold the template. New key bindings include fold (Ctrl-Shift-[/Cmd-Alt-[), unfold (Ctrl-Shift-]/Cmd-Alt-]) and unfoldAll (Ctrl-Alt-]).

Bug: T30684
Change-Id: I631fe0ecf21d0a80306bd40d66d22478a1aefe58
2024-03-07 13:47:47 +08:00
jenkins-bot 4c01432da8 Merge "CodeMirrorModeMediaWikiConfig: add missing tokens for nested templates" 2024-03-07 04:23:56 +00:00
gerritbot 1a906e41ad styles: Update color in Less from #d33 to #d73333
This patch promotes a consistent design decision across projects in
MediaWiki core, extensions, and skins. The darker red color meets the
W3C Web Content Accessibility Guidelines (WCAG) at Level AA that text
or images of text must have a contrast ratio of at least 4.5:1 (or 3:1
for large text).

Bug: T343239
Change-Id: I1c3a7a91e28a8fe9695531cdfd7be6807d7c8999
2024-03-06 22:48:56 +00:00
MusikAnimal 321d462311 CodeMirrorModeMediaWikiConfig: add missing tokens for nested templates
Nested templates have background shading relative to their level of
nesting. See the newly added test case as an example. Without these
tokens registered, the styling won't show properly.

Since these tokens aren't referenced directly by the StreamParser, nor
do they have a parent Tag, we don't need them as constants like we do
for other tokens.

Bug: T348019
Change-Id: I87bb99d538344957987b2bd88f902a1427a36522
2024-03-05 00:34:34 -05:00
MusikAnimal 7002bc434d CM6: use textarea height unless WikiEditor's Realtime Preview is loaded
The ResizingDragBar makes the editor resizable, so we need to set the
CodeMirror height to 100%. This only happens when the Realtime Preview
module is loaded.

This fixes a critical issue introduced by I4deeda192b that caused blank
renderings when scrolling large documents.

Bug: T357794
Follow-Up: I4deeda192bdc233101ba61739a636f8fd143c1de
Change-Id: Ib49d1d9e71df3653b13dfd44a8efedbf1ef9cd93
2024-03-04 17:41:04 -05:00
bhsd e4eb2846c9 fix scroll behavior of CodeMirror 6
Previously, the CM6 editor always scrolls into view, which is annoying during preview. With this patch, the CM6 editor only scrolls to the selection while the whole webpage does not scroll. In addition, the editor's scroll position will be memorized when previewing.

This patch requires an update of the @codemirror/view package.

Bug: T212899
Bug: T254962
Change-Id: I7f5e4694fa55c380958fa60ff6b3341bea1d2f02
2024-03-01 13:01:11 +08:00
MusikAnimal c9c9ed27d3 CodeMirror: default to using the same height as the textarea
CodeMirrorWikiEditor: add a 'ext.CodeMirror.initialize' hook to allow
integrations to manipulate the DOM before CodeMirror is initialized.

This is necessary for ProofreadPage, for example (I5c0824bf38cf7).

Bug: T357794
Change-Id: I4deeda192bdc233101ba61739a636f8fd143c1de
2024-02-26 14:22:33 -05:00
MusikAnimal 657ba3648a CodeMirror: sync text editor font preference
This only effects users of the CM6 CodeMirror class, so doesn't (yet)
solve the issue for the 2017 editor which is partly what T245568 is for.

I135bf0f7bf supposedly fixed it for the 2010 editor, but that fix
apparently doesn't work anymore, and thus those styles have simply been
removed (the .CodeMirror element is never a child of the edit font
classes).

This change also incidentally fixes font sizing issues by ensuring the
styles are applied to `.cm-content` and not `.cm-editor`. This prior bug
was most notably visible in other skins such as Timeless and Monobook.
The colorblind CSS class is now applied in the same way using the
EditorView.contrentAttributes facet.

Bug: T245568
Change-Id: Iaaf65e47ce8ed9303147aadc7e18a9aaa051405b
2024-02-25 23:08:38 -05:00
MusikAnimal 26d5023bb7 CodeMirror: partially implement $.textSelection 'encapsulateSelection'
Popular extensions like Charinsert use this method to wrap text around a
selection. This patch adds support for multiple selections in CM6.

Some options to encapsulateSelection do not yet have explicit support
here, such as 'peri', but it's unclear if they are truly needed.

Bug: T211205
Change-Id: Idc0abb64eb036fa4a60382aca401d1dba1722405
2024-02-16 04:42:14 +00:00
MusikAnimal 15215cb81f Utilize __non_webpack_require__ so we can source virtual files
This removes the need for a separate init module. Using
`__non_webpack_require__` will force Webpack to compile as `require`
instead of `__webpack_require__`, allowing ResourceLoader to inject the
virtual file.

Change-Id: I00203f4665b49cb92ee9db356445fdc2ab17fc5f
2024-02-14 08:47:21 -05:00
MusikAnimal 46b458cc0c CodeMirrorWikiEditor: add extension for multiple selections/cursors
This was preexisting behaviour in CM5 as a rather hidden feature,
and this patch brings it to CM6 keeping it just as hidden. That is,
to have focus in the texatrea, hit Ctrl (or ⌘ on Mac) to insert multiple
cursors, and similarly multiple selections and change their content.

This doesn't actually fix the bug reported at T211205. That may not
even be fixable, since jQuery.textSelection is the interface used to
interact with editors, and it doesn't support multiple selections.

Bug: T211205
Change-Id: I9d4d634c2ba46b909543a0090b871cee4b183fa0
2024-02-14 08:09:25 -05:00
MusikAnimal 5fe4ab8d58 CodeMirror: load colorblind theme when preference is set
This is only done for wikitext, as the stylesheet only references
.cm-mw-* classes.

Change-Id: I15a82c7680a12fb10baff4a2e78626677536c291
2024-02-13 14:57:42 -05:00
MusikAnimal 75f5c9b2be CodeMirror: highlight special characters and non-breaking spaces
The highlightSpecialChars() should act mostly identical to CM5. An
example is the soft hyphen (U+00AD). These are highlighted as a red dot
because they are non-printable characters.

The i18n may seem like overkill, but CM6 would otherwise actually print
the same message in plain English and without a way to localize it.

Per request at T181677, we also highlight non-breaking space and the
narrow non-breaking space. These are shown as a faint gray dot, to match
CM6's highlightWhiteSpace() extension. That extension isn't used here
because it would also highlight normal spaces, which we don't want.

Bug: T181677
Change-Id: Iac1a8cf78e4cd0a27abc917f4b70bdfbaf86252a
2024-02-13 14:57:06 -05:00
MusikAnimal 5a07eb35db CodeMirror 6: localize search dialog
As of this patch, these should be the only messages used by us that live
in the CodeMirror library. More may be added later as new features
are added. We load all translations as a default CodeMirror extension
given the small cost and importance of localization.

German translations from the CodeMirror docs:
https://codemirror.net/examples/translate/

Also add a note in the README about the search dialog.

Bug: T317243
Change-Id: Iba40bcaf197ed48166ce4cdcc4f48177fc8d07f3
2024-02-13 14:56:23 -05:00
bhsd 8a3d203a03 fix attributes of table caption and table cell
Merging `inTableCaptioin` method into `eatTableRow` with an additional parameter so that table caption attributes can be respected. This patch also distinguishes double pipes (`||`) which start a new table cell and single pipe (`|`) which ends the attributes.

Bug: T324374
Change-Id: If2d4600067c587fe0b6a6edb332fd4e55abec607
2024-01-19 10:53:51 +08:00
bhsd 5235dbb322 fix protocol-like words not as URL protocol
A valid URL, whether free or not, requires at least 1 character after the protocol.

Bug: T309880
Change-Id: I972c4f0ea4273a3f50db17376af808770f28df0b
2024-01-19 10:27:55 +08:00
jenkins-bot 84d88b1f4e Merge "improve treatment of lists at start of line" 2024-01-19 00:42:52 +00:00
bhsd b4e762bd99 improve treatment of lists at start of line
In the parser, '*', '#', ';' and ':' can actually become nested lists (<ul>, <ol>, <dt> and <dd>) in any possible combinations. This patch does not yet support the `; dt : dd` syntax.

This patch also fixes the 'Unknown highlighting tag undefined' warning.

Bug: T184272
Bug: T170042
Change-Id: I13cc55fadbc9b03fd7c70eab123f7e378d52898d
2024-01-19 00:36:54 +08:00
bhsd e0af18f99d fix heading style conflict with CM5
CSS classes such as `.cm-mw-section-3` are assigned to the `<pre>` elements in CM5 while to the `<span>` elements in CM6. The heading styles for CM6 should not interfere with CM5, at least for now.

Bug: T355290
Change-Id: I47426a8319e67503014f847fba39891bdf42db5b
2024-01-18 23:53:52 +08:00
MusikAnimal 380ec9d1ce CodeMirrorModeMediaWiki: add support for mediawiki TagModes
This is essentially the CM6-style variant of the same code used for
TagModes in CM5. The big difference is in CM6, every tag must be
registered in order to be used. We do this dynamically when
CodeMirrorModeMediaWiki is intantiated. As of this patch only tags
that contain mediawiki (formerly 'text/mediawiki') are supported,
such as <ref>.

The CM6 tag registration surfaced an old bug, now fixed: when using
different capitalization on extension-supplied tags, the CSS class name
used to match that. I.e. <REF> would produce .cm-mw-ext-REF, when it
should be .cm-mw-ext-ref

Also remove the old line-level styles. With I17b1f0b7a6, line-level
styling was added for section headings. Doing the same for tags like
<nowiki> and <pre> isn't as important, and can be addressed later or
not at all.

Add test case for extension tag with no supplied TagMode

Other minor cleanup, including removing old commented out code

Bug: T348684
Change-Id: Ibfff1fc6eacc42b95f557abb40774a65c46ba373
2024-01-16 15:30:22 -05:00
James D. Forrester 75127a79e3 .nvmrc: Update now we're using Node 18
This also necessitated switching to a newer version of
babel-loader that is compatible with Node 18's SSL stack.

Change-Id: Ic9b65ced978fd91a3c0e50ab94cd59556c355ba9
2024-01-11 11:05:51 -05:00
bhsd 9826cc906f Line-level styling for section heading
This is merely a CSS hack which seems to work well for me. The only required JS change is to wrap plain text in section heading in a span, the CSS class of which is unused.

Bug: T351686
Change-Id: I17b1f0b7a6fdf9c090309f558349a06ccec4257f
2024-01-09 02:35:51 +00:00
MusikAnimal b70413441e CodeMirrorModeMediaWiki: add highlighting for <nowiki> and <pre>
Since <nowiki> and <pre> ignore wikitext, the CM5 implementation
cleverly leveraged the tagModes system so that only HTML entities are
processed. We're effectively doing the same here, only we don't need to
register them as proper TagModes. A FIXME is left to remove the entries
from extension.json after the CM6 upgrade is complete.

Note that line-level styling is still missing, see T351686#9431669.
As a result, multi-line content in a <nowiki> or <pre> may emit JS
warnings, but this is expected until T351686 is resolved.

Bug: T348684
Change-Id: Ia834c4609faf38af3c8f6b791544a7441b5cfb0a
2024-01-03 21:54:35 -05:00
MusikAnimal bbd142c118 mode.mediawiki: rename mnemonic to html-entity and deprecate variants
This removes treating an HTML entity in a template name as a separate
token, and thus deprecates the .cm-mw-template-name-mnemonic CSS class.

In CM6 we have to register tokens for them to show, and this one seems
of little use to begin with. HTML entities should always be styled as a
such, especially in page titles where they are treated post-processing.
i.e. [[&#47;dev/null]] links to [[/dev/null]].

The rename to .cm-html-entity and associated code is to better reflect
what it is. $rarr; is a mnemonic form while &#x2f; is not, but both are
entities.  Deprecations are noted in the README, with the old classes
to be removed later after on-wiki usage has been updated.

Bug: T348019
Change-Id: I1184fb5d7d37084c80af1abd5f3cb5f2091b085c
2024-01-03 21:48:34 -05:00
MusikAnimal 65f9c986f2 mediawiki.less: don't remove font-weight from .cm-mw-strong tokens
Presumably it was always the intention that tokens with the styles
.cm-mw-page-name AND .cm-mw-em should be both bold and italic in links,
without having the CSS rules override each other. As an example:

  '''''[[Bold and italic title]]'''''

Added a note in the README that this will be a new user-facing feature

Change-Id: Iac41e31b7a9cf8683cd5c982c496ff83a092acfb
2024-01-03 16:08:01 -05:00
MusikAnimal c1cd9dabf3 CodeMirrorModeMediaWiki: don't detect additional { as template name
This merely ports over Ica3fb110ce and Id5e50c2baf to the CM6
stream parser. Also port the test that was added in I7907b4743b

Bug: T292967
Bug: T348019
Follow-Up: Ica3fb110cebb5650f66be321b533ed030e2c9698
Change-Id: I54b1624131ea63f403ebc1f6f900556ca868b7f4
2024-01-03 19:14:41 +00:00
MusikAnimal c670344851 Implement core MediaWiki stream parser for CodeMirror 6
This is more or less a exact port of the old stream parser, with the big
notable change being that all configuration-related code lives in a
separate class, CodeMirrorModeMediaWikiConfig. A smaller change is that
closing HTML tags that are marked as errors now have the ending '>'
character highlighted red, when it didn't before.

Integration with other extensions and modes is saved for a future patch
(T348684). This means <nowiki>, <ref> and other extension-supplied
markup is not yet highlighted.

The entry point for WikiEditor integration is now at
ext.CodeMirror.v6.WikiEditor.init.js, which needs to first require the
virtual file set via the DataScript (PHP) class. This can't be
integrated into the CM6 code because it needs to be precompiled before
ResourceLoader can use it (T281781).

Known issues, to be addressed separately:

* No support for TagModes / PluginModes (T348684)
* Identical adjacent tokens produce excess markup (T352917)
* Section headings do not have line-level styling (T351686)

Bug: T348019
Change-Id: I8f8a81f362bed60dea14ecde9487a2b0c89225e8
2024-01-02 23:18:32 -05:00
jenkins-bot 1b6b86a937 Merge "CodeMirror: add stability flags and document properties" 2024-01-02 22:05:18 +00:00
Ed Sanders d7d6cd9410 Remove useless @copyright tags from VE code headers
Change-Id: I43c38a5f21d14341a54f5d18ea535d1c12a81c09
2023-12-18 17:01:58 +00:00
MusikAnimal c1af5e11e0 CodeMirror: add stability flags and document properties
These methods will be used by other modes and/or extensions,
and as per the frontend stable interface policy, they should
be marked as stable.

Also permit callers to pass in a HTMLTextAreaElement, jQuery
object, or a CSS query string.

Change-Id: Iec57bf8fe4086faf57b3cc10834baaa27af80b85
2023-12-13 01:19:34 -05:00
jenkins-bot ed36d5284f Merge "CodeMirrorWikiEditor: add bracketMatching as default extension" 2023-12-11 11:01:53 +00:00
jenkins-bot 89563724b0 Merge "Bump Node dependencies and fix deprecations and linting failures" 2023-12-08 12:16:45 +00:00
thiemowmde 1e845daedc Expand test case for {{!}} in the table syntax
The test case was super minimal, without any actual table cells.

Bug: T292967
Change-Id: I4d86a369b69d12ed0f4967e0e1edd00f886fcb1e
2023-12-07 11:33:40 +01:00
MusikAnimal 62485151c2 CodeMirrorWikiEditor: add bracketMatching as default extension
By default, this feature highlights unmatched brackets when the cursor
is placed over it. This can be disabled, but seems useful so we'll add
it as one of the new features in README and see how users react.

Bug: T348019
Change-Id: Ie6af715e40aeb8217a7c4dfe0c6e6a3dcfa725d5
2023-12-06 01:46:58 -05:00
MusikAnimal 75fa1ec8c7 Bump Node dependencies and fix deprecations and linting failures
Bumps the following, which will be needed by subsequent patches:

* stylelint-config-wikimedia = 0.16.1
* webpack = 5.89.0
* webpack-cli = 5.1.4
* @babel/preset-env = 7.3.0

Change-Id: Icd44ad126f11365ee1215672cee66868e79c8978
2023-12-06 00:43:15 -05:00
thiemowmde 4c92345e6f Don't detect additional { as part of the template name
It's impossible to have a template that has the character { as part
of the name. The real-world example explained in T292967 is the
sequence {{{!}}. The old code detected this as:
* A template that starts with {{
* The template name is {!
* Template ends with }}

New behavior as proposed in this patch:
* A single { with no special meaning
* The parser function {{!}}

Note this is only a very small improvement, but doesn't fully solve
T292967.

Bug: T292967
Change-Id: Ica3fb110cebb5650f66be321b533ed030e2c9698
2023-11-21 12:47:15 +01:00
thiemowmde aa391c1c77 Much more robust detection of template {{{variables}}}
Variables like {{{foo}}} with 3 brackets typically only appear in
templates. But odd combinations of other features that also start
with 3 brackets are much more common. These should not be detected
as variables.

1. When something starts with 4 or more brackets it's not a variable
but something else. E.g. the start of a template where the template
name is a variable (2 + 3 = 5 brackets).

2. Tables can start with {{{!}}.

Note this doesn't fully solve T292967 but already improves the
situation a lot.

Bug: T108450
Bug: T292967
Change-Id: Id5e50c2bafb35a211d4b63609126c40b32f06a64
2023-11-21 12:30:13 +01:00
thiemowmde 8274034243 Add test cases for certain combinations of wikitext features
Document the status quo. This is relevant for the next two patches.

Change-Id: I7907b4743b4dec60c6523dfcc210d947926161be
2023-11-21 12:27:55 +01:00
Volker E c7662a4e74 docs: Remove reference to WikimediaUI Base
And replace with Codex color label, see
https://doc.wikimedia.org/codex/latest/style-guide/colors.html

Bug: T334934
Change-Id: Ia99eae4e09b2b5e622a9b0d316b03006e0ef94ed
2023-10-25 20:06:42 -07:00
MusikAnimal 314bd6d8c4 CodeMirrorWikiEditor: scroll selection into view on inital load
Without the scrollIntoView option set, CodeMirror will always scroll
to the bottom.

See:
https://codemirror.net/docs/ref/#state.TransactionSpec.scrollIntoView

Bug: T317243
Change-Id: I3174685cd3508abf8074eb47e8f2bf81bd303916
2023-10-20 20:47:13 -04:00
MusikAnimal 361741ec86 CodeMirrorWikiEditor: sync with textarea when using CodeMirror toggle
This was working before somehow… but according to the CodeMirror docs,
it never syncs with the textarea automatically, so regardless this is
a necessary safeguard at least.

Repro steps:
1) Have CodeMirror turned on
2) Open a page for editing
3) Add content
4) Toggle CodeMirror off

With this patch, it should now always be synced.

Also add selenium test to ensure this doesn't break again.

Bug: T317243
Change-Id: Ie44e62fe5838bf32f40c6a3595ec3f541380cfe1
2023-10-21 00:42:22 +00:00
MusikAnimal 65b864588b Enable support for RTL when using CodeMirror 6
Refactor common contentAttributes Facet into a default Extension

Bug: T170001
Change-Id: I648bac617b5939c1fc4e115144e55a5cb77d6d66
2023-10-17 20:33:01 -04:00
MusikAnimal c0b01008a4 Add $wgCodeMirrorConflictingGadgets instead of checking wikEd directly
Since wikEd and DotsSyntaxHighlighter are both popular gadgets in and
outside WMF wikis, they are included in this setting by default.

Change-Id: If6c953858f9cf73024959b5a3b71b33ab7b48b4c
2023-10-11 01:33:35 -04:00
MusikAnimal d1cb5a0d01 CodeMirror: fix scrollToCaretPosition $.textSelection implementation
Add selenium tests for textSelection API.

Bug: T317243
Change-Id: I0904a715698aa235fb0744cbc4ff0f9787387592
2023-10-11 01:25:10 -04:00
MusikAnimal 06829a5a0a CodeMirrorWikiEditor: add missing hook and fix reference to textarea
This fixes integration with some consumers of the
'ext.CodeMirror.switch' hook, such as Extension:Disambiguator.
The jQuery element passed to the hook is around the CodeMirror DOM
element which has the jQuery.textSelection() API registered to it.

Bug: T317243
Follow-Up: I2239d2449b2db3b638551f847eb4eff1aafa6276
Change-Id: Iec368613da3c69df52ce5e7ca441c31172cdc5de
2023-10-10 16:11:18 -04:00
jenkins-bot 39ed5a05fc Merge "CodeMirror6: add new modules, feature flag, and URL query parameter" 2023-10-10 08:49:11 +00:00
MusikAnimal 880c690a10 CodeMirror6: add new modules, feature flag, and URL query parameter
Add a new $wgCodeMirrorV6 temporary feature flag that when enabled,
will load the 'ext.CodeMirror.v6.WikiEditor' module that is built
against CodeMirror 6. You can also pass in the ?cm6enable=1 query
parameter to force use of CodeMirror 6. This is currently only
implemented for the 2010 editor.

Due to packaging constraints with CodeMirror 6, we now use Webpack to
bundle the files, which are then used by ResourceLoader. This is similar
to what is done for Extension:Popups, MobileFrontend, among other
extensions.

A new generic class CodeMirror can be used on other areas where syntax
highlighting is desirable, but not necessarily for editing (i.e. without
WikiEditor).

This commit merely lays the foundation for CodeMirror 6 and updates
WikiEditor to use it. The actual MediaWiki syntax highlighting will come
with a future commit.

With the new Webpack build, the Gruntfile was removed and the tasks
moved to npm commands.

Bug: T317243
Change-Id: I2239d2449b2db3b638551f847eb4eff1aafa6276
2023-10-09 19:51:24 -04:00
Ed Sanders 1c853da980 Use white-space: break-spaces
Bug: T347902
Bug: T348006
Change-Id: I62cb4c4f55a9ed80c043c4a1c27dd276559b1cba
2023-10-05 14:30:54 +00:00
James D. Forrester 764ff6478d resources: Manage upstream CodeMirror using ManageForeignResources
Depends-On: Ica6a80d6eb127cc10a00d3d6d0890ad724762ff2
Change-Id: I15721ef93c270a5a2f9194d678cd6876e14c7ea6
2023-09-21 12:40:53 +01:00
David Lynch e9e6361610 Update embedded CodeMirror library to 5.65.15
Was at 5.58.3

Bug: T334994
Change-Id: I74e792a5952973240a111180dde9f5097b48c278
2023-09-20 09:17:03 -05:00
Ed Sanders 21c121b898 build: Update linters
Change-Id: I49eb2de402a8c89065968cf927a2ca6a361ca684
2023-09-13 14:02:43 +01:00
MusikAnimal 46b7208d13 Convert applicable ResourceLoader modules to use packageFiles
Move WikiEditor-specific code to ext.CodeMirror.WikiEditor, leaivng only
CodeMirror-specific things in ext.CodeMirror, including the logUsage
method which was duplicated in the VE plugin and now refactored.

Add .env to .gitignore so that selenium tests can be ran more easily

This patch leaves the other non-mediawiki modes still using the
'scripts' system instead of 'packageFiles'. These are not used in
MediaWiki directly but by some extensions (i.e. PhpTags) and using
packageFiles will break that integration.

Bug: T272035
Change-Id: I3bafef196c1f713443d7b8e9cb7dc2891b379f5d
2023-08-24 11:55:13 -04:00
Sam Wilson 7d48f2d8bb Use editRecovery.loadEnd JS hook to add change handler
Add core's change handler for CodeMirror changes as well, to
save in-progress edit data.

Depends-On: I32c13c1eeec55dc442b0a00ede9cb74422b0307e
Bug: T342882
Change-Id: I352470752130c7b9b2dfc55a066cecf785d40067
2023-07-31 10:44:08 +08:00