Upgrade Draftail to v1.2.1. Fix #4985, adds more Markdown shortcuts (#5117)

This includes:

- [v1.0.0](https://github.com/springload/draftail/releases/tag/v1.0.0) (identical to v0.17.2)
- [v1.1.0](https://github.com/springload/draftail/releases/tag/v1.1.0) (contains fix for #4985)
- [v1.2.0](https://github.com/springload/draftail/releases/tag/v1.2.0)
- [v1.2.1](https://github.com/springload/draftail/releases/tag/v1.2.1) (fixes regression in v1.2.0)

Here is the combined CHANGELOG for what's relevant to Wagtail:

Bug fixes
~~~~~~~~~

- #4985 – Prevent crash when filtering pasted content whose last block is to be removed (e.g. unsupported image) ([#179](https://github.com/springload/draftail/issues/179)).
- Stop unnecessarily calling `onSave` in the editor’s `onBlur` ([#173](https://github.com/springload/draftail/issues/173)).
- Prevent crash in `DraftUtils.getEntitySelection`, when the provided entity key isn't valid (undefined, missing) ([#168](https://github.com/springload/draftail/pull/168)).
- Fix entity removal and editing not doing anything when the selection is backwards (right to left) ([#168](https://github.com/springload/draftail/pull/168)).
- Prevent the editor from crashing when copy-paste filtering removes all of its content (https://github.com/thibaudcolas/draftjs-filters/commit/652750f)

New features
~~~~~~~~~~~~

- Add support for Markdown shortcuts for inline styles, e.g. `**` for bold, `_` for italic, etc ([#134](https://github.com/springload/draftail/issues/134), [#187](https://github.com/springload/draftail/pull/187)). View the full list of [keyboard shortcuts](https://www.draftail.org/docs/keyboard-shortcuts).

New APIs
~~~~~~~~

- Add [`onFocus`](https://www.draftail.org/docs/api#managing-focus) and [`onBlur`](https://www.draftail.org/docs/api#managing-focus) props to use callbacks on those events. This can be useful for [form validation](https://www.draftail.org/docs/next/form-validation). [#170](https://github.com/springload/draftail/issues/170), [#174](https://github.com/springload/draftail/pull/174), thanks to [@TheSpicyMeatball](https://github.com/TheSpicyMeatball).
- Add [`plugins`](https://www.draftail.org/docs/plugins) API to support extensions of the editor using the [draft-js-plugins](https://github.com/draft-js-plugins/draft-js-plugins) architecture ([#83](https://github.com/springload/draftail/issues/83), [#171](https://github.com/springload/draftail/pull/171)).
- Add ability to disable or customise the editor toolbar with [`topToolbar`](https://www.draftail.org/docs/customising-toolbars).
- Add ability to add a toolbar below the editor with [`bottomToolbar`](https://www.draftail.org/docs/customising-toolbars).
- Add data reset parameter to `DraftUtils.resetBlockWithType()`.
- Enable list continuation on Enter for custom `*-list-item` blocks. All that’s required is for the block type to end with `-list-item`.

None of those API additions will be usable within Wagtail (at least without hacks) until corresponding rich text features APIs are built to allow their configuration. The last 2 additions would already be usable but they would only be useful when leveraging the other APIs.

CHANGELOG.txt

@@ -23,6 +23,7 @@ Changelog
  * Added `max_count_per_parent` option on page models to limit the number of pages of a given type that can be created under one parent page (Wesley van Lee)
  * `StreamField` field blocks now accept a `validators` argument (Tom Usher)
  * Added edit / delete buttons to snippet index and "don't delete" option to confirmation screen, for consistency with pages (Kevin Howbrook)
+ * Added support for Markdown shortcuts for inline formatting in rich text editor, e.g. `**` for bold, `_` for italic, etc. (Thibaud Colas)
  * Fix: Set `SERVER_PORT` to 443 in `Page.dummy_request()` for HTTPS sites (Sergey Fedoseev)
  * Fix: Include port number in `Host` header of `Page.dummy_request()` (Sergey Fedoseev)
  * Fix: Validation error messages in `InlinePanel` no longer count towards `max_num` when disabling the 'add' button (Todd Dembrey, Thibaud Colas)
@@ -43,6 +44,9 @@ Changelog
  * Fix: Rich text processing now preserves non-breaking spaces instead of converting them to normal spaces (Wesley van Lee)
  * Fix: Prevent autocomplete dropdowns from appearing over date choosers on Chrome (Kevin Howbrook)
  * Fix: Prevent crash when logging HTTP errors from Cloudflare (Kevin Howbrook)
+ * Fix: Prevent rich text editor crash when filtering copy-pasted content and the last block is to be removed, e.g. unsupported image (Thibaud Colas)
+ * Fix: Removing rich text links / documents now also works when the text selection is backwards (Thibaud Colas)
+ * Fix: Prevent the rich text editor from crashing when copy-paste filtering removes all of its content (Thibaud Colas)
 
 
 2.4 (19.12.2018)

client/src/components/Draftail/__snapshots__/index.test.js.snap

@@ -7,6 +7,7 @@ Object {
   "autoComplete": null,
   "autoCorrect": null,
   "blockTypes": Array [],
+  "bottomToolbar": null,
   "controls": Array [],
   "decorators": Array [],
   "enableHorizontalRule": Object {
@@ -25,8 +26,11 @@ Object {
   ],
   "inlineStyles": Array [],
   "maxListNesting": 4,
+  "onBlur": null,
+  "onFocus": null,
   "onSave": [Function],
   "placeholder": "Write here…",
+  "plugins": Array [],
   "rawContentState": null,
   "showRedoControl": Object {
     "description": "Redo",
@@ -39,6 +43,7 @@ Object {
   "stripPastedStyles": false,
   "textAlignment": null,
   "textDirectionality": null,
+  "topToolbar": [Function],
 }
 `;
 

docs/releases/2.5.rst

@@ -10,6 +10,18 @@ Wagtail 2.5 release notes - IN DEVELOPMENT
 What's new
 ==========
 
+New Markdown shortcuts in rich text
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+Wagtail’s rich text editor now supports using Markdown shortcuts for inline formatting:
+
+ * ``**`` for bold
+ * ``_`` for italic
+ * ``~`` for strikethrough (if enabled)
+ * ````` for code (if enabled)
+
+To learn other shortcuts, have a look at the `keyboard shortcuts <https://www.draftail.org/docs/keyboard-shortcuts>`_ reference.
+
 
 Other features
 ~~~~~~~~~~~~~~
@@ -59,6 +71,9 @@ Bug fixes
  * Rich text processing now preserves non-breaking spaces instead of converting them to normal spaces (Wesley van Lee)
  * Prevent autocomplete dropdowns from appearing over date choosers on Chrome (Kevin Howbrook)
  * Prevent crash when logging HTTP errors on Cloudflare cache purging (Kevin Howbrook)
+ * Prevent rich text editor crash when filtering copy-pasted content and the last block is to be removed, e.g. unsupported image (Thibaud Colas)
+ * Removing rich text links / documents now also works when the text selection is backwards (Thibaud Colas)
+ * Prevent the rich text editor from crashing when copy-paste filtering removes all of its content (Thibaud Colas)
 
 
 Upgrade considerations

package-lock.json

@@ -2711,6 +2711,11 @@
       "integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
       "dev": true
     },
+    "decorate-component-with-props": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/decorate-component-with-props/-/decorate-component-with-props-1.1.0.tgz",
+      "integrity": "sha512-tTYQojixN64yK3/WBODMfvss/zbmyUx9HQXhzSxZiSiofeekVeRyyuToy9BCiTMrVEIKWxTcla2t3y5qdaUF7Q=="
+    },
     "deep-is": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
@@ -2963,24 +2968,38 @@
         "object-assign": "^4.1.0"
       }
     },
+    "draft-js-plugins-editor": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/draft-js-plugins-editor/-/draft-js-plugins-editor-2.1.1.tgz",
+      "integrity": "sha512-fKGe71irNvFHJ5L/lUrh+3vPkBNq0de6x+cgiZUJ9zQERc5KPBtGXIFiarLFVHyrRTCPq+K6xmgfFSAERaFHPw==",
+      "requires": {
+        "decorate-component-with-props": "^1.0.2",
+        "find-with-regex": "^1.1.3",
+        "immutable": "~3.7.4",
+        "prop-types": "^15.5.8",
+        "union-class-names": "^1.0.0"
+      }
+    },
     "draftail": {
-      "version": "0.17.2",
-      "resolved": "https://registry.npmjs.org/draftail/-/draftail-0.17.2.tgz",
-      "integrity": "sha512-SPmd9k9cMH/4UmXK6F7uRx1sCtebcO2qFXjXA1R6BaR9gpCqfcKefxVZbgJ9RELpZ28xvNtTEjdtJqzUI1UPaw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/draftail/-/draftail-1.2.1.tgz",
+      "integrity": "sha512-YL0QjfUxneOzwGaO1t66H47cFN82zGjrvw+0ERHpFGtUPjfrD7uCKlfXhPg1mOJgFFxuc44p7M5fUlrS1asBYg==",
       "requires": {
-        "draftjs-conductor": "^0.2.1",
-        "draftjs-filters": "^1.0.0"
+        "decorate-component-with-props": "^1.0.2",
+        "draft-js-plugins-editor": "^2.1.1",
+        "draftjs-conductor": "^0.4.1",
+        "draftjs-filters": "^2.2.3"
       }
     },
     "draftjs-conductor": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/draftjs-conductor/-/draftjs-conductor-0.2.1.tgz",
-      "integrity": "sha512-oazG/8otKjTZ1OdAA0BDaYiRsi4tJd0UmNjtIFebaqWUryyr76JyA2j/trFejEHQuNnSHjjeci4s9Jn4sxXPEA=="
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/draftjs-conductor/-/draftjs-conductor-0.4.1.tgz",
+      "integrity": "sha512-5BcJLdYLNIA/TNp/9xwIeD1quWsWEoi0ZI81TiW3vLecBEQgWKVxuKZaLdaXHYpW4/kdQvAJz2KcOBTpJkYBxg=="
     },
     "draftjs-filters": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/draftjs-filters/-/draftjs-filters-1.0.0.tgz",
-      "integrity": "sha512-OUXPZs/tYqge4BzPjA2+kiB0xcqxh4afPXq7c23YfRNrZM/tzRf8Ft2CXxOxR4j17xdBadD0qO0DXii0xFm6Rg=="
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/draftjs-filters/-/draftjs-filters-2.2.3.tgz",
+      "integrity": "sha512-xbpXgjTtFzaMp9P9xlaqmf3NpP4yYM3OT3HbodUQpI4t2kO9ltJTo0+3H+1PlsUPKoc7jPthiE0MYN/VMrsuNw=="
     },
     "duplexer": {
       "version": "0.1.1",
@@ -3857,6 +3876,11 @@
         "locate-path": "^2.0.0"
       }
     },
+    "find-with-regex": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/find-with-regex/-/find-with-regex-1.1.3.tgz",
+      "integrity": "sha512-zkEVQ1H3PIQL/19ADKt1lCQU4QGM3OneiderUcFgn5EgTm/TnoUh7HxPAwP8w/vXxWSLC6KtpbDQpypJ5+majw=="
+    },
     "findup-sync": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/findup-sync/-/findup-sync-2.0.0.tgz",
@@ -12853,6 +12877,11 @@
         "x-is-string": "^0.1.0"
       }
     },
+    "union-class-names": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/union-class-names/-/union-class-names-1.0.0.tgz",
+      "integrity": "sha1-kllgitrMOQlKKwz+FseOYgBheEc="
+    },
     "union-value": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/union-value/-/union-value-1.0.0.tgz",

package.json

@@ -86,7 +86,7 @@
   "dependencies": {
     "core-js": "^2.5.3",
     "draft-js": "0.10.5",
-    "draftail": "^0.17.2",
+    "draftail": "^1.2.1",
     "element-closest": "^2.0.2",
     "focus-trap-react": "^3.1.0",
     "prop-types": "^15.6.0",