From f636f9faedd8ea3b1f5beb7e9d381c6029f1343c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?=
<4710635+ellatrix@users.noreply.github.com>
Date: Fri, 12 Aug 2022 11:37:57 +0200
Subject: [PATCH] Paste from Slack: interpret paragraph markup (#43114)
---
.../src/api/raw-handling/paste-handler.js | 4 ++++
.../raw-handling/slack-paragraph-corrector.js | 21 +++++++++++++++++++
test/integration/blocks-raw-handling.test.js | 1 +
.../documents/slack-paragraphs-in.html | 1 +
.../documents/slack-paragraphs-out.html | 11 ++++++++++
5 files changed, 38 insertions(+)
create mode 100644 packages/blocks/src/api/raw-handling/slack-paragraph-corrector.js
create mode 100644 test/integration/fixtures/documents/slack-paragraphs-in.html
create mode 100644 test/integration/fixtures/documents/slack-paragraphs-out.html
diff --git a/packages/blocks/src/api/raw-handling/paste-handler.js b/packages/blocks/src/api/raw-handling/paste-handler.js
index aa9f99037a39e..a8edd9347d7b9 100644
--- a/packages/blocks/src/api/raw-handling/paste-handler.js
+++ b/packages/blocks/src/api/raw-handling/paste-handler.js
@@ -30,6 +30,7 @@ import htmlFormattingRemover from './html-formatting-remover';
import brRemover from './br-remover';
import { deepFilterHTML, isPlain, getBlockContentSchema } from './utils';
import emptyParagraphRemover from './empty-paragraph-remover';
+import slackParagraphCorrector from './slack-paragraph-corrector';
/**
* Browser dependencies
@@ -149,6 +150,9 @@ export function pasteHandler( {
return filterInlineHTML( HTML, preserveWhiteSpace );
}
+ // Must be run before checking if it's inline content.
+ HTML = deepFilterHTML( HTML, [ slackParagraphCorrector ] );
+
// An array of HTML strings and block objects. The blocks replace matched
// shortcodes.
const pieces = shortcodeConverter( HTML );
diff --git a/packages/blocks/src/api/raw-handling/slack-paragraph-corrector.js b/packages/blocks/src/api/raw-handling/slack-paragraph-corrector.js
new file mode 100644
index 0000000000000..3ce78a3931d7c
--- /dev/null
+++ b/packages/blocks/src/api/raw-handling/slack-paragraph-corrector.js
@@ -0,0 +1,21 @@
+/**
+ * Replaces Slack paragraph markup with a double line break (later converted to
+ * a proper paragraph).
+ *
+ * @param {Element} node Node to check.
+ */
+export default function slackParagraphCorrector( node ) {
+ if ( node.nodeName !== 'SPAN' ) {
+ return;
+ }
+
+ if ( node.getAttribute( 'data-stringify-type' ) !== 'paragraph-break' ) {
+ return;
+ }
+
+ const { parentNode } = node;
+
+ parentNode.insertBefore( node.ownerDocument.createElement( 'br' ), node );
+ parentNode.insertBefore( node.ownerDocument.createElement( 'br' ), node );
+ parentNode.removeChild( node );
+}
diff --git a/test/integration/blocks-raw-handling.test.js b/test/integration/blocks-raw-handling.test.js
index 14f38348bc68a..1586b858c227e 100644
--- a/test/integration/blocks-raw-handling.test.js
+++ b/test/integration/blocks-raw-handling.test.js
@@ -346,6 +346,7 @@ describe( 'Blocks raw handling', () => {
'gutenberg',
'shortcode-matching',
'slack-quote',
+ 'slack-paragraphs',
].forEach( ( type ) => {
// eslint-disable-next-line jest/valid-title
it( type, () => {
diff --git a/test/integration/fixtures/documents/slack-paragraphs-in.html b/test/integration/fixtures/documents/slack-paragraphs-in.html
new file mode 100644
index 0000000000000..77320336b2739
--- /dev/null
+++ b/test/integration/fixtures/documents/slack-paragraphs-in.html
@@ -0,0 +1 @@
+test with link
a new linea new paragraph
another new lineanother paragraph
\ No newline at end of file
diff --git a/test/integration/fixtures/documents/slack-paragraphs-out.html b/test/integration/fixtures/documents/slack-paragraphs-out.html
new file mode 100644
index 0000000000000..462b64daeeb6a
--- /dev/null
+++ b/test/integration/fixtures/documents/slack-paragraphs-out.html
@@ -0,0 +1,11 @@
+
+test with link
a new line
+
+
+
+a new paragraph
another new line
+
+
+
+another paragraph
+
\ No newline at end of file