The highlight ceases to exist when the input field is edited.

arnonrdp commented 11 months ago

The highlight ceases to exist when the input field is edited. It also stops working when I change the language.

When this occurs, I receive the following message in the browser console:

Element previously highlighted. To highlight again, first unset `dataset.highlighted`.
<code class="hljs language-json" style="top: 0px; left: 0px; font-size: 13px; padding: 0px 20px 20px;" data-highlighted="yes">{ "Hello": "World" } </code>

https://github.com/justcaliturner/simple-code-editor/assets/26576201/40e646f8-f615-4fce-b392-a3cd99e2c8d3

Here is the snippet of my code:

<CodeEditor
  :class="hljs"
  font-size="13px"
  :languages="[
    ['json', 'JSON'],
    ['yml', 'YAML']
  ]"
  v-model="value"
  width="100%"
  @lang="getLanguage"
/>

// <script setup> // Composition API
import hljs from 'highlight.js'
import CodeEditor from 'simple-code-editor'

Could anyone tell me if I'm missing something? @justcaliturner, any ideas?

rohitasare7 commented 11 months ago

I am facing the same issue

rohitasare7 commented 11 months ago

@arnonrdp were you able to fix this?

arnonrdp commented 11 months ago

No, @rohitasare7.

I replaced this lib with this one: https://github.surmon.me/vue-codemirror

xmow49 commented 10 months ago

same problem. But I rolled back to highlight.js 11.8.0 and it worked.

NitroLine commented 9 months ago

Fixed by adding this in your package.json and reinstall simple-code-editor

  "overrides": {
    "simple-code-editor": {
      "highlight.js": "~11.8.0"
    }
  },

MiguelAleixo commented 7 months ago

Same problem here, I changing my dependencies on package.json to:

   "highlight.js": "11.8.0",
   "simple-code-editor": "^2.0.8"

Then just delete my yarn.lock (package.lock) and the node_modules and finally install again the dependencies with yarn or npm! Works perfectly and doesn't give any more errors in the console.

To more details see this: https://github.com/justcaliturner/simple-code-editor/pull/45

justcaliturner / simple-code-editor

The highlight ceases to exist when the input field is edited. #38