Restoring previous selection

Frikken loving this project!!

I have an auto save pipeline which will then result in a redux auto prop pass in, which then causes a rerender. This works okay from a content standpoint as it is simply reloading the content I just saved, however I am having problems with restoring the selection state.

At the moment I track all changes via the onChange event. Then when I receive the “persisted” state back from redux I want to try and restore the selection using the existing state that is currently on the component, but I can’t seem to get this to work.

Here is my current attempt:

// The state from props/redux.
const editorState = Raw.deserialize(this.props.editorState);

// Any existing tracked state.
const { editorState: existingEditorState } = this.state;

let selectionProps;

if (!!existingEditorState) {
  selectionProps = {
    anchorKey: existingEditorState.anchorKey,
    anchorOffset: existingEditorState.anchorOffset,
    focusKey: existingEditorState.focusKey,
    focusOffset: existingEditorState.focusOffset,
    isFocused: existingEditorState.isFocused,
    isBackward: existingEditorState.isBackward
  };
}

this.setState({
  editorState: !!props
    // Try re-set the existing selection.
    ? editorState.transform().moveTo(selectionProps).apply()
    // First time render, use as is. 
    : editorState
});

Any ideas? Have I completely misunderstood the API docs? 😃

[ianstormtaylor]

Yup, that’s right. The keys are randomly generated whenever you serialize/deserialize an State right now, so the selection won’t find the same nodes anymore. It seems like the better way to go would be to have the editor not need to re-load the identical state, since this would result in a lot of extra re-rendering since the immutable objects would also all be re-created.

[ianstormtaylor]

Going to close for now, glad that helped!