Example from doc not working (TypeError value must be string)
Open
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 406
- Forks
- 131
- Avg merge
- 2h 32m
- Merged PRs (30d)
- 2
Description
I've tried jodit-react with the most basic example I could find but it breaks after typing a few words in the editor.
Steps to reproduce:
- Go to: https://codesandbox.io/s/sleepy-colden-1twnp
- Type a few things in the editor
- Wait for a bit
- Watch it break with TypeError value must be string

Code to reproduce locally:
index.js
import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
const rootElement = document.getElementById("root");
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
rootElement
);
App.js
import React from "react";
import "./styles.css";
import Editor from "./Editor";
export default function App() {
return <Editor />;
}
Editor.js
import React, { useState, useRef } from "react";
import JoditEditor from "jodit-react";
const Example = ({}) => {
const editor = useRef(null);
const [content, setContent] = useState("");
const config = {
readonly: false // all options from https://xdsoft.net/jodit/doc/
};
return (
<JoditEditor
ref={editor}
value={content}
config={config}
tabIndex={1} // tabIndex of textarea
onBlur={(newContent) => setContent(newContent)} // preferred to use only this option to update the content for performance reasons
onChange={(newContent) => {}}
/>
);
};
export default Example;
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked CodeSandbox and the example files index.js, App.js, and Editor.js; reproduce the delayed TypeError and inspect the JoditEditor value, onBlur, and onChange usage. Done means the documented example continues accepting typed content without the reported TypeError.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100