diff --git a/src/model/encoding/__tests__/__snapshots__/convertFromHTMLToContentBlocks-test.js.snap b/src/model/encoding/__tests__/__snapshots__/convertFromHTMLToContentBlocks-test.js.snap
index 1ea59dd0ce..2b31d7151f 100644
--- a/src/model/encoding/__tests__/__snapshots__/convertFromHTMLToContentBlocks-test.js.snap
+++ b/src/model/encoding/__tests__/__snapshots__/convertFromHTMLToContentBlocks-test.js.snap
@@ -1139,6 +1139,314 @@ Array [
]
`;
+exports[`Should recognize preformatted blocks 1`] = `
+Array [
+ Object {
+ "characterList": Array [
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ ],
+ "data": Object {},
+ "depth": 0,
+ "key": "key0",
+ "text": "following some pre some_code_stuff",
+ "type": "unstyled",
+ },
+]
+`;
+
+exports[`Should recognize preformatted blocks mixed other styles 1`] = `
+Array [
+ Object {
+ "characterList": Array [
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "BOLD",
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "BOLD",
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "BOLD",
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "BOLD",
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ Object {
+ "entity": null,
+ "style": Array [
+ "CODE",
+ ],
+ },
+ ],
+ "data": Object {},
+ "depth": 0,
+ "key": "key0",
+ "text": "example bold and code",
+ "type": "unstyled",
+ },
+]
+`;
+
exports[`Should recognized and *not* override html structure when having known draft-js classname with nesting enabled 1`] = `
Array [
Object {
diff --git a/src/model/encoding/__tests__/convertFromHTMLToContentBlocks-test.js b/src/model/encoding/__tests__/convertFromHTMLToContentBlocks-test.js
index f1c542c91a..f321fdf32b 100644
--- a/src/model/encoding/__tests__/convertFromHTMLToContentBlocks-test.js
+++ b/src/model/encoding/__tests__/convertFromHTMLToContentBlocks-test.js
@@ -564,3 +564,21 @@ test('Should import two blockquotes without extra line breaks', () => {
experimentalTreeDataSupport: false,
});
});
+
+test('Should recognize preformatted blocks', () => {
+ const html_string = `
+ following some pre some_code_stuff
+ `;
+ assertConvertFromHTMLToContentBlocks(html_string, {
+ experimentalTreeDataSupport: false,
+ });
+});
+
+test('Should recognize preformatted blocks mixed other styles', () => {
+ const html_string = `
+ example bold and code
+ `;
+ assertConvertFromHTMLToContentBlocks(html_string, {
+ experimentalTreeDataSupport: false,
+ });
+});
diff --git a/src/model/encoding/convertFromHTMLToContentBlocks.js b/src/model/encoding/convertFromHTMLToContentBlocks.js
index b3049f6902..44b2cee159 100644
--- a/src/model/encoding/convertFromHTMLToContentBlocks.js
+++ b/src/model/encoding/convertFromHTMLToContentBlocks.js
@@ -128,6 +128,17 @@ const buildBlockTypeMap = (
return Map(blockTypeMap);
};
+const detectInlineStyle = (node: Node): string | null => {
+ if (isHTMLElement(node)) {
+ const element: HTMLElement = (node: any);
+ // Currently only used to detect preformatted inline code
+ if (element.style.fontFamily.includes('monospace')) {
+ return 'CODE';
+ }
+ }
+ return null;
+};
+
/**
* If we're pasting from one DraftEditor to another we can check to see if
* existing list item depth classes are being used and preserve this style
@@ -497,6 +508,10 @@ class ContentBlocksBuilder {
newStyle = newStyle.add(HTMLTagToRawInlineStyleMap.get(nodeName));
}
newStyle = styleFromNodeAttributes(node, newStyle);
+ const inlineStyle = detectInlineStyle(node);
+ if (inlineStyle != null) {
+ newStyle = newStyle.add(inlineStyle);
+ }
blockConfigs.push(
...this._toBlockConfigs(Array.from(node.childNodes), newStyle),
);