swissup / module-codemirror
swissup/module-codemirror
Versatile text editor implemented in JavaScript for the browser.
CodeMirror
CodeMirror - is a Magento 2 module that integrates
CodeMirror - in-browser code editor into Magento 2.
Current version of module has implementations for Magento Admin only:
- form element for UI components;
- frontend models for Magento System Config.
Installation
composer require swissup/module-codemirror
bin/magento setup:upgrade
Usage
UI Component
Example:
<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd">
...
<fieldset name="general">
...
<field name="template_text">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="label" xsi:type="string" translate="true">Template Content</item>
<item name="formElement" xsi:type="string">textarea</item>
<item name="component" xsi:type="string">Swissup_Codemirror/js/form/element/editor</item>
<item name="editorConfig" xsi:type="array">
<item name="mode" xsi:type="string">htmlmixed</item>
</item>
<item name="validation" xsi:type="array">
<item name="required-entry" xsi:type="boolean">true</item>
</item>
</item>
</argument>
</field>
<field name="template_styles">
<argument name="data" xsi:type="array">
<item name="config" xsi:type="array">
<item name="dataType" xsi:type="string">string</item>
<item name="label" xsi:type="string" translate="true">Template Styles</item>
<item name="formElement" xsi:type="string">textarea</item>
<item name="component" xsi:type="string">Swissup_Codemirror/js/form/element/editor</item>
<item name="editorConfig" xsi:type="array">
<item name="mode" xsi:type="string">css</item>
</item>
</item>
</argument>
</field>
</fieldset>
</form>
Use option editorConfig to pass additional paramenets to editor. mode can be either string or an object. Check CodeMirror Modes itself to find out more.
System Config
Example:
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd">
<system>
<section id="prolabels" translate="label" type="text" sortOrder="1668" showInDefault="1" showInWebsite="1" showInStore="1">
...
<group id="general" translate="label" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="1">
<label>General</label>
...
<field id="css" translate="label" type="textarea" sortOrder="10" showInDefault="1" showInWebsite="1" showInStore="1">
<label>CSS</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Css</frontend_model>
</field>
<field id="less" translate="label" type="textarea" sortOrder="12" showInDefault="1" showInWebsite="1" showInStore="1">
<label>LESS</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Less</frontend_model>
</field>
<field id="scss" translate="label" type="textarea" sortOrder="12" showInDefault="1" showInWebsite="1" showInStore="1">
<label>SCSS</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Scss</frontend_model>
</field>
<field id="js" translate="label" type="textarea" sortOrder="20" showInDefault="1" showInWebsite="1" showInStore="1">
<label>JS</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Javascript</frontend_model>
</field>
<field id="yaml" translate="label" type="textarea" sortOrder="25" showInDefault="1" showInWebsite="1" showInStore="1">
<label>YAML</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Yaml</frontend_model>
</field>
<field id="yaml-frontmatter" translate="label" type="textarea" sortOrder="26" showInDefault="1" showInWebsite="1" showInStore="1">
<label>YAML Frontmatter</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Yamlfrontmatter</frontend_model>
</field>
<field id="text" translate="label" type="textarea" sortOrder="30" showInDefault="1" showInWebsite="1" showInStore="1">
<label>Label Text</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Htmlmixed</frontend_model>
</field>
<field id="custom" translate="label" type="textarea" sortOrder="50" showInDefault="1" showInWebsite="1" showInStore="1">
<label>Label Inline Styles</label>
<frontend_model>Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Inlinecss</frontend_model>
</field>
</group>
</section>
</system>
</config>
There are 9 frontend models for system config:
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Css
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Less
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Scss
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Javascript
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Htmlmixed
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Inlinecss
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Json
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Yaml
- Swissup\Codemirror\Block\Adminhtml\System\Config\Form\Field\Yamlfrontmatter
No changelog yet
The vendor hasn't published a changelog. Tagged releases appear in the Versions tab.
| Version | Stability | QA Status | Compatibility | Released |
|---|---|---|---|---|
| 1.1.21 | stable | Pass | Magento 2.4.7-2.4.9 Details | 2026-05-18 19:40:12 |
| 1.1.20 | stable | Not tested | Not yet tested Details | 2025-12-17 21:31:50 |
| 1.1.19 | stable | Not tested | Not yet tested Details | 2025-06-17 10:00:36 |
| 1.1.18 | stable | Not tested | Not yet tested Details | 2025-06-16 11:32:03 |
| 1.1.17 | stable | Not tested | Not yet tested Details | 2025-05-11 15:46:35 |
| 1.1.16 | stable | Not tested | Not yet tested Details | 2023-07-24 11:29:29 |
| 1.1.15 | stable | Not tested | Not yet tested Details | 2022-04-15 13:15:00 |
| 1.1.14 | stable | Not tested | Not yet tested Details | 2022-04-02 13:32:13 |
| 1.1.13 | stable | Not tested | Not yet tested Details | 2021-08-06 12:03:36 |
| 1.1.12 | stable | Not tested | Not yet tested Details | 2021-01-22 08:07:51 |
| 1.1.11 | stable | Not tested | Not yet tested Details | 2020-12-22 10:08:23 |
| 1.1.10 | stable | Not tested | Not yet tested Details | 2020-12-22 10:02:27 |
| 1.1.9 | stable | Not tested | Not yet tested Details | 2020-10-13 07:37:46 |
| 1.1.8 | stable | Not tested | Not yet tested Details | 2020-09-21 14:11:48 |
| 1.1.7 | stable | Not tested | Not yet tested Details | 2020-08-04 11:46:10 |
| 1.1.6 | stable | Not tested | Not yet tested Details | 2020-06-19 14:34:55 |
| 1.1.5 | stable | Not tested | Not yet tested Details | 2020-06-16 07:27:04 |
| 1.1.4 | stable | Not tested | Not yet tested Details | 2020-06-10 14:06:02 |
| 1.1.3 | stable | Not tested | Not yet tested Details | 2020-04-22 07:15:01 |
| 1.1.2 | stable | Not tested | Not yet tested Details | 2020-04-07 08:33:37 |
| 1.1.1 | stable | Not tested | Not yet tested Details | 2020-01-31 14:30:34 |
| 1.1.0 | stable | Not tested | Not yet tested Details | 2019-12-20 08:51:29 |
| 1.0.1 | stable | Not tested | Not yet tested Details | 2019-12-17 07:42:24 |
| 1.0.0 | stable | Not tested | Not yet tested Details | 2019-11-19 15:23:06 |
No dependencies declared
This package's composer.json doesn't declare any required, suggested, replaced, or conflicting packages.
Compatibility
Each Magento release line is installed on its supported PHP versions, then the module is built (DI compilation + static-content deploy) and its unit and integration suites are run. The matrix shows the lines and PHP versions the module is confirmed to install and run on. Code-quality results further down (phpstan, phpcs, …) are reported separately and never affect compatibility.
Code Quality
Advisory checks against the module's source. Static analysis runs once across the whole module; PHPStan re-runs per Magento + PHP version because resolvable symbols differ between releases. These NEVER affect the Compatibility badge — a phpcs finding can't make a module incompatible.
Static analysis
Coding standards (phpcs), mess detection (phpmd), copy-pasted code (cpd), PHP cross-version compatibility, composer.json validity. Each runs once for the whole module.
PHPStan
Type-checks the module's PHP against a real Magento install at the configured gate level. Re-runs per Magento and PHP version because resolvable symbols differ between releases. Cell → details modal.
Tests
Unit and integration suites, run for each applicable Magento and PHP version. A test failure speaks to the module's behaviour, not its compatibility with a Magento line, so it is reported here separately and never reddens the compatibility matrix.
Unit tests
| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | N/A | N/A | ||
| 2.4.8 | N/A | N/A | ||
| 2.4.9 | N/A | N/A |
Integration tests
| Magento | PHP 8.2 | PHP 8.3 | PHP 8.4 | PHP 8.5 |
|---|---|---|---|---|
| 2.4.7 | N/A | N/A | ||
| 2.4.8 | N/A | N/A | ||
| 2.4.9 | N/A | N/A |
Security
Security checks run directly against the module: an audit of its declared dependencies for known vulnerabilities (composer audit) and a scan of its source for malware and web-shell signatures. Each runs once. A malware detection fails the version outright.
More from swissup
View vendorTurn an existing module into recurring revenue.
If you already maintain a Magento 2 module on GitHub or GitLab, listing it on Packagento takes about five minutes. We mirror your tags, handle distribution signing, and route paid licenses through Stripe Connect, so you can keep shipping the way you already do.