decap-cms-widget-markdown 2.16.0-beta.0

package/src/serializers/__tests__/remarkPlugins.spec.js

@@ -0,0 +1,299 @@
+import visit from 'unist-util-visit';
+
+import { markdownToRemark, remarkToMarkdown } from '..';
+
+describe('registered remark plugins', () => {
+  function withNetlifyLinks() {
+    return function transformer(tree) {
+      visit(tree, 'link', function onLink(node) {
+        node.url = 'https://netlify.com';
+      });
+    };
+  }
+
+  it('should use remark transformer plugins when converting mdast to markdown', () => {
+    const plugins = [withNetlifyLinks];
+    const result = remarkToMarkdown(
+      {
+        type: 'root',
+        children: [
+          {
+            type: 'paragraph',
+            children: [
+              {
+                type: 'text',
+                value: 'Some ',
+              },
+              {
+                type: 'emphasis',
+                children: [
+                  {
+                    type: 'text',
+                    value: 'important',
+                  },
+                ],
+              },
+              {
+                type: 'text',
+                value: ' text with ',
+              },
+              {
+                type: 'link',
+                title: null,
+                url: 'https://this-value-should-be-replaced.com',
+                children: [
+                  {
+                    type: 'text',
+                    value: 'a link',
+                  },
+                ],
+              },
+              {
+                type: 'text',
+                value: ' in it.',
+              },
+            ],
+          },
+        ],
+      },
+      plugins,
+    );
+    expect(result).toMatchInlineSnapshot(
+      `"Some *important* text with [a link](https://netlify.com) in it."`,
+    );
+  });
+
+  it('should use remark transformer plugins when converting markdown to mdast', () => {
+    const plugins = [withNetlifyLinks];
+    const result = markdownToRemark(
+      'Some text with [a link](https://this-value-should-be-replaced.com) in it.',
+      plugins,
+    );
+    expect(result).toMatchInlineSnapshot(`
+Object {
+  "children": Array [
+    Object {
+      "children": Array [
+        Object {
+          "children": Array [],
+          "position": Position {
+            "end": Object {
+              "column": 16,
+              "line": 1,
+              "offset": 15,
+            },
+            "indent": Array [],
+            "start": Object {
+              "column": 1,
+              "line": 1,
+              "offset": 0,
+            },
+          },
+          "type": "text",
+          "value": "Some text with ",
+        },
+        Object {
+          "children": Array [
+            Object {
+              "children": Array [],
+              "position": Position {
+                "end": Object {
+                  "column": 23,
+                  "line": 1,
+                  "offset": 22,
+                },
+                "indent": Array [],
+                "start": Object {
+                  "column": 17,
+                  "line": 1,
+                  "offset": 16,
+                },
+              },
+              "type": "text",
+              "value": "a link",
+            },
+          ],
+          "position": Position {
+            "end": Object {
+              "column": 67,
+              "line": 1,
+              "offset": 66,
+            },
+            "indent": Array [],
+            "start": Object {
+              "column": 16,
+              "line": 1,
+              "offset": 15,
+            },
+          },
+          "title": null,
+          "type": "link",
+          "url": "https://netlify.com",
+        },
+        Object {
+          "children": Array [],
+          "position": Position {
+            "end": Object {
+              "column": 74,
+              "line": 1,
+              "offset": 73,
+            },
+            "indent": Array [],
+            "start": Object {
+              "column": 67,
+              "line": 1,
+              "offset": 66,
+            },
+          },
+          "type": "text",
+          "value": " in it.",
+        },
+      ],
+      "position": Position {
+        "end": Object {
+          "column": 74,
+          "line": 1,
+          "offset": 73,
+        },
+        "indent": Array [],
+        "start": Object {
+          "column": 1,
+          "line": 1,
+          "offset": 0,
+        },
+      },
+      "type": "paragraph",
+    },
+  ],
+  "position": Object {
+    "end": Object {
+      "column": 74,
+      "line": 1,
+      "offset": 73,
+    },
+    "start": Object {
+      "column": 1,
+      "line": 1,
+      "offset": 0,
+    },
+  },
+  "type": "root",
+}
+`);
+  });
+
+  it('should use remark serializer plugins when converting mdast to markdown', () => {
+    function withEscapedLessThanChar() {
+      if (this.Compiler) {
+        this.Compiler.prototype.visitors.text = node => {
+          return node.value.replace(/</g, '&lt;');
+        };
+      }
+    }
+
+    const plugins = [withEscapedLessThanChar];
+    const result = remarkToMarkdown(
+      {
+        type: 'root',
+        children: [
+          {
+            type: 'paragraph',
+            children: [
+              {
+                type: 'text',
+                value: '<3 Netlify',
+              },
+            ],
+          },
+        ],
+      },
+      plugins,
+    );
+    expect(result).toMatchInlineSnapshot(`"&lt;3 Netlify"`);
+  });
+
+  it('should use remark preset with settings when converting mdast to markdown', () => {
+    const settings = {
+      emphasis: '_',
+      bullet: '-',
+    };
+
+    const plugins = [{ settings }];
+    const result = remarkToMarkdown(
+      {
+        type: 'root',
+        children: [
+          {
+            type: 'paragraph',
+            children: [
+              {
+                type: 'text',
+                value: 'Some ',
+              },
+              {
+                type: 'emphasis',
+                children: [
+                  {
+                    type: 'text',
+                    value: 'important',
+                  },
+                ],
+              },
+              {
+                type: 'text',
+                value: ' points:',
+              },
+            ],
+          },
+          {
+            type: 'list',
+            ordered: false,
+            start: null,
+            spread: false,
+            children: [
+              {
+                type: 'listItem',
+                spread: false,
+                checked: null,
+                children: [
+                  {
+                    type: 'paragraph',
+                    children: [
+                      {
+                        type: 'text',
+                        value: 'One',
+                      },
+                    ],
+                  },
+                ],
+              },
+              {
+                type: 'listItem',
+                spread: false,
+                checked: null,
+                children: [
+                  {
+                    type: 'paragraph',
+                    children: [
+                      {
+                        type: 'text',
+                        value: 'Two',
+                      },
+                    ],
+                  },
+                ],
+              },
+            ],
+          },
+        ],
+      },
+      plugins,
+    );
+    expect(result).toMatchInlineSnapshot(`
+"Some _important_ points:
+
+- One
+- Two"
+`);
+  });
+});

