Ionaru / Ionaru/easy-markdown-editor

SSR support

Open
#405 1 comment 3 reactions 0 assignees View on GitHub
Bug
Dominant language
JavaScript
Stars
3.1k
Forks
363
PR merge metrics
No merged PRs in 30d

Description

**Describe the bug**
I tried using this library in sveltekit, but theres a problem when doing server side rendering. When you first access the page that imports EasyMDE, you get a "navigator" is not defined error.
My guess to solve it is to move all the code that uses `navigator` into the EasyMDE constructor, so that it is not executed in import time, but in instantiation time.
In order to hack and make it work, i removed:
`import EasyMDE from 'easymde';`
and replaced it with:
```js
onMount(async () => {
const easymdeModule = await import('easymde');
const EasyMDE = easymdeModule.default;
});
```

**To Reproduce**
Steps to reproduce the behavior:
1. Go to [this repo](https://github.com/demetrius-mp/svelte-cms/tree/bug-report/easymde/ssr-support)
2. follow the [developing instructions](https://github.com/demetrius-mp/svelte-cms/tree/bug-report/easymde/ssr-support)
3. after running `npm run dev`, open the browser and you'll see the "navigator is not defined" message
4. refresh the page, and it will work just fine.

**Expected behavior**
The component should render without errors on SSR environment.

**Screenshots**
If applicable, add screenshots to help explain your problem.

** Version information **
- OS: Pop OS
- Browser: Chrome 96
- EasyMDE version: ^2.16.1

**Additional context**
Add any other context about the problem here.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.