ListNode dangerously executes update logic on createDOM #3227
Description
createDOM was designed to render on the DOM. It can happen synchronously and asynchronously but ultimately it translates node data into DOM.
List leverages createDOM to do a last-minute update logic, in particular in updateChildrenListItemValue
createDOM(config: EditorConfig): HTMLElement {
const element = document.createElement('li');
const parent = this.getParent();
if ($isListNode(parent)) {
updateChildrenListItemValue(parent);
updateListItemChecked(element, this, null, parent);
}
element.value = this.__value;
$setListItemThemeClassNames(element, config.theme, this);
return element;
}
export function updateChildrenListItemValue(
list: ListNode,
children?: Array<ListItemNode>,
): void {
(children || list.getChildren()).forEach((child: ListItemNode) => {
const prevValue = child.getValue();
const nextValue = $getListItemValue(child);
if (prevValue !== nextValue) {
child.setValue(nextValue);
}
});
}
This is dangerous because the error-recovery mechanism only applies to the update and transforms, not the reconciliation; and this can translate to a crashed UI and potentially bad collab updates.