Open RihanArfan opened 4 years ago
Probably for the same reason browser spell check doesn't work. See https://github.com/Ionaru/easy-markdown-editor/issues/22
I note from the fix to #143 that native browser spell check is supported; however, I'm still struggling to get Grammarly to work properly.
From my investigations, with Grammarly disabled, when using inputStyle: 'contenteditable'
and nativeSpellcheck: true
the CodeMirror-code div is correctly annotated with contenteditable="true"
and spellcheck="true"
attributes, as follows:
<div class="CodeMirror-code" role="presentation" autocorrect="off" autocapitalize="off" spellcheck="true" contenteditable="true" tabindex="0" style="">
When Grammarly is enabled, the extension disables the browser spell check by setting spellcheck="false"
. I'm no expert but I think this is typical of "external" spell checking solutions.
However, Grammarly does not spell check the content correctly (spelling errors not highlighted).
I suspect that this is to do with CodeMirror effectively mirroring the actual content line by line:
e.g. <pre class=" CodeMirror-line " role="presentation">...
rather than there being an actual input field for Grammarly to intercept / decorate.
I think you are correct. I would suggest checking one of the demos on https://codemirror.net/ to see if the spellcheck is working there. Maybe this is something they can improve in Codemirror 6.
Did anyone manage to get this working?
Facing this issue as well, has anyone made nay progress on this? Also, the regular browser spell check doesn't really work, it just highlights the word in red, but doesn't have the default function (right click to see corrections).
Currently, the Grammarly browser plugins ignores text within HTML pre
tags (preformatted text). As CodeMirror 5 uses pre
tags for every line Grammarly will not work in EasyMDE. The use of the pre
tag is hardcoded into CodeMirror 5 in several places and can't be easily changed.
Grammarly does seem to work in CodeMirror 6 as div
tags are used for lines and not pre
tags.
If you want to play around with this in CodeMirror 5/EasyMDE and get Grammarly to at least recognize the text, do the following:
inputStyle
to contenteditable
. I think Grammarly should actually process pre
tags as block-level elements such as a div
. Perhaps Grammarly engineers have chosen to ignore the pre
tags, because it often contains code samples. However, this would be wrong looking at the purpose of the HTML element.
After some testing, Grammarly does seem to work with EasyMDE. However, only using the Grammarly Windows desktop app (https://www.grammarly.com/desktop/windows) in combination with Chrome or Edge. Firefox does not work. To be clear you have to install the Windows desktop app, not the browser plugins.
Also in EasyMDE set inputStyle
to contenteditable
.
After some testing, Grammarly does seem to work with EasyMDE. However, only using the Grammarly Windows desktop app (https://www.grammarly.com/desktop/windows) in combination with Chrome or Edge. Firefox does not work. To be clear you have to install the Windows desktop app, not the browser plugins.
Also in EasyMDE set
inputStyle
tocontenteditable
.
I've tried with chrome v100 and grammarly desktop and/or chrome extension (both together and alone) and could not make it work. I ignited the editor like this:
new EasyMDE({
element,
inputStyle: "contenteditable",
});
Any clues?
Describe the bug Grammarly, the browser extension which adds massively to the default autocorrect behaviour in the browser does not work inside EasyMDE.
To Reproduce Steps to reproduce the behaviour:
Expected behaviour Grammarly icon shows in the corner of the text field, and it underlines miss spelt words or incorrect grammar. It does this on every other text field, even other markdown and WYSIWYG editors.
Version information
Additional context https://github.com/sparksuite/simplemde-markdown-editor/issues/586