From 4f7740dd1687fdbe9ee050f69da3527c1c9febe5 Mon Sep 17 00:00:00 2001 From: Rafe Goldberg Date: Tue, 20 Oct 2020 14:14:38 -0700 Subject: [PATCH 1/6] feat: allow custom magic block types Allow custom magic block types from the default parser conditional. --- processor/parse/magic-block-parser.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/processor/parse/magic-block-parser.js b/processor/parse/magic-block-parser.js index 8ffdc5927..103236f4d 100644 --- a/processor/parse/magic-block-parser.js +++ b/processor/parse/magic-block-parser.js @@ -239,7 +239,11 @@ function tokenize(eat, value) { { type: 'div', children: this.tokenizeBlock(json.text || json.html, eat.now()), - data: json, + data: { + hName: type || 'div', + hProperties: json, + ...json, + }, }, json ) From f74e8f5603d1f0a7af8ea3e15fd4084e379ae50e Mon Sep 17 00:00:00 2001 From: Rafe Goldberg Date: Tue, 20 Oct 2020 14:15:50 -0700 Subject: [PATCH 2/6] chore: add custom components to sanitize whitelist --- index.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/index.js b/index.js index cb33bec9d..c4ffdb25f 100644 --- a/index.js +++ b/index.js @@ -67,6 +67,13 @@ sanitize.clobberPrefix = ''; sanitize.tagNames.push('span', 'style'); sanitize.attributes['*'].push('class', 'className', 'align', 'style'); +/** + * @todo don't manually whitelist custom component attributes + * within the engine! + * @todo change `link` to `href` + */ +sanitize.attributes['tutorial-tile'] = ['backgroundColor', 'emoji', 'link']; + sanitize.tagNames.push('rdme-pin'); sanitize.tagNames.push('rdme-embed'); @@ -171,12 +178,14 @@ const PinWrap = ({ children }) =>
{children}
; // @tod const count = {}; export function reactProcessor(opts = {}, components = {}) { + Object.keys(components).map(key => sanitize.tagNames.push(key)); + return processor(opts) .use(sectionAnchorId) .use(rehypeReact, { createElement: React.createElement, Fragment: React.Fragment, - components: (typeof components === 'function' ? components : r => r)({ + components: { 'code-tabs': CodeTabs(sanitize), 'html-block': HTMLBlock(sanitize), 'rdme-callout': Callout(sanitize), @@ -195,7 +204,7 @@ export function reactProcessor(opts = {}, components = {}) { code: Code(sanitize, opts), img: Image(sanitize), ...components, - }), + }, }); } From 214b34996c0dfda63222430fc3e6fdc194267fa4 Mon Sep 17 00:00:00 2001 From: Gabriel Ratcliff Date: Thu, 22 Oct 2020 11:11:25 -0400 Subject: [PATCH 3/6] fix: updating test snapshot --- .../__snapshots__/magic-block-parser.test.js.snap | 13 +++++++++++++ __tests__/magic-block-parser.test.js | 12 ++++++++++++ 2 files changed, 25 insertions(+) diff --git a/__tests__/__snapshots__/magic-block-parser.test.js.snap b/__tests__/__snapshots__/magic-block-parser.test.js.snap index c02278133..150bcb699 100644 --- a/__tests__/__snapshots__/magic-block-parser.test.js.snap +++ b/__tests__/__snapshots__/magic-block-parser.test.js.snap @@ -236,6 +236,13 @@ Object { } `; +exports[`Parse Magic Blocks Custom Tutorial Block 1`] = ` +Object { + "children": Array [], + "type": "root", +} +`; + exports[`Parse Magic Blocks Embed Blocks 1`] = ` Object { "children": Array [ @@ -507,6 +514,12 @@ Object { "data": Object { "body": "Lorem ipsum dolor sit amet, _consectetur_ adipiscing elit. Praesent nec massa tristique arcu fermentum dapibus. Integer orci turpis, mollis vel augue eget, placerat rhoncus orci. Mauris metus libero, rutrum", "color": "#f00", + "hName": "unrecognized", + "hProperties": Object { + "body": "Lorem ipsum dolor sit amet, _consectetur_ adipiscing elit. Praesent nec massa tristique arcu fermentum dapibus. Integer orci turpis, mollis vel augue eget, placerat rhoncus orci. Mauris metus libero, rutrum", + "color": "#f00", + "title": "Title", + }, "title": "Title", }, "type": "div", diff --git a/__tests__/magic-block-parser.test.js b/__tests__/magic-block-parser.test.js index aea19a385..91517136a 100644 --- a/__tests__/magic-block-parser.test.js +++ b/__tests__/magic-block-parser.test.js @@ -214,6 +214,18 @@ describe('Parse Magic Blocks', () => { expect(process(text)).toMatchSnapshot(); }); + it('Custom Tutorial Block', () => { + const text = `[block:html] + { + "backgroundColor": "#ffffff", + "title": "Tutorial Title", + "emoji": "🦉", + "link": "http://test.com", + } + [/block]`; + expect(process(text)).toMatchSnapshot(); + }); + it('Unrecognized Blocks', () => { const text = `[block:unrecognized] { From 535dc8f5102c3cd430dd62b9cecfa650e1c7aef1 Mon Sep 17 00:00:00 2001 From: Gabriel Ratcliff Date: Thu, 22 Oct 2020 11:19:23 -0400 Subject: [PATCH 4/6] chore: increasing branch covg --- __tests__/components.test.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/__tests__/components.test.js b/__tests__/components.test.js index 3a38fbec4..2c5e42832 100644 --- a/__tests__/components.test.js +++ b/__tests__/components.test.js @@ -54,8 +54,8 @@ describe('Components', () => { `, ` -> 🚧 -> +> 🚧 +> > Callout with no title. `, @@ -167,6 +167,11 @@ describe('Components', () => { expect(blank.find('Heading').text()).toBe(''); }); + it('Heading no children', () => { + const wrap = mount(markdown.react('### Heading Level 3')); + expect(wrap.find('Heading')).toHaveLength(1); + }); + describe('Table of Contents', () => { it('generates TOC from headings', () => { const txt = '# Heading Zed\n\n# Heading One'; From 84c48782d0529655c68dedf3a12115183b523f72 Mon Sep 17 00:00:00 2001 From: Gabriel Ratcliff Date: Thu, 22 Oct 2020 13:40:55 -0400 Subject: [PATCH 5/6] fix: test copy --- __tests__/magic-block-parser.test.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/__tests__/magic-block-parser.test.js b/__tests__/magic-block-parser.test.js index 91517136a..bba38dda7 100644 --- a/__tests__/magic-block-parser.test.js +++ b/__tests__/magic-block-parser.test.js @@ -214,8 +214,8 @@ describe('Parse Magic Blocks', () => { expect(process(text)).toMatchSnapshot(); }); - it('Custom Tutorial Block', () => { - const text = `[block:html] + it('Custom Default Block', () => { + const text = `[block:tutorial-tile] { "backgroundColor": "#ffffff", "title": "Tutorial Title", From 4e7408703b6f9a3740ec4140716b9da5c671f9d4 Mon Sep 17 00:00:00 2001 From: Gabriel Ratcliff Date: Thu, 22 Oct 2020 14:08:10 -0400 Subject: [PATCH 6/6] fix: updating snapshot per copy --- .../__snapshots__/magic-block-parser.test.js.snap | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/__tests__/__snapshots__/magic-block-parser.test.js.snap b/__tests__/__snapshots__/magic-block-parser.test.js.snap index 150bcb699..86efb424b 100644 --- a/__tests__/__snapshots__/magic-block-parser.test.js.snap +++ b/__tests__/__snapshots__/magic-block-parser.test.js.snap @@ -212,6 +212,13 @@ Object { } `; +exports[`Parse Magic Blocks Custom Default Block 1`] = ` +Object { + "children": Array [], + "type": "root", +} +`; + exports[`Parse Magic Blocks Custom HTML Block 1`] = ` Object { "children": Array [ @@ -236,13 +243,6 @@ Object { } `; -exports[`Parse Magic Blocks Custom Tutorial Block 1`] = ` -Object { - "children": Array [], - "type": "root", -} -`; - exports[`Parse Magic Blocks Embed Blocks 1`] = ` Object { "children": Array [