handle multiple setup/teardown on a single page, also handle textarea reuse (#91 closes #76)

Author: nedtwigg

src/lib/enhancers/github/GitHubPrAppendEnhancer.tsx

@@ -56,12 +56,19 @@ export class GitHubPrAppendEnhancer implements CommentEnhancer<GitHubPrAppendSpo
   enhance(textArea: HTMLTextAreaElement, _spot: GitHubPrAppendSpot): OverTypeInstance {
     prepareGitHubHighlighter()
     const overtypeContainer = modifyDOM(textArea)
-    return new OverType(overtypeContainer, {
+    const overtype = new OverType(overtypeContainer, {
       ...commonGitHubOptions,
       minHeight: '102px',
       padding: 'var(--base-size-8)',
       placeholder: 'Add your comment here...',
     })[0]!
+    const listenForEmpty = new MutationObserver(() => {
+      if (textArea.value === '') {
+        overtype.updatePreview()
+      }
+    })
+    listenForEmpty.observe(textArea, { attributes: true, characterData: true })
+    return overtype
   }
 
   tableUpperDecoration(spot: GitHubPrAppendSpot): React.ReactNode {

src/lib/registries.ts

@@ -129,9 +129,15 @@ export class TextareaRegistry {
     this.sendEvent('ENHANCED', enhanced)
   }
 
+  private cleanupOvertype(overtype: OverTypeInstance) {
+    const container = overtype.element
+    OverType.instances.delete(container)
+    ;(container as any).overTypeInstance = undefined
+  }
   unregisterDueToModification(textarea: HTMLTextAreaElement): void {
     const enhanced = this.textareas.get(textarea)
     if (enhanced) {
+      this.cleanupOvertype(enhanced.overtype)
       this.sendEvent('DESTROYED', enhanced)
       this.textareas.delete(textarea)
     }