feat: support MDX v2#166
Conversation
wooorm
left a comment
wooorm
left a comment
There was a problem hiding this comment.
Awesome, thanks for taking this on @kentcdodds!
There was a bug in your code, but with my suggestion, this change should work in all Gatsby, MDX, and remark versions (because the feature it depends on has worked from the start, 5 years ago!): not a breaking change (although, of course: trust but verify)
BREAKING CHANGE: You need to use MDX v2 for this to work
Codecov Report
@@ Coverage Diff @@
## master #166 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 17 17
Lines 300 299 -1
Branches 94 94
=========================================
- Hits 300 299 -1
Continue to review full report at Codecov.
|
kentcdodds
left a comment
kentcdodds
left a comment
There was a problem hiding this comment.
This is ready to go 👍
| // convert the HTML string into an AST | ||
| const htmlElement = htmlToHast(html); | ||
|
|
||
| // set the paragraphNode.data with the necessary properties |
There was a problem hiding this comment.
@wooorm, thanks so much for your help on this one. I'm not sure I understand how this works (I'm pretty sure the paragaphNode's type is still paragraph, but somehow it changes to the data.hName property when the AST is compiled to HTML 🤷♂️
In any case, this is great! And it's nice to know that we're future-proof and completely backward compatible :)
There was a problem hiding this comment.
No problem!
The paragraph is till a paragraph. But it defined (though .data) that it should turn into something else when going to HTML. It defines an element name, props, and children for that!
So, when going from markdown to HTML, the process sees that there is something else defined rather than the normal markdown children, and it’ll use that instead
|
@all-contributors please add @wooorm for review and code |
|
I've put up a pull request to add @wooorm! 🎉 |
|
🎉 This PR is included in version 4.2.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
2 participants
What: convert the HTML to an AST using
parse5andhast-util-from-parse5Why: Support MDX v2
How: add a simple utility function to convert a string of HTML to a hast and replace the link node with the element node.
Checklist:
cc @wooorm please confirm that currently remark does not support
elementnodes. When I tested this (with remark v13), I got the error:Cannot handle unknown node 'element'.Once remark supports this, then we should only need minor changes to this PR for things to work I think.
BREAKING CHANGE: You need to use MDX v2 (or remark v??) for this to work.