diff --git a/test/integration/comment_spec.mjs b/test/integration/comment_spec.mjs
index a28bc5984..503df3ce5 100644
--- a/test/integration/comment_spec.mjs
+++ b/test/integration/comment_spec.mjs
@@ -594,5 +594,34 @@ describe("Comment", () => {
         })
       );
     });
+
+    it("must check that comments can be selected/unselected", async () => {
+      await Promise.all(
+        pages.map(async ([browserName, page]) => {
+          await switchToComment(page);
+
+          const firstElementSelector =
+            "#editorCommentsSidebarList li:first-child";
+          await waitAndClick(page, firstElementSelector);
+          const popupSelector = "#commentPopup";
+          await page.waitForSelector(popupSelector, { visible: true });
+          const popupTextSelector = `${popupSelector} .commentPopupText`;
+          await page.waitForSelector(popupTextSelector, {
+            visible: true,
+          });
+          const popupText = await page.evaluate(
+            selector => document.querySelector(selector).textContent,
+            popupTextSelector
+          );
+          expect(popupText)
+            .withContext(`In ${browserName}`)
+            .toEqual("ABCDEFGHIJKLMNOPQRSTUVWXYZ");
+
+          // Click again to unselect the comment.
+          await waitAndClick(page, firstElementSelector);
+          await page.waitForSelector(popupSelector, { visible: false });
+        })
+      );
+    });
   });
 });
diff --git a/web/comment_manager.js b/web/comment_manager.js
index b9a1de7e7..b6f360388 100644
--- a/web/comment_manager.js
+++ b/web/comment_manager.js
@@ -575,6 +575,8 @@ class CommentSidebar {
 
   async #commentClick({ currentTarget }) {
     if (currentTarget.classList.contains("selected")) {
+      currentTarget.classList.remove("selected");
+      this.#popup._hide();
       return;
     }
     const annotation = this.#elementsToAnnotations.get(currentTarget);