Fix memory leak with EditorContext (facebook#1767)

* Fix memory leak with EditorContext * Fix flow * Fix prettier
ChahrazedIs · Apr 21, 2022 · 8ef3f1c · 8ef3f1c
1 parent 779762d
commit 8ef3f1c
Show file tree

Hide file tree

Showing 39 changed files with 96 additions and 138 deletions.
diff --git a/examples/decorators.md b/examples/decorators.md
@@ -21,7 +21,7 @@ export class VideoNode extends DecoratorNode {
     this.__url = url;
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const div = document.createElement('div');
     div.style.display = 'contents';
     return div;

diff --git a/packages/lexical-code/flow/LexicalCode.js.flow b/packages/lexical-code/flow/LexicalCode.js.flow
@@ -23,7 +23,7 @@ declare export class CodeNode extends ElementNode {
   static getType(): string;
   static clone(node: CodeNode): CodeNode;
   constructor(key?: NodeKey): void;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   updateDOM(prevNode: CodeNode, dom: HTMLElement): boolean;
   insertNewAfter(
     selection: RangeSelection,
@@ -54,12 +54,12 @@ declare export class CodeHighlightNode extends TextNode {
   constructor(text: string, highlightType?: string, key?: NodeKey): void;
   static getType(): string;
   static clone(node: CodeHighlightNode): CodeHighlightNode;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
-  updateDOM<EditorContext>(
+  createDOM(config: EditorConfig): HTMLElement;
+  updateDOM(
     // $FlowFixMe
     prevNode: CodeHighlightNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean;
   setFormat(format: number): this;
 }

diff --git a/packages/lexical-code/src/index.js b/packages/lexical-code/src/index.js
@@ -90,7 +90,7 @@ export class CodeHighlightNode extends TextNode {
     );
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const element = super.createDOM(config);
     const className = getHighlightThemeClass(
       config.theme,
@@ -100,11 +100,11 @@ export class CodeHighlightNode extends TextNode {
     return element;
   }
 
-  updateDOM<EditorContext>(
+  updateDOM(
     // $FlowFixMe
     prevNode: CodeHighlightNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean {
     const update = super.updateDOM(prevNode, dom, config);
     const prevClassName = getHighlightThemeClass(
@@ -174,7 +174,7 @@ export class CodeNode extends ElementNode {
   }
 
   // View
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const element = document.createElement('code');
     addClassNamesToElement(element, config.theme.code);
     element.setAttribute('spellcheck', 'false');

diff --git a/packages/lexical-hashtag/LexicalHashtag.d.ts b/packages/lexical-hashtag/LexicalHashtag.d.ts
@@ -13,7 +13,7 @@ export declare class HashtagNode extends TextNode {
   static getType(): string;
   static clone(node: HashtagNode): HashtagNode;
   constructor(text: string, key?: NodeKey);
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   canInsertTextBefore(): boolean;
   isTextEntity(): true;
 }

diff --git a/packages/lexical-hashtag/flow/LexicalHashtag.js.flow b/packages/lexical-hashtag/flow/LexicalHashtag.js.flow
@@ -15,7 +15,7 @@ declare export class HashtagNode extends TextNode {
   static getType(): string;
   static clone(node: HashtagNode): HashtagNode;
   constructor(text: string, key?: NodeKey): void;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   canInsertTextBefore(): boolean;
   isTextEntity(): true;
 }

diff --git a/packages/lexical-hashtag/src/LexicalHashtagNode.js b/packages/lexical-hashtag/src/LexicalHashtagNode.js
@@ -25,7 +25,7 @@ export class HashtagNode extends TextNode {
     super(text, key);
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const element = super.createDOM(config);
     addClassNamesToElement(element, config.theme.hashtag);
     return element;

diff --git a/packages/lexical-link/LexicalLink.d.ts b/packages/lexical-link/LexicalLink.d.ts
@@ -22,11 +22,11 @@ export declare class LinkNode extends ElementNode {
   static getType(): string;
   static clone(node: LinkNode): LinkNode;
   constructor(url: string, key?: NodeKey);
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
-  updateDOM<EditorContext>(
+  createDOM(config: EditorConfig): HTMLElement;
+  updateDOM(
     prevNode: LinkNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean;
   static importDOM(): DOMConversionMap | null;
   getURL(): string;

diff --git a/packages/lexical-link/flow/LexicalLink.js.flow b/packages/lexical-link/flow/LexicalLink.js.flow
@@ -21,11 +21,11 @@ declare export class LinkNode extends ElementNode {
   static getType(): string;
   static clone(node: LinkNode): LinkNode;
   constructor(url: string, key?: NodeKey): void;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
-  updateDOM<EditorContext>(
+  createDOM(config: EditorConfig): HTMLElement;
+  updateDOM(
     prevNode: LinkNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean;
   static importDOM(): DOMConversionMap | null;
   getURL(): string;

diff --git a/packages/lexical-link/src/index.js b/packages/lexical-link/src/index.js
@@ -36,18 +36,18 @@ export class LinkNode extends ElementNode {
     this.__url = url;
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const element = document.createElement('a');
     element.href = this.__url;
     addClassNamesToElement(element, config.theme.link);
     return element;
   }
 
-  updateDOM<EditorContext>(
+  updateDOM(
     // $FlowFixMe: not sure how to fix this
     prevNode: LinkNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean {
     // $FlowFixMe: not sure how to fix this
     const anchor: HTMLAnchorElement = dom;

diff --git a/packages/lexical-list/src/LexicalListItemNode.js b/packages/lexical-list/src/LexicalListItemNode.js
@@ -48,17 +48,17 @@ export class ListItemNode extends ElementNode {
 
   // View
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const element = document.createElement('li');
     element.value = getListItemValue(this);
     $setListItemThemeClassNames(element, config.theme, this);
     return element;
   }
 
-  updateDOM<EditorContext>(
+  updateDOM(
     prevNode: ListItemNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean {
     //$FlowFixMe - this is always HTMLListItemElement
     dom.value = getListItemValue(this);

diff --git a/packages/lexical-list/src/LexicalListNode.js b/packages/lexical-list/src/LexicalListNode.js
@@ -55,7 +55,7 @@ export class ListNode extends ElementNode {
 
   // View
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const tag = this.__tag;
     const dom = document.createElement(tag);
     if (this.__start !== 1) {
@@ -65,10 +65,10 @@ export class ListNode extends ElementNode {
     return dom;
   }
 
-  updateDOM<EditorContext>(
+  updateDOM(
     prevNode: ListNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean {
     if (prevNode.__tag !== this.__tag) {
       return true;

diff --git a/packages/lexical-overflow/LexicalOverflow.d.ts b/packages/lexical-overflow/LexicalOverflow.d.ts
@@ -12,7 +12,7 @@ export declare class OverflowNode extends ElementNode {
   static getType(): string;
   static clone(node: OverflowNode): OverflowNode;
   constructor(key?: NodeKey);
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   updateDOM(prevNode: OverflowNode, dom: HTMLElement): boolean;
   insertNewAfter(selection: RangeSelection): null | LexicalNode;
   excludeFromCopy(): boolean;

diff --git a/packages/lexical-overflow/flow/LexicalOverflow.js.flow b/packages/lexical-overflow/flow/LexicalOverflow.js.flow
@@ -12,7 +12,7 @@ declare export class OverflowNode extends ElementNode {
   static getType(): string;
   static clone(node: OverflowNode): OverflowNode;
   constructor(key?: NodeKey): void;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   updateDOM(prevNode: OverflowNode, dom: HTMLElement): boolean;
   insertNewAfter(selection: RangeSelection): null | LexicalNode;
   excludeFromCopy(): boolean;

diff --git a/packages/lexical-overflow/src/index.js b/packages/lexical-overflow/src/index.js
@@ -25,7 +25,7 @@ export class OverflowNode extends ElementNode {
     this.__type = 'overflow';
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const div = document.createElement('span');
     const className = config.theme.characterLimit;
     if (typeof className === 'string') {

diff --git a/packages/lexical-playground/src/nodes/EmojiNode.jsx b/packages/lexical-playground/src/nodes/EmojiNode.jsx
@@ -27,7 +27,7 @@ export class EmojiNode extends TextNode {
     this.__className = className;
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const dom = document.createElement('span');
     const inner = super.createDOM(config);
     dom.className = this.__className;
@@ -36,10 +36,10 @@ export class EmojiNode extends TextNode {
     return dom;
   }
 
-  updateDOM<EditorContext>(
+  updateDOM(
     prevNode: TextNode,
     dom: HTMLElement,
-    config: EditorConfig<EditorContext>,
+    config: EditorConfig,
   ): boolean {
     // $FlowFixMe: this will always be an element or null
     const inner: null | HTMLElement = dom.firstChild;

diff --git a/packages/lexical-playground/src/nodes/EquationNode.jsx b/packages/lexical-playground/src/nodes/EquationNode.jsx
@@ -128,7 +128,7 @@ export class EquationNode extends DecoratorNode<React$Node> {
     this.__inline = inline ?? false;
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     return document.createElement(this.__inline ? 'span' : 'div');
   }
 

diff --git a/packages/lexical-playground/src/nodes/ExcalidrawNode/index.jsx b/packages/lexical-playground/src/nodes/ExcalidrawNode/index.jsx
@@ -177,7 +177,7 @@ export class ExcalidrawNode extends DecoratorNode<React$Node> {
   }
 
   // View
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const span = document.createElement('span');
     const theme = config.theme;
     const className = theme.image;

diff --git a/packages/lexical-playground/src/nodes/ImageNode.jsx b/packages/lexical-playground/src/nodes/ImageNode.jsx
@@ -531,7 +531,7 @@ export class ImageNode extends DecoratorNode<React$Node> {
 
   // View
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const span = document.createElement('span');
     const theme = config.theme;
     const className = theme.image;

diff --git a/packages/lexical-playground/src/nodes/KeywordNode.js b/packages/lexical-playground/src/nodes/KeywordNode.js
@@ -20,7 +20,7 @@ export class KeywordNode extends TextNode {
     return new KeywordNode(node.__text, node.__key);
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const dom = super.createDOM(config);
     dom.style.cursor = 'default';
     dom.className = 'keyword';

diff --git a/packages/lexical-playground/src/nodes/MentionNode.js b/packages/lexical-playground/src/nodes/MentionNode.js
@@ -29,7 +29,7 @@ export class MentionNode extends TextNode {
     this.__mention = mentionName;
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const dom = super.createDOM(config);
     dom.style.cssText = mentionStyle;
     dom.className = 'mention';

diff --git a/packages/lexical-playground/src/nodes/StickyNode.jsx b/packages/lexical-playground/src/nodes/StickyNode.jsx
@@ -291,7 +291,7 @@ export class StickyNode extends DecoratorNode<React$Node> {
     this.__color = color;
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const div = document.createElement('div');
     div.style.display = 'contents';
     return div;

diff --git a/packages/lexical-playground/src/nodes/TypeaheadNode.js b/packages/lexical-playground/src/nodes/TypeaheadNode.js
@@ -20,7 +20,7 @@ export class TypeaheadNode extends TextNode {
     return 'typeahead';
   }
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const dom = super.createDOM(config);
     dom.style.cssText = 'color: #ccc;';
     return dom;

diff --git a/packages/lexical-react/src/DEPRECATED_useLexical.js b/packages/lexical-react/src/DEPRECATED_useLexical.js
@@ -19,8 +19,7 @@ import {useMemo} from 'react';
 
 import useLexicalEditor from './DEPRECATED_useLexicalEditor';
 
-export default function useLexical<EditorContext>(editorConfig: {
-  context?: EditorContext,
+export default function useLexical(editorConfig: {
   disableEvents?: boolean,
   editorState?: EditorState,
   namespace?: string,

diff --git a/packages/lexical-react/src/LexicalComposer.jsx b/packages/lexical-react/src/LexicalComposer.jsx
@@ -51,8 +51,7 @@ export default function LexicalComposer({
       let editor = initialEditor || null;
 
       if (editor === null) {
-        const newEditor = createEditor<LexicalComposerContextType>({
-          context,
+        const newEditor = createEditor({
           namespace,
           nodes,
           onError: (error) => onError(error, newEditor),

diff --git a/packages/lexical-rich-text/LexicalRichText.d.ts b/packages/lexical-rich-text/LexicalRichText.d.ts
@@ -15,14 +15,13 @@ import type {
   LexicalEditor,
 } from 'lexical';
 import {ElementNode} from 'lexical';
-
 export type InitialEditorStateType = null | string | EditorState | (() => void);
 
 export declare class QuoteNode extends ElementNode {
   static getType(): string;
   static clone(node: QuoteNode): QuoteNode;
   constructor(key?: NodeKey);
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   updateDOM(prevNode: QuoteNode, dom: HTMLElement): boolean;
   insertNewAfter(): ParagraphNode;
   collapseAtStart(): true;
@@ -36,7 +35,7 @@ export declare class HeadingNode extends ElementNode {
   static clone(node: HeadingNode): HeadingNode;
   constructor(tag: HeadingTagType, key?: NodeKey);
   getTag(): HeadingTagType;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   updateDOM(prevNode: HeadingNode, dom: HTMLElement): boolean;
   static importDOM(): DOMConversionMap | null;
   insertNewAfter(): ParagraphNode;

diff --git a/packages/lexical-rich-text/flow/LexicalRichText.js.flow b/packages/lexical-rich-text/flow/LexicalRichText.js.flow
@@ -22,7 +22,7 @@ declare export class QuoteNode extends ElementNode {
   static getType(): string;
   static clone(node: QuoteNode): QuoteNode;
   constructor(key?: NodeKey): void;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   updateDOM(prevNode: QuoteNode, dom: HTMLElement): boolean;
   insertNewAfter(): ParagraphNode;
   collapseAtStart(): true;
@@ -38,7 +38,7 @@ declare export class HeadingNode extends ElementNode {
   static clone(node: HeadingNode): HeadingNode;
   constructor(tag: HeadingTagType, key?: NodeKey): void;
   getTag(): HeadingTagType;
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement;
+  createDOM(config: EditorConfig): HTMLElement;
   updateDOM(prevNode: HeadingNode, dom: HTMLElement): boolean;
   static importDOM(): DOMConversionMap | null;
   insertNewAfter(): ParagraphNode;

diff --git a/packages/lexical-rich-text/src/index.js b/packages/lexical-rich-text/src/index.js
@@ -98,7 +98,7 @@ export class QuoteNode extends ElementNode {
 
   // View
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const element = document.createElement('blockquote');
     addClassNamesToElement(element, config.theme.quote);
     return element;
@@ -158,7 +158,7 @@ export class HeadingNode extends ElementNode {
 
   // View
 
-  createDOM<EditorContext>(config: EditorConfig<EditorContext>): HTMLElement {
+  createDOM(config: EditorConfig): HTMLElement {
     const tag = this.__tag;
     const element = document.createElement(tag);
     const theme = config.theme;