refactor api to make per-page initialization a little easier

browser-extension/src/lib/enhancer.ts

@@ -1,7 +1,7 @@
 import type { OverTypeInstance } from '../overtype/overtype'
 
 /**
- * stores enough info about the location of a draft to:
+ * Stores enough info about the location of a draft to:
  * - display it in a table
  * - reopen the draft in-context
  */
@@ -10,15 +10,23 @@ export interface CommentSpot {
   type: string
 }
 
-/** wraps the textareas of a given platform with Gitcasso's enhancements */
+/** Wraps the textareas of a given platform with Gitcasso's enhancements. */
 export interface CommentEnhancer<Spot extends CommentSpot = CommentSpot> {
-  /** guarantees to only return a type within this list */
+  /** Guarantees to only return a type within this list. */
   forSpotTypes(): string[]
   /**
-   * whenever a new `textarea` is added to any webpage, this method is called.
-   * if we return non-null, then we become the handler for that text area.
+   * Whenever a new `textarea` is added to any webpage, this method is called.
+   * If we return non-null, then we become the handler for that text area.
    */
-  tryToEnhance(textarea: HTMLTextAreaElement): [OverTypeInstance, Spot] | null
+  tryToEnhance(textarea: HTMLTextAreaElement): Spot | null
+  /** This gets called the first time that `tryToEnhance` returns non-null. */
+  prepareForFirstEnhancement(): void
+  /**
+   * If `tryToEnhance` returns non-null, then this gets called.
+   * It is guaranteed that `prepareForFirstEnhancement` has been called
+   * exactly once since pageload before this gets called.
+   */
+  enhance(textarea: HTMLTextAreaElement, spot: Spot): OverTypeInstance
 
   tableIcon(spot: Spot): string
   tableTitle(spot: Spot): string

browser-extension/src/lib/enhancers/github.ts

@@ -29,7 +29,7 @@ export class GitHubAddCommentEnhancer implements CommentEnhancer<GitHubAddCommen
     return [...GITHUB_SPOT_TYPES]
   }
 
-  tryToEnhance(textarea: HTMLTextAreaElement): [OverTypeInstance, GitHubAddCommentSpot] | null {
+  tryToEnhance(_textarea: HTMLTextAreaElement): GitHubAddCommentSpot | null {
     // Only handle github.com domains TODO: identify GitHub Enterprise somehow
     if (window.location.hostname !== 'github.com') {
       return null
@@ -44,22 +44,22 @@ export class GitHubAddCommentEnhancer implements CommentEnhancer<GitHubAddCommen
     const [, owner, repo, numberStr] = match
     const slug = `${owner}/${repo}`
     const number = parseInt(numberStr!, 10)
-
     const unique_key = `github.com:${slug}:${number}`
-
-    const spot: GitHubAddCommentSpot = {
+    return {
       domain: 'github.com',
       number,
       slug,
       type: 'GH_PR_ADD_COMMENT',
       unique_key,
     }
-    return [this.createOvertypeFor(textarea), spot]
   }
 
-  private createOvertypeFor(ghCommentBox: HTMLTextAreaElement): OverTypeInstance {
+  prepareForFirstEnhancement(): void {
     OverType.setCodeHighlighter(hljsHighlighter)
-    const overtypeContainer = this.modifyDOM(ghCommentBox)
+  }
+
+  enhance(textArea: HTMLTextAreaElement, _spot: GitHubAddCommentSpot): OverTypeInstance {
+    const overtypeContainer = this.modifyDOM(textArea)
     return new OverType(overtypeContainer, {
       autoResize: true,
       minHeight: '102px',

browser-extension/src/lib/registries.ts

@@ -10,7 +10,8 @@ export interface EnhancedTextarea<T extends CommentSpot = CommentSpot> {
 }
 
 export class EnhancerRegistry {
-  private enhancers = new Set<CommentEnhancer<any>>()
+  private enhancers = new Set<CommentEnhancer>()
+  private preparedEnhancers = new Set<CommentEnhancer>()
 
   constructor() {
     // Register all available handlers
@@ -21,12 +22,17 @@ export class EnhancerRegistry {
     this.enhancers.add(handler)
   }
 
-  tryToEnhance(textarea: HTMLTextAreaElement): EnhancedTextarea<any> | null {
+  tryToEnhance(textarea: HTMLTextAreaElement): EnhancedTextarea | null {
     for (const enhancer of this.enhancers) {
       try {
-        const result = enhancer.tryToEnhance(textarea)
-        if (result) {
-          const [overtype, spot] = result
+        const spot = enhancer.tryToEnhance(textarea)
+        if (spot) {
+          // Prepare enhancer on first use
+          if (!this.preparedEnhancers.has(enhancer)) {
+            enhancer.prepareForFirstEnhancement()
+            this.preparedEnhancers.add(enhancer)
+          }
+          const overtype = enhancer.enhance(textarea, spot)
           return { enhancer, overtype, spot, textarea }
         }
       } catch (error) {
@@ -42,7 +48,7 @@ export class EnhancerRegistry {
 }
 
 export class TextareaRegistry {
-  private textareas = new Map<HTMLTextAreaElement, EnhancedTextarea<any>>()
+  private textareas = new Map<HTMLTextAreaElement, EnhancedTextarea>()
 
   register<T extends CommentSpot>(textareaInfo: EnhancedTextarea<T>): void {
     this.textareas.set(textareaInfo.textarea, textareaInfo)
@@ -56,7 +62,7 @@ export class TextareaRegistry {
     }
   }
 
-  get(textarea: HTMLTextAreaElement): EnhancedTextarea<any> | undefined {
+  get(textarea: HTMLTextAreaElement): EnhancedTextarea | undefined {
     return this.textareas.get(textarea)
   }
 }