From 95a7ef186d75acfee1b5ee9d43f1610ed262f5ee Mon Sep 17 00:00:00 2001
From: Aagash Raaj <aagash.maridas@solitontech.com>
Date: Fri, 25 Aug 2023 15:18:59 +0530
Subject: [PATCH 01/11] Add firefox caret disappearing issue

---
 .../src/rich-text-editor/index.ts                | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/packages/nimble-components/src/rich-text-editor/index.ts b/packages/nimble-components/src/rich-text-editor/index.ts
index b88609bf97..222b4cd61b 100644
--- a/packages/nimble-components/src/rich-text-editor/index.ts
+++ b/packages/nimble-components/src/rich-text-editor/index.ts
@@ -101,6 +101,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public boldButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleBold().run();
+        this.focusEditorInFirefoxEnv();
     }
 
     /**
@@ -110,6 +111,7 @@ export class RichTextEditor extends FoundationElement {
     public boldButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleBold().run();
+            this.focusEditorInFirefoxEnv();
             return false;
         }
         return true;
@@ -121,6 +123,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public italicsButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleItalic().run();
+        this.focusEditorInFirefoxEnv();
     }
 
     /**
@@ -130,6 +133,7 @@ export class RichTextEditor extends FoundationElement {
     public italicsButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleItalic().run();
+            this.focusEditorInFirefoxEnv();
             return false;
         }
         return true;
@@ -141,6 +145,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public bulletListButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleBulletList().run();
+        this.focusEditorInFirefoxEnv();
     }
 
     /**
@@ -150,6 +155,7 @@ export class RichTextEditor extends FoundationElement {
     public bulletListButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleBulletList().run();
+            this.focusEditorInFirefoxEnv();
             return false;
         }
         return true;
@@ -161,6 +167,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public numberedListButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleOrderedList().run();
+        this.focusEditorInFirefoxEnv();
     }
 
     /**
@@ -170,6 +177,7 @@ export class RichTextEditor extends FoundationElement {
     public numberedListButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleOrderedList().run();
+            this.focusEditorInFirefoxEnv();
             return false;
         }
         return true;
@@ -347,6 +355,14 @@ export class RichTextEditor extends FoundationElement {
                 return false;
         }
     }
+
+    private focusEditorInFirefoxEnv(): void {
+        const browserInfo = navigator.userAgent;
+        if (browserInfo.includes('Firefox')) {
+            this.tiptapEditor.commands.blur();
+            this.tiptapEditor.commands.focus();
+        }
+    }
 }
 
 const nimbleRichTextEditor = RichTextEditor.compose({

From c3c75a72a07bcf43fe45e5cfa1d65d22e3fd5080 Mon Sep 17 00:00:00 2001
From: Aagash Raaj <aagash.maridas@solitontech.com>
Date: Fri, 25 Aug 2023 17:19:40 +0530
Subject: [PATCH 02/11] Link issue in comment

---
 packages/nimble-components/src/rich-text-editor/index.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/nimble-components/src/rich-text-editor/index.ts b/packages/nimble-components/src/rich-text-editor/index.ts
index 222b4cd61b..da0823c2aa 100644
--- a/packages/nimble-components/src/rich-text-editor/index.ts
+++ b/packages/nimble-components/src/rich-text-editor/index.ts
@@ -356,6 +356,10 @@ export class RichTextEditor extends FoundationElement {
         }
     }
 
+    // In Firefox browser, Once the editor gets focused, the blinking caret will be visible until we click format buttons (Bold, Italic ...) in the Firefox browser (Changing focus).
+    // But once the any of the buttons clicked, the editor internally has its focus but the blinking caret disappears.
+    // As a workaround, manually trigerring blur and setting focus on editor will hepls making the caret re-appears.
+    // It seems like this issue in not fixed in firefox browser yet, Created Issue https://github.com/ni/nimble/issues/1454 tracks removal of this workaround.
     private focusEditorInFirefoxEnv(): void {
         const browserInfo = navigator.userAgent;
         if (browserInfo.includes('Firefox')) {

From 709caea3efc6ef7afc4119d54e66b50023ddc4d3 Mon Sep 17 00:00:00 2001
From: Aagash Raaj <aagash.maridas@solitontech.com>
Date: Fri, 25 Aug 2023 17:44:13 +0530
Subject: [PATCH 03/11] Change files

---
 ...le-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json | 7 +++++++
 1 file changed, 7 insertions(+)
 create mode 100644 change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json

diff --git a/change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json b/change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json
new file mode 100644
index 0000000000..ca74fdfd3c
--- /dev/null
+++ b/change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Fix for Firefox caret disappearing issue",
+  "packageName": "@ni/nimble-components",
+  "email": "aagash.maridas@solitontech.com",
+  "dependentChangeType": "patch"
+}

From 4e6c4a39eb2919f879290f2e7e2c3ce9e112b812 Mon Sep 17 00:00:00 2001
From: Aagash Raaj <aagash.maridas@solitontech.com>
Date: Fri, 25 Aug 2023 17:44:37 +0530
Subject: [PATCH 04/11] Minor fix

---
 packages/nimble-components/src/rich-text-editor/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nimble-components/src/rich-text-editor/index.ts b/packages/nimble-components/src/rich-text-editor/index.ts
index da0823c2aa..443c39d7ba 100644
--- a/packages/nimble-components/src/rich-text-editor/index.ts
+++ b/packages/nimble-components/src/rich-text-editor/index.ts
@@ -358,7 +358,7 @@ export class RichTextEditor extends FoundationElement {
 
     // In Firefox browser, Once the editor gets focused, the blinking caret will be visible until we click format buttons (Bold, Italic ...) in the Firefox browser (Changing focus).
     // But once the any of the buttons clicked, the editor internally has its focus but the blinking caret disappears.
-    // As a workaround, manually trigerring blur and setting focus on editor will hepls making the caret re-appears.
+    // As a workaround, manually triggering blur and setting focus on editor will hepls making the caret re-appears.
     // It seems like this issue in not fixed in firefox browser yet, Created Issue https://github.com/ni/nimble/issues/1454 tracks removal of this workaround.
     private focusEditorInFirefoxEnv(): void {
         const browserInfo = navigator.userAgent;

From 710c577c0f4aea63f4f50c30991f38bbff2c2e69 Mon Sep 17 00:00:00 2001
From: aagash-ni <123377167+aagash-ni@users.noreply.github.com>
Date: Fri, 25 Aug 2023 17:50:25 +0530
Subject: [PATCH 05/11] Update mail ID in patch file

---
 ...-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json b/change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json
index ca74fdfd3c..45837b8b83 100644
--- a/change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json
+++ b/change/@ni-nimble-components-46b1fdfb-63b3-4a04-ac71-1124855a4e45.json
@@ -2,6 +2,6 @@
   "type": "patch",
   "comment": "Fix for Firefox caret disappearing issue",
   "packageName": "@ni/nimble-components",
-  "email": "aagash.maridas@solitontech.com",
+  "email": "123377167+aagash-ni@users.noreply.github.com",
   "dependentChangeType": "patch"
 }

From c7d71c2856a65e2da3670ba5f408511903af1c43 Mon Sep 17 00:00:00 2001
From: Aagash Raaj <aagash.maridas@solitontech.com>
Date: Fri, 25 Aug 2023 18:28:37 +0530
Subject: [PATCH 06/11] Address PR Comments

---
 .../src/rich-text-editor/index.ts             | 23 +++++++++----------
 1 file changed, 11 insertions(+), 12 deletions(-)

diff --git a/packages/nimble-components/src/rich-text-editor/index.ts b/packages/nimble-components/src/rich-text-editor/index.ts
index 443c39d7ba..21b253f3f9 100644
--- a/packages/nimble-components/src/rich-text-editor/index.ts
+++ b/packages/nimble-components/src/rich-text-editor/index.ts
@@ -101,7 +101,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public boldButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleBold().run();
-        this.focusEditorInFirefoxEnv();
+        this.focusEditorInFirefox();
     }
 
     /**
@@ -111,7 +111,7 @@ export class RichTextEditor extends FoundationElement {
     public boldButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleBold().run();
-            this.focusEditorInFirefoxEnv();
+            this.focusEditorInFirefox();
             return false;
         }
         return true;
@@ -123,7 +123,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public italicsButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleItalic().run();
-        this.focusEditorInFirefoxEnv();
+        this.focusEditorInFirefox();
     }
 
     /**
@@ -133,7 +133,7 @@ export class RichTextEditor extends FoundationElement {
     public italicsButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleItalic().run();
-            this.focusEditorInFirefoxEnv();
+            this.focusEditorInFirefox();
             return false;
         }
         return true;
@@ -145,7 +145,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public bulletListButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleBulletList().run();
-        this.focusEditorInFirefoxEnv();
+        this.focusEditorInFirefox();
     }
 
     /**
@@ -155,7 +155,7 @@ export class RichTextEditor extends FoundationElement {
     public bulletListButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleBulletList().run();
-            this.focusEditorInFirefoxEnv();
+            this.focusEditorInFirefox();
             return false;
         }
         return true;
@@ -167,7 +167,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public numberedListButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleOrderedList().run();
-        this.focusEditorInFirefoxEnv();
+        this.focusEditorInFirefox();
     }
 
     /**
@@ -177,7 +177,7 @@ export class RichTextEditor extends FoundationElement {
     public numberedListButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleOrderedList().run();
-            this.focusEditorInFirefoxEnv();
+            this.focusEditorInFirefox();
             return false;
         }
         return true;
@@ -357,10 +357,9 @@ export class RichTextEditor extends FoundationElement {
     }
 
     // In Firefox browser, Once the editor gets focused, the blinking caret will be visible until we click format buttons (Bold, Italic ...) in the Firefox browser (Changing focus).
-    // But once the any of the buttons clicked, the editor internally has its focus but the blinking caret disappears.
-    // As a workaround, manually triggering blur and setting focus on editor will hepls making the caret re-appears.
-    // It seems like this issue in not fixed in firefox browser yet, Created Issue https://github.com/ni/nimble/issues/1454 tracks removal of this workaround.
-    private focusEditorInFirefoxEnv(): void {
+    // But once any of the toolbar button is clicked, editor internally has its focus but the blinking caret disappears.
+    // As a workaround, manually triggering blur and setting focus on editor makes the blinking caret to re-appear.
+    private focusEditorInFirefox(): void {
         const browserInfo = navigator.userAgent;
         if (browserInfo.includes('Firefox')) {
             this.tiptapEditor.commands.blur();

From 205e6fb3a272fd1e3b56a3e6face3391ce87fcca Mon Sep 17 00:00:00 2001
From: Aagash Raaj <123377167+aagash-ni@users.noreply.github.com>
Date: Tue, 29 Aug 2023 18:34:00 +0530
Subject: [PATCH 07/11] Address PR comments

---
 .../src/rich-text-editor/index.ts             | 26 ++++++++---------
 .../testing/rich-text-editor.pageobject.ts    | 28 ++++++++++++-------
 .../tests/rich-text-editor.spec.ts            | 10 +++++++
 3 files changed, 40 insertions(+), 24 deletions(-)

diff --git a/packages/nimble-components/src/rich-text-editor/index.ts b/packages/nimble-components/src/rich-text-editor/index.ts
index 21b253f3f9..7ae5957120 100644
--- a/packages/nimble-components/src/rich-text-editor/index.ts
+++ b/packages/nimble-components/src/rich-text-editor/index.ts
@@ -101,7 +101,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public boldButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleBold().run();
-        this.focusEditorInFirefox();
+        this.forceFocusEditor();
     }
 
     /**
@@ -111,7 +111,7 @@ export class RichTextEditor extends FoundationElement {
     public boldButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleBold().run();
-            this.focusEditorInFirefox();
+            this.forceFocusEditor();
             return false;
         }
         return true;
@@ -123,7 +123,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public italicsButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleItalic().run();
-        this.focusEditorInFirefox();
+        this.forceFocusEditor();
     }
 
     /**
@@ -133,7 +133,7 @@ export class RichTextEditor extends FoundationElement {
     public italicsButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleItalic().run();
-            this.focusEditorInFirefox();
+            this.forceFocusEditor();
             return false;
         }
         return true;
@@ -145,7 +145,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public bulletListButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleBulletList().run();
-        this.focusEditorInFirefox();
+        this.forceFocusEditor();
     }
 
     /**
@@ -155,7 +155,7 @@ export class RichTextEditor extends FoundationElement {
     public bulletListButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleBulletList().run();
-            this.focusEditorInFirefox();
+            this.forceFocusEditor();
             return false;
         }
         return true;
@@ -167,7 +167,7 @@ export class RichTextEditor extends FoundationElement {
      */
     public numberedListButtonClick(): void {
         this.tiptapEditor.chain().focus().toggleOrderedList().run();
-        this.focusEditorInFirefox();
+        this.forceFocusEditor();
     }
 
     /**
@@ -177,7 +177,7 @@ export class RichTextEditor extends FoundationElement {
     public numberedListButtonKeyDown(event: KeyboardEvent): boolean {
         if (this.keyActivatesButton(event)) {
             this.tiptapEditor.chain().focus().toggleOrderedList().run();
-            this.focusEditorInFirefox();
+            this.forceFocusEditor();
             return false;
         }
         return true;
@@ -359,12 +359,10 @@ export class RichTextEditor extends FoundationElement {
     // In Firefox browser, Once the editor gets focused, the blinking caret will be visible until we click format buttons (Bold, Italic ...) in the Firefox browser (Changing focus).
     // But once any of the toolbar button is clicked, editor internally has its focus but the blinking caret disappears.
     // As a workaround, manually triggering blur and setting focus on editor makes the blinking caret to re-appear.
-    private focusEditorInFirefox(): void {
-        const browserInfo = navigator.userAgent;
-        if (browserInfo.includes('Firefox')) {
-            this.tiptapEditor.commands.blur();
-            this.tiptapEditor.commands.focus();
-        }
+    // Mozilla issue https://bugzilla.mozilla.org/show_bug.cgi?id=1496769 tracks removal of this workaround.
+    private forceFocusEditor(): void {
+        this.tiptapEditor.commands.blur();
+        this.tiptapEditor.commands.focus();
     }
 }
 
diff --git a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
index 2ad02b8ee3..664d1afad7 100644
--- a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
+++ b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
@@ -156,22 +156,30 @@ export class RichTextEditorPageObject {
             .map(el => el.textContent || '');
     }
 
-    private getEditorSection(): Element | null | undefined {
-        return this.richTextEditorElement.shadowRoot?.querySelector('.editor');
+    public getFormattingButton(
+        index: ToolbarButton
+    ): ToggleButton | null | undefined {
+        const buttons: NodeListOf<ToggleButton> = this.richTextEditorElement.shadowRoot!.querySelectorAll(
+            'nimble-toggle-button'
+        );
+        return buttons[index];
+    }
+
+    public getActiveElementFromDocument(): Element | null {
+        return document.activeElement;
     }
 
-    private getTiptapEditor(): Element | null | undefined {
+    public getShadowDomActiveElement(): Element | null | undefined {
+        return document.activeElement?.shadowRoot?.activeElement;
+    }
+
+    public getTiptapEditor(): Element | null | undefined {
         return this.richTextEditorElement.shadowRoot?.querySelector(
             '.ProseMirror'
         );
     }
 
-    private getFormattingButton(
-        index: ToolbarButton
-    ): ToggleButton | null | undefined {
-        const buttons: NodeListOf<ToggleButton> = this.richTextEditorElement.shadowRoot!.querySelectorAll(
-            'nimble-toggle-button'
-        );
-        return buttons[index];
+    private getEditorSection(): Element | null | undefined {
+        return this.richTextEditorElement.shadowRoot?.querySelector('.editor');
     }
 }
diff --git a/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts b/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
index 761db3fb45..8acda8487a 100644
--- a/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
+++ b/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
@@ -103,6 +103,16 @@ describe('RichTextEditor', () => {
         expect(okButtonSpy).toHaveBeenCalledTimes(1);
     });
 
+    it('Should return editor as active element when clicking formatting button', async () => {
+        await pageObject.clickFooterButton(ToolbarButton.bulletList);
+        expect(pageObject.getActiveElementFromDocument()).toBe(element);
+        await pageObject.clickFooterButton(ToolbarButton.numberedList);
+        expect(pageObject.getActiveElementFromDocument()).toBe(element);
+        expect(pageObject.getShadowDomActiveElement()).toBe(
+            pageObject.getTiptapEditor()
+        );
+    });
+
     const formattingButtons: {
         name: string,
         toolbarButtonIndex: ToolbarButton,

From b7e91c1644c2fe8d0db63c491e11efa85a6bce06 Mon Sep 17 00:00:00 2001
From: Aagash Raaj <123377167+aagash-ni@users.noreply.github.com>
Date: Wed, 30 Aug 2023 17:51:38 +0530
Subject: [PATCH 08/11] Address PR comments

---
 .../testing/rich-text-editor.pageobject.ts           | 12 +++++-------
 .../rich-text-editor/tests/rich-text-editor.spec.ts  |  7 +------
 2 files changed, 6 insertions(+), 13 deletions(-)

diff --git a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
index 664d1afad7..64bcc49120 100644
--- a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
+++ b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
@@ -165,15 +165,13 @@ export class RichTextEditorPageObject {
         return buttons[index];
     }
 
-    public getActiveElementFromDocument(): Element | null {
-        return document.activeElement;
-    }
-
-    public getShadowDomActiveElement(): Element | null | undefined {
-        return document.activeElement?.shadowRoot?.activeElement;
+    public async isRichTextEditorActiveElement(): Promise<boolean> {
+        await waitForUpdatesAsync();
+        return document.activeElement === this.richTextEditorElement
+            && document.activeElement?.shadowRoot?.activeElement === this.getTiptapEditor();
     }
 
-    public getTiptapEditor(): Element | null | undefined {
+    private getTiptapEditor(): Element | null | undefined {
         return this.richTextEditorElement.shadowRoot?.querySelector(
             '.ProseMirror'
         );
diff --git a/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts b/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
index 8acda8487a..48402efee6 100644
--- a/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
+++ b/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
@@ -105,12 +105,7 @@ describe('RichTextEditor', () => {
 
     it('Should return editor as active element when clicking formatting button', async () => {
         await pageObject.clickFooterButton(ToolbarButton.bulletList);
-        expect(pageObject.getActiveElementFromDocument()).toBe(element);
-        await pageObject.clickFooterButton(ToolbarButton.numberedList);
-        expect(pageObject.getActiveElementFromDocument()).toBe(element);
-        expect(pageObject.getShadowDomActiveElement()).toBe(
-            pageObject.getTiptapEditor()
-        );
+        expect(await pageObject.isRichTextEditorActiveElement()).toBeTrue();
     });
 
     const formattingButtons: {

From 3f89a632322674d241325af5ed5b76b1fa02093a Mon Sep 17 00:00:00 2001
From: Aagash Raaj <123377167+aagash-ni@users.noreply.github.com>
Date: Wed, 30 Aug 2023 17:54:39 +0530
Subject: [PATCH 09/11] Fix lint

---
 .../testing/rich-text-editor.pageobject.ts                 | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
index 64bcc49120..860c715c1b 100644
--- a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
+++ b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
@@ -167,8 +167,11 @@ export class RichTextEditorPageObject {
 
     public async isRichTextEditorActiveElement(): Promise<boolean> {
         await waitForUpdatesAsync();
-        return document.activeElement === this.richTextEditorElement
-            && document.activeElement?.shadowRoot?.activeElement === this.getTiptapEditor();
+        return (
+            document.activeElement === this.richTextEditorElement
+            && document.activeElement?.shadowRoot?.activeElement
+                === this.getTiptapEditor()
+        );
     }
 
     private getTiptapEditor(): Element | null | undefined {

From 63a177425348b2159be5d0a2f683067f81a4352d Mon Sep 17 00:00:00 2001
From: Aagash Raaj <123377167+aagash-ni@users.noreply.github.com>
Date: Wed, 30 Aug 2023 18:01:24 +0530
Subject: [PATCH 10/11] Minor Update

---
 .../testing/rich-text-editor.pageobject.ts     | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
index 860c715c1b..12ad942212 100644
--- a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
+++ b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
@@ -156,15 +156,6 @@ export class RichTextEditorPageObject {
             .map(el => el.textContent || '');
     }
 
-    public getFormattingButton(
-        index: ToolbarButton
-    ): ToggleButton | null | undefined {
-        const buttons: NodeListOf<ToggleButton> = this.richTextEditorElement.shadowRoot!.querySelectorAll(
-            'nimble-toggle-button'
-        );
-        return buttons[index];
-    }
-
     public async isRichTextEditorActiveElement(): Promise<boolean> {
         await waitForUpdatesAsync();
         return (
@@ -180,6 +171,15 @@ export class RichTextEditorPageObject {
         );
     }
 
+    private getFormattingButton(
+        index: ToolbarButton
+    ): ToggleButton | null | undefined {
+        const buttons: NodeListOf<ToggleButton> = this.richTextEditorElement.shadowRoot!.querySelectorAll(
+            'nimble-toggle-button'
+        );
+        return buttons[index];
+    }
+
     private getEditorSection(): Element | null | undefined {
         return this.richTextEditorElement.shadowRoot?.querySelector('.editor');
     }

From fefde572f17867b4fba61a35315be5225925fb6c Mon Sep 17 00:00:00 2001
From: Aagash Raaj <123377167+aagash-ni@users.noreply.github.com>
Date: Wed, 30 Aug 2023 23:19:09 +0530
Subject: [PATCH 11/11] Address PR comments

---
 packages/nimble-components/src/rich-text-editor/index.ts     | 2 +-
 .../rich-text-editor/testing/rich-text-editor.pageobject.ts  | 3 +--
 .../src/rich-text-editor/tests/rich-text-editor.spec.ts      | 5 +++--
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/nimble-components/src/rich-text-editor/index.ts b/packages/nimble-components/src/rich-text-editor/index.ts
index 7ae5957120..4242ea07a7 100644
--- a/packages/nimble-components/src/rich-text-editor/index.ts
+++ b/packages/nimble-components/src/rich-text-editor/index.ts
@@ -356,7 +356,7 @@ export class RichTextEditor extends FoundationElement {
         }
     }
 
-    // In Firefox browser, Once the editor gets focused, the blinking caret will be visible until we click format buttons (Bold, Italic ...) in the Firefox browser (Changing focus).
+    // In Firefox browser, once the editor gets focused, the blinking caret will be visible until we click format buttons (Bold, Italic ...) in the Firefox browser (changing focus).
     // But once any of the toolbar button is clicked, editor internally has its focus but the blinking caret disappears.
     // As a workaround, manually triggering blur and setting focus on editor makes the blinking caret to re-appear.
     // Mozilla issue https://bugzilla.mozilla.org/show_bug.cgi?id=1496769 tracks removal of this workaround.
diff --git a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
index 12ad942212..55d730a0d3 100644
--- a/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
+++ b/packages/nimble-components/src/rich-text-editor/testing/rich-text-editor.pageobject.ts
@@ -156,8 +156,7 @@ export class RichTextEditorPageObject {
             .map(el => el.textContent || '');
     }
 
-    public async isRichTextEditorActiveElement(): Promise<boolean> {
-        await waitForUpdatesAsync();
+    public isRichTextEditorActiveElement(): boolean {
         return (
             document.activeElement === this.richTextEditorElement
             && document.activeElement?.shadowRoot?.activeElement
diff --git a/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts b/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
index 48402efee6..b0c3dd039a 100644
--- a/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
+++ b/packages/nimble-components/src/rich-text-editor/tests/rich-text-editor.spec.ts
@@ -103,9 +103,10 @@ describe('RichTextEditor', () => {
         expect(okButtonSpy).toHaveBeenCalledTimes(1);
     });
 
-    it('Should return editor as active element when clicking formatting button', async () => {
+    it('Should return editor as active element after clicking formatting button', async () => {
+        await pageObject.setEditorTextContent('Sample Text');
         await pageObject.clickFooterButton(ToolbarButton.bulletList);
-        expect(await pageObject.isRichTextEditorActiveElement()).toBeTrue();
+        expect(pageObject.isRichTextEditorActiveElement()).toBeTrue();
     });
 
     const formattingButtons: {