ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: move React flushSync to microtask (#3188)

Browse Source 
To avoid seeing the `Warning: flushSync was called from inside a lifecycle method. React cannot flush when React is already rendering. Consider moving this call to a scheduler task or micro task.` error, we need to move the `flushSync()` code that avoids automatic batching to a microtask to not fire a lifecycle event `setState()` during rendering.

Fixes warning introduced in #2985
This commit is contained in:
Daniel Spitzer
2022-09-13 20:36:35 +02:00
committed by GitHub
parent 1cc75c058c
commit 9093cdfcf5
1 changed files with 21 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/react/src/ReactRenderer.tsx
View File

@@ -78,6 +78,7 @@ export class ReactRenderer<R = unknown, P = unknown> {
this.reactElement = <Component {...props } /> this.reactElement = <Component {...props } />
queueMicrotask(() => {
flushSync(() => { flushSync(() => {
if (this.editor?.contentComponent) { if (this.editor?.contentComponent) {
this.editor.contentComponent.setState({ this.editor.contentComponent.setState({
@@ -88,6 +89,7 @@ export class ReactRenderer<R = unknown, P = unknown> {
}) })
} }
}) })
})
} }
updateProps(props: Record<string, any> = {}): void { updateProps(props: Record<string, any> = {}): void {
@@ -100,6 +102,7 @@ export class ReactRenderer<R = unknown, P = unknown> {
} }
destroy(): void { destroy(): void {
queueMicrotask(() => {
flushSync(() => { flushSync(() => {
if (this.editor?.contentComponent) { if (this.editor?.contentComponent) {
const { renderers } = this.editor.contentComponent.state const { renderers } = this.editor.contentComponent.state
@@ -111,5 +114,6 @@ export class ReactRenderer<R = unknown, P = unknown> {
}) })
} }
}) })
})
} }
} }