change event and re-render on state change

[dougnorton]

Periodically I update some state which causes the CKEditor to re-render. If I'm typing into the editor at the same time the state update happens, I loose text and the cursor jumps to the beginning of the text.

I have a change to the example.js (below) that causes the issue. Just run the example and start typing in the CKEditor.

Is this an issue or is it just the way I have it coded?

const React = require('react');
const ReactDOM = require('react-dom');
import CKEditor from "../src";

class Example extends React.Component {
  constructor(props){
    super(props);

    //State initialization
    this.state = {
      content: "Hello World",
      periodic: 'b'
    };
    this.setContent = this.setContent.bind(this)
    this.onChange = this.onChange.bind(this);

    setInterval(() => this.cycleUpdate(), 1000);
  }

  cycleUpdate() {
    this.setState({
        periodic: this.state.periodic + 'a'
    });
  }

  //------ Test for race condition ------ //
  setContent(){
    console.log("Setting content");
    this.setState({
      content: "Hello World " + Math.random()
    })
  }

  onChange(evt){
    this.setState({
        content: evt.editor.getData()
    });
    console.log("onChange fired with event info: ",evt, "and data: ",evt.editor.getData());
  }

  onBlur(evt){
    console.log("onBlur fired with event info: ",evt);
  }

  afterPaste(evt){
    console.log("afterPaste fired with event info: ",evt);
  }

  render() {
    return (
      <div>
        <button onClick={() => this.setContent()} children='Set content' />
        <CKEditor
          content={this.state.content}
          events={{
            blur: this.onBlur,
            afterPaste: this.afterPaste,
            change: this.onChange
          }}
        />
      </div>
    );
  }
}

ReactDOM.render(
  <Example />,
  document.getElementById('example')
);

[pmonty]

Having a similar issue, if i type the character i entered disappears and it goes to the start of the editor. Any idea? If i use 1.0.5 instead of @latest and use the onChange event it works though.

[offaxis]

+1 I experienced this bug on receiving WebSocket MessageEvent !

[sagarguhe]

+1