package/src/serializers/__tests__/remarkShortcodes.spec.js

@@ -0,0 +1,106 @@
+import { Map, OrderedMap } from 'immutable';
+
+import { remarkParseShortcodes, getLinesWithOffsets } from '../remarkShortcodes';
+
+// Stub of Remark Parser
+function process(value, plugins, processEat = () => {}) {
+  function eat() {
+    return processEat;
+  }
+
+  function Parser() {}
+  Parser.prototype.blockTokenizers = {};
+  Parser.prototype.blockMethods = [];
+  remarkParseShortcodes.call({ Parser }, { plugins });
+  Parser.prototype.blockTokenizers.shortcode(eat, value);
+}
+
+function EditorComponent({ id = 'foo', fromBlock = jest.fn(), pattern }) {
+  return {
+    id,
+    fromBlock,
+    pattern,
+  };
+}
+
+describe('remarkParseShortcodes', () => {
+  describe('pattern matching', () => {
+    it('should work', () => {
+      const editorComponent = EditorComponent({ pattern: /bar/ });
+      process('foo bar', Map({ [editorComponent.id]: editorComponent }));
+      expect(editorComponent.fromBlock).toHaveBeenCalledWith(expect.arrayContaining(['bar']));
+    });
+    it('should match value surrounded in newlines', () => {
+      const editorComponent = EditorComponent({ pattern: /^bar$/ });
+      process('foo\n\nbar\n', Map({ [editorComponent.id]: editorComponent }));
+      expect(editorComponent.fromBlock).toHaveBeenCalledWith(expect.arrayContaining(['bar']));
+    });
+    it('should match multiline shortcodes', () => {
+      const editorComponent = EditorComponent({ pattern: /^foo\nbar$/ });
+      process('foo\nbar', Map({ [editorComponent.id]: editorComponent }));
+      expect(editorComponent.fromBlock).toHaveBeenCalledWith(expect.arrayContaining(['foo\nbar']));
+    });
+    it('should match multiline shortcodes with empty lines', () => {
+      const editorComponent = EditorComponent({ pattern: /^foo\n\nbar$/ });
+      process('foo\n\nbar', Map({ [editorComponent.id]: editorComponent }));
+      expect(editorComponent.fromBlock).toHaveBeenCalledWith(
+        expect.arrayContaining(['foo\n\nbar']),
+      );
+    });
+    it('should match shortcodes based on order of occurrence in value', () => {
+      const fooEditorComponent = EditorComponent({ id: 'foo', pattern: /foo/ });
+      const barEditorComponent = EditorComponent({ id: 'bar', pattern: /bar/ });
+      process(
+        'foo\n\nbar',
+        OrderedMap([
+          [barEditorComponent.id, barEditorComponent],
+          [fooEditorComponent.id, fooEditorComponent],
+        ]),
+      );
+      expect(fooEditorComponent.fromBlock).toHaveBeenCalledWith(expect.arrayContaining(['foo']));
+    });
+    it('should match shortcodes based on order of occurrence in value even when some use line anchors', () => {
+      const barEditorComponent = EditorComponent({ id: 'bar', pattern: /bar/ });
+      const bazEditorComponent = EditorComponent({ id: 'baz', pattern: /^baz$/ });
+      process(
+        'foo\n\nbar\n\nbaz',
+        OrderedMap([
+          [bazEditorComponent.id, bazEditorComponent],
+          [barEditorComponent.id, barEditorComponent],
+        ]),
+      );
+      expect(barEditorComponent.fromBlock).toHaveBeenCalledWith(expect.arrayContaining(['bar']));
+    });
+  });
+  describe('output', () => {
+    it('should be a remark shortcode node', () => {
+      const processEat = jest.fn();
+      const shortcodeData = { bar: 'baz' };
+      const expectedNode = { type: 'shortcode', data: { shortcode: 'foo', shortcodeData } };
+      const editorComponent = EditorComponent({ pattern: /bar/, fromBlock: () => shortcodeData });
+      process('foo bar', Map({ [editorComponent.id]: editorComponent }), processEat);
+      expect(processEat).toHaveBeenCalledWith(expectedNode);
+    });
+  });
+});
+
+describe('getLinesWithOffsets', () => {
+  test('should split into lines', () => {
+    const value = ' line1\n\nline2 \n\n    line3   \n\n';
+
+    const lines = getLinesWithOffsets(value);
+    expect(lines).toEqual([
+      { line: ' line1', start: 0 },
+      { line: 'line2', start: 8 },
+      { line: '    line3', start: 16 },
+      { line: '', start: 30 },
+    ]);
+  });
+
+  test('should return single item on no match', () => {
+    const value = ' line1    ';
+
+    const lines = getLinesWithOffsets(value);
+    expect(lines).toEqual([{ line: ' line1', start: 0 }]);
+  });
+});

