Mike-Dax / gatsby-remark-videos

Embed html5 style looping videos in your Gatsby site direct from your markdown. Used on https://electricui.com
MIT License
13 stars 13 forks source link

Using with gatsby-plugin-mdx results in undefined HTML parent tag #12

Open muuvmuuv opened 4 years ago

muuvmuuv commented 4 years ago

I just added your plugin and it seems to work totally fine but looking at the generated code it seems that it has an undefined parent element. I couldn't find the source where it resolves to undefined.

My repo: https://github.com/muuvmuuv/portfolio (development branch)

I have not uploaded the videos yet, so you must remove the videos in content/projects/additive-tv/index.md and content/projects/influxe-gaming/index.md. After that add a video in one project file.

Bildschirmfoto 2020-03-02 um 21 02 46

muuvmuuv commented 4 years ago

I'm using YouTube now, because it makes more sense with large video files. Here is the link to the last commit that produced this bug: https://github.com/muuvmuuv/portfolio/tree/6684199f5762829b5fc2db4481bc66936f10e241

PaulBunker commented 4 years ago

You would need to change "html" to "jsx" on the following line https://github.com/Mike-Dax/gatsby-remark-videos/blob/master/src/index.js#L135

This is because the AST for mdx is slightly different

Change this into a self closing tag here https://github.com/Mike-Dax/gatsby-remark-videos/blob/d572c9f9114e2e5f8cfe7b986f87bf1c2fe622c3/src/index.js#L78

This is because jsx demands all tags to be closed