bustle/mobiledoc-kit

Migrating content to mobiledoc format - parsing html server side

Closed this issue · 11 comments

kmoskwiak commented

Hi!
Is there a way to parse existing html to mobiledoc format server side? I want to migrate my content to mobiledoc format.

In node.js I was trying to do something like this:

const parser = require('../mobiledoc-kit/dist/commonjs/mobiledoc-kit/parsers/html').default;
const builder = require('../mobiledoc-kit/dist/commonjs/mobiledoc-kit/models/post-node-builder').default;
const p = new parser(builder);
p.parse('<p> hello </p>');

but it requires browser environment (error: ReferenceError: document is not defined);

tylr commented

Hey @kmoskwiak we do this at Bustle @zfoster can provide details.

kmoskwiak commented

@zfoster it would be great

zfoster commented

Hey @kmoskwiak. It took a little bit to make this generic. The index.js file can be what you run or loop through for your content, but that is the entry point. We create a dom context and let Mobiledoc do its thing after sanitizing the html to remove tags that aren't supported (think <small>). Happy to help, I haven't tried to run through this gist and renamed some things so there may be a few errors, so let me know if I need to make any corrections.

A little side note: Our refetchMediaCards is just a function that calls GraphQL mutations to rehost images or fetch embeds to match the oembed spec. You can do anything there, so I didn't include that file.

https://gist.github.com/zfoster/20744c3377d2582e503ce67cb0a464ab

  • ❤️2
zfoster commented

I hope this helps @kmoskwiak. Feel free to ping here with any questions

kmoskwiak commented

Hi :) I've just successfully run the gist with few changes. It looks really good! Thank you :)

zfoster commented

Awesome!

kmoskwiak commented

@zfoster I can upload working gist here for other people I you don't mind

zfoster commented
kmoskwiak commented

Working example based on @zfoster gist.
HTML is inside index.js.

Run npm install and npm start.

https://gist.github.com/kmoskwiak/98ceddca3ea4acdd0ddaccdbbe0a4fbc

zfoster commented

@bantic @mixonic thoughts on adding something to docs outside of this issue?

ErisDS commented

The Mobiledoc standard is awesome and we want to be able to easily move people from other platforms to using it. This requires conversion from HTML -> Mobiledoc and so I've been working on what I think is a simpler approach.

I have a WIP package here: https://github.com/TryGhost/Ghost-SDK/tree/master/packages/html-to-mobiledoc, but I'm running heavily into #648