Ionaru/easy-markdown-editor

3.0 rewrite

Ionaru opened this issue ยท 14 comments

Is your feature request related to a problem? Please describe.
Current codebase of the editor contains a lot of legacy code, is difficult to maintain and depends on a toolchain that is no longer optimal anno 2022.

This is basically my wish list for v3.0.

Describe the solution you'd like
A complete rewrite of the codebase, split code over multiple files, written in TypeScript and SCSS.

Describe alternatives you've considered

  • Keep the editor as it is, difficult to maintain and improve, I don't think this is feasible long-term.
  • Slowly migrate to more modern code by rewriting parts, chance of being stuck inbetween legacy and modern code is high. Also difficult to keep the editor working like it did with the old code.

Additional context

  • Fully ESM (#262).
  • Ability to only import parts of the editor that the user needs (#167).
  • CodeMirror 6 (#324).
  • Ability to use plugins (#391).
  • Easier event hooks.
  • No bloated icon downloads (#491)
  • Ability to use custom icons (raw SVG?)
  • No automatic textarea detection (no magic bahaviour / side-effects).
  • Typescript
  • SCSS
  • Modern toolchain (Rollup?)
  • Updated standard look
  • Standard dark mode
  • Modern version of marked (#561)

Progress

You can follow progress on the https://github.com/Ionaru/easy-markdown-editor/tree/v3 branch.

Part of the modern toolchain could also be Vite.

npm create vite@latest easy-markdown-editor -- --template vanilla-ts
cd easy-markdown-editor
npm install
npm run dev

This makes it easy to develop with hot reload.

I agree and is something I'm considering, it does seem to be more focused on web applications and less on packages like easymde. Also it uses Rollup under the hood anyway.

A build command that bundles your code with Rollup, pre-configured to output highly optimized static assets for production.
https://vitejs.dev/guide/

Maybe the new version of the editor should be a custom Web Component? The editor could be built using Vue and exported to run anywhere.

Edit 2022-11-16: I've looked into this, if the editor were a Web Component, providing options and other JavaScript API features would be difficult for any user of the editor.

would be nice to have the possibility to toggle the spell-checker on and off while writing

would be nice to have the possibility to toggle the spell-checker on and off while writing

I think the spellchecker should be removed since browsers already come with built-in spellcheckers anyways.

would be nice to have the possibility to toggle the spell-checker on and off while writing

I think the spellchecker should be removed since browsers already come with built-in spellcheckers anyways.

I can still see some use for it with for forms in languages that a browser would not be set to. But maybe off by default?

I can still see some use for it with for forms in languages that a browser would not be set to. But maybe off by default?

In that case it is arguably useful. On the other hand it would arguably be nice to drop the dependency too tho which would result in less code, reduced bundle size and a smaller API.

image

Hello. I tried to migrate the current codebase to rollup, and managed to pass all the tests.

Although the changes are not extensive, since this involves replacing a build system, it requires careful planning. I think my causal work is not sufficient to make a pull request.
Instead, I think it is better to put what I have done here, which may provide some useful insights.

I've now pushed the https://github.com/Ionaru/easy-markdown-editor/tree/v3 branch with the current (incomplete) state of the rewrite.

Can I recommend documentation for how to test as a first class concern?

I'm currently facing an issue where due to our various customisations, the keyboard shortcuts have broken, so I'm currently going through and writing tests. But writing tests for this library is difficult with React Testing Library as JSDOM doesn't behave particularly well (eg jsdom/jsdom#3002 jsdom/jsdom#1937).

So basically, the ask is for documentation that advises about how to test code that uses this library.

I'm happy to help, this is something I'm passionate about.

I've now pushed the https://github.com/Ionaru/easy-markdown-editor/tree/v3 branch with the current (incomplete) state of the rewrite.

Hello @Ionaru !
You doing great work.
Could you please share any updates on it? Any status or progress of 3.0

Thanks a lot

I've now pushed the https://github.com/Ionaru/easy-markdown-editor/tree/v3 branch with the current (incomplete) state of the rewrite.

Hello @Ionaru ! You doing great work. Could you please share any updates on it? Any status or progress of 3.0

Thanks a lot

It's starting to look like another abandoned library =(

Not abandoned.