Merge pull request #32641 from overleaf/ab-hide-add-comment-tooltip-on-blur

[web] Hide add comment tooltip when clicking outside the editor

GitOrigin-RevId: beff4c2e54fd28e47028f2bbc586f26fe6d3cc1d

services/web/test/frontend/features/review-panel/review-panel.spec.tsx

@@ -538,6 +538,35 @@ describe('<ReviewPanel />', function () {
     })
   })
 
+  describe('add comment tooltip visibility', function () {
+    beforeEach(function () {
+      cy.findByText('contentLine 12').type(
+        '{home}{shift}' + '{rightArrow}'.repeat(6),
+        { scrollBehavior: false }
+      )
+      cy.get('.review-tooltip-menu').should('exist')
+    })
+
+    it('hides the tooltip when clicking a toolbar button', function () {
+      cy.findByRole('button', { name: 'Undo' }).click({ scrollBehavior: false })
+      cy.get('.review-tooltip-menu').should('not.exist')
+    })
+
+    it('hides the tooltip when clicking outside the editor', function () {
+      cy.get('@review-panel').click({ scrollBehavior: false })
+      cy.get('.review-tooltip-menu').should('not.exist')
+    })
+
+    it('keeps the add comment button functional when clicked', function () {
+      cy.get('.review-tooltip-add-comment-button').click({
+        scrollBehavior: false,
+      })
+      cy.get('@review-panel').within(() => {
+        cy.get('.review-panel-add-comment-textarea').should('exist')
+      })
+    })
+  })
+
   describe('bulk actions entry', function () {
     beforeEach(function () {
       // Select a deletion and an insertion
@@ -590,6 +619,26 @@ describe('<ReviewPanel />', function () {
         ])
       })
     })
+
+    it('keeps the tooltip visible when cancelling the accept confirmation modal', function () {
+      cy.get('@accept-selected-changes').click({ scrollBehavior: false })
+      cy.findByRole('dialog').within(() => {
+        cy.findByRole('button', { name: 'Cancel' }).click({
+          scrollBehavior: false,
+        })
+      })
+      cy.get('.review-tooltip-menu').should('exist')
+    })
+
+    it('keeps the tooltip visible when cancelling the reject confirmation modal', function () {
+      cy.get('@reject-selected-changes').click({ scrollBehavior: false })
+      cy.findByRole('dialog').within(() => {
+        cy.findByRole('button', { name: 'Cancel' }).click({
+          scrollBehavior: false,
+        })
+      })
+      cy.get('.review-tooltip-menu').should('exist')
+    })
   })
 
   describe('overview mode', function () {