package/src/serializers/__tests__/remarkSlate.spec.js

@@ -0,0 +1,67 @@
+import { mergeAdjacentTexts } from '../remarkSlate';
+describe('remarkSlate', () => {
+  describe('mergeAdjacentTexts', () => {
+    it('should handle empty array', () => {
+      const children = [];
+      expect(mergeAdjacentTexts(children)).toBe(children);
+    });
+
+    it('should merge adjacent texts with same marks', () => {
+      const children = [
+        { text: '<a href="https://www.netlify.com" target="_blank">', marks: [] },
+        { text: 'Netlify', marks: [] },
+        { text: '</a>', marks: [] },
+      ];
+
+      expect(mergeAdjacentTexts(children)).toEqual([
+        {
+          text: '<a href="https://www.netlify.com" target="_blank">Netlify</a>',
+          marks: [],
+        },
+      ]);
+    });
+
+    it('should not merge adjacent texts with different marks', () => {
+      const children = [
+        { text: '<a href="https://www.netlify.com" target="_blank">', marks: [] },
+        { text: 'Netlify', marks: ['b'] },
+        { text: '</a>', marks: [] },
+      ];
+
+      expect(mergeAdjacentTexts(children)).toEqual(children);
+    });
+
+    it('should handle mixed children array', () => {
+      const children = [
+        { object: 'inline' },
+        { text: '<a href="https://www.netlify.com" target="_blank">', marks: [] },
+        { text: 'Netlify', marks: [] },
+        { text: '</a>', marks: [] },
+        { object: 'inline' },
+        { text: '<a href="https://www.netlify.com" target="_blank">', marks: [] },
+        { text: 'Netlify', marks: ['b'] },
+        { text: '</a>', marks: [] },
+        { text: '<a href="https://www.netlify.com" target="_blank">', marks: [] },
+        { object: 'inline' },
+        { text: '</a>', marks: [] },
+      ];
+
+      expect(mergeAdjacentTexts(children)).toEqual([
+        { object: 'inline' },
+        {
+          text: '<a href="https://www.netlify.com" target="_blank">Netlify</a>',
+          marks: [],
+        },
+        { object: 'inline' },
+        { text: '<a href="https://www.netlify.com" target="_blank">', marks: [] },
+        { text: 'Netlify', marks: ['b'] },
+        {
+          text: '</a><a href="https://www.netlify.com" target="_blank">',
+          marks: [],
+        },
+        { object: 'inline' },
+        { text: '</a>', marks: [] },
+      ]);
+    });
+  });
+});

package/src/serializers/__tests__/remarkStripTrailingBreaks.spec.js

@@ -0,0 +1,23 @@
+import unified from 'unified';
+import u from 'unist-builder';
+
+import remarkStripTrailingBreaks from '../remarkStripTrailingBreaks';
+
+function process(children) {
+  const tree = u('root', children);
+  const strippedMdast = unified().use(remarkStripTrailingBreaks).runSync(tree);
+
+  return strippedMdast.children;
+}
+
+describe('remarkStripTrailingBreaks', () => {
+  it('should remove trailing breaks at the end of a block', () => {
+    expect(process([u('break')])).toEqual([]);
+    expect(process([u('break'), u('text', '\n  \n')])).toEqual([u('text', '\n  \n')]);
+    expect(process([u('text', 'a'), u('break')])).toEqual([u('text', 'a')]);
+  });
+
+  it('should not remove trailing breaks that are not at the end of a block', () => {
+    expect(process([u('break'), u('text', 'a')])).toEqual([u('break'), u('text', 'a')]);
+  });
+});