-
Notifications
You must be signed in to change notification settings - Fork 109
Description
Hello,
I think I found a bug in the react-tinymce component. We have an application where the richttext editor becomes readonly/editable depending on other parts of the form. Due to this changes the props can change. We don't set a specific id for the react-tinymce. The component takes care to set its own id.
in /lib/components/TinyMCE.js line 52
componentWillMount() {
this.id = this.id || this.props.id || uuid();
},
But when props changes it sets its this.id to what ever is in the nextProps.id. If you haven't set an id in the props this is set to undefined and the component loses its id which causes other errors later in our code.
in /lib/components/TinyMCE.js line 61
componentWillReceiveProps(nextProps) {
if (!isEqual(this.props.config, nextProps.config) || !isEqual(this.props.id, nextProps.id)) {
this.id = nextProps.id;
this._init(clone(nextProps.config), nextProps.content);
return;
}
We wrote a wrapper around the component for now which uses the library's uuid() function to set a unique id and always hand it over to the tinyemce component.
import TinyMCE from 'react-tinymce'
import React, {Component} from 'react';
import tinymceUUID from 'react-tinymce/lib/helpers/uuid';
class _TinyMCE extends Component {
constructor(props) {
super(props)
this.id = tinymceUUID()
}
render() {
return (<TinyMCE ref={(editor)=>{this.editor=editor}} {...this.props} id={this.id}/>)
}
Hope that helps.