Go to file
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
.phan Add phan 2019-04-09 20:35:56 +02:00
i18n CM6: Add syntax highlighting preference for users without WikiEditor 2024-04-09 22:05:20 -04:00
includes CM6: Add syntax highlighting preference for users without WikiEditor 2024-04-09 22:05:20 -04:00
resources CM6: Add syntax highlighting preference for users without WikiEditor 2024-04-09 22:05:20 -04:00
src CM6: Add syntax highlighting preference for users without WikiEditor 2024-04-09 22:05:20 -04:00
tests CM6: Add syntax highlighting preference for users without WikiEditor 2024-04-09 22:05:20 -04:00
.babelrc Implement core MediaWiki stream parser for CodeMirror 6 2024-01-02 23:18:32 -05:00
.eslintignore CM6: Add jsdoc build step, fix JSDoc annotations, and add @stable tags 2024-03-26 13:35:47 -04:00
.eslintrc.json eslint: Lint Gruntile.js using server rules 2022-02-07 16:25:32 +00:00
.gitignore CM6: Add jsdoc build step, fix JSDoc annotations, and add @stable tags 2024-03-26 13:35:47 -04:00
.gitreview Whoops, track not trace 2016-10-24 17:02:17 -07:00
.nvmrc .nvmrc: Update now we're using Node 18 2024-01-11 11:05:51 -05:00
.phpcs.xml build: Updating eslint-config-wikimedia to 0.18.2 2021-03-06 09:27:20 +00:00
.stylelintrc.json CodeMirror6: add new modules, feature flag, and URL query parameter 2023-10-09 19:51:24 -04:00
CODE_OF_CONDUCT.md build: Updating mediawiki/phan-taint-check-plugin to 1.3.0 2018-08-19 10:46:12 +00:00
composer.json build: Updating mediawiki/mediawiki-codesniffer to 43.0.0 2024-03-17 16:17:35 +00:00
COPYING CodeMirror: Add COPYING file and credit for CodeMirror authors 2020-03-02 21:34:06 +00:00
extension.json CM6: Add syntax highlighting preference for users without WikiEditor 2024-04-09 22:05:20 -04:00
jest.config.js CodeMirror6: add new modules, feature flag, and URL query parameter 2023-10-09 19:51:24 -04:00
jsdoc.json CM6: Add jsdoc build step, fix JSDoc annotations, and add @stable tags 2024-03-26 13:35:47 -04:00
package-lock.json CM6: Add jsdoc build step, fix JSDoc annotations, and add @stable tags 2024-03-26 13:35:47 -04:00
package.json CM6: Add jsdoc build step, fix JSDoc annotations, and add @stable tags 2024-03-26 13:35:47 -04:00
README.md CM6: Add jsdoc build step, fix JSDoc annotations, and add @stable tags 2024-03-26 13:35:47 -04:00
rollup.config.js CM6: Add syntax highlighting preference for users without WikiEditor 2024-04-09 22:05:20 -04:00

CodeMirror 6 homepage: https://www.mediawiki.org/wiki/Extension:CodeMirror/6

Development

As part of the upgrade to CodeMirror 6, CodeMirror now uses an asset bundler, so during development you'll need to run a script to assemble the frontend assets.

Use of CodeMirror 6 is controlled by the wgCodeMirrorV6 configuration setting, or by passing in cm6enable=1 in the URL query string.

You can find the v6 frontend source files in src/, the compiled sources in resources/dist/, and other frontend assets managed by ResourceLoader in resources/*.

Commands

NOTE: Consider using Fresh to run these tasks.

  • npm install to install dependencies.
  • npm start to run the bundler in watch mode, reassembling the files on file change. You'll want to keep this running in a separate terminal during development.
  • npm run build to compile the production assets. You must run this step before sending the patch or CI will fail (so that sources and built assets are in sync).
  • npm run doc to generate the API documentation.
  • npm test to run the linting tools, JavaScript unit tests, and build checks.
  • npm run test:lint for linting of JS/LESS/CSS.
  • npm run test:lint:js for linting of just JavaScript.
  • npm run test:lint:styles for linting of just Less/CSS.
  • npm run test:i18n for linting of i18n messages with banana-checker.
  • npm run test:unit for the new Jest unit tests.
  • npm run selenium-test for the Selenium tests.
  • Older QUnit tests are in resources/mode/mediawiki/tests/qunit/. These have been replaced and will be removed after the CodeMirror 6 upgrade.

CodeMirror 6 change log