search

Ionaru / easy-markdown-editor

EasyMDE: A simple, beautiful, and embeddable JavaScript Markdown editor. Delightful editing for beginners and experts alike. Features built-in autosaving and spell checking.
https://stackblitz.com/edit/easymde
MIT License
2.39k stars 316 forks source link

Using mde.value(newValue) messes up the editor #365

Open mokhosh opened 2 years ago

mokhosh commented 2 years ago

Describe the bug After updated to the latest version, when ever I use mde.value(someNewValue) to change the existing value after initializing the editor, the text jumps down and the caret is in the wrong place and doesn't respond to mouse clicks.

Version information

Ionaru commented 2 years ago

Could not reproduce this bug, mde.value('test') sets the editor correctly to "test" and the editor stays responsive.

editor

Maybe someNewValue has problematic input?

Please provide more information, like a video or screenshots.

Version information

OS: Windows Browser: Chrome 95 EasyMDE version: 2.15.0

Zignature commented 2 years ago

Are you using mde.value(someNewValue) or easyMDE.value(someNewValue)?

image

I guess the question is for the both of you 😏

Ionaru commented 2 years ago

In both cases I was referring to the variable that holds the EasyMDE instance.

Log1x commented 1 year ago

Sorry for bumping an old issue but I'm running into this when trying to use EasyMDE alongside Alpine.js. I made a Codepen that reproduces the bug.

https://codepen.io/Log1x/pen/MWPoVKN

I've tried refreshing codemirror as well as various settings and nothing seems to prevent the issue from happening.

Screenshot

I tried SimpleMDE as well and it suffers the same issue.

Is there any workaround I could try?

pankajgarkoti commented 8 months ago

+1

Been having this issue everytime I use .value("# some\n## markdown\n") for trying to change the text programmatically. Had the same issue with QuillJS too.

I am trying to use it inside a vue.js component if it matters. The exact error seen in the console is - 

Uncaught TypeError: Cannot read properties of undefined (reading 'map')
    at prepareMeasureForLine (easymde.js?v=50410f66:2594:21)
    at cursorCoords (easymde.js?v=50410f66:2875:29)
    at drawSelectionCursor (easymde.js?v=50410f66:3382:19)
    at prepareSelection (easymde.js?v=50410f66:3373:13)
    at TextareaInput.prepareSelection (easymde.js?v=50410f66:10356:22)
    at endOperation_R2 (easymde.js?v=50410f66:4113:48)
    at endOperations (easymde.js?v=50410f66:4079:11)
    at easymde.js?v=50410f66:4066:13
    at finishOperation (easymde.js?v=50410f66:2223:11)
    at endOperation (easymde.js?v=50410f66:4062:11)

Except for this one very crucial issue, the editor looks fantastic. Right now I am trying to implement a workaround by reinitialising the editor and putting the text in initialValue everytime as this works fine.

RemiDesgrange commented 7 months ago

I use the same trick as @pankajgarkoti but could not track down what was wrong in the value() function. It seems to create a div with top: XXpx where XX depends on the size of the text.

Since initialValue seems to call value() internally, Maybe it's a code mirror bug ? https://github.com/Ionaru/easy-markdown-editor/blob/master/src/js/easymde.js#L1897