commit 60425a1817880a938b91ebe883d9020fc3e107e4
author Ben Rohlfs <brohlfs@google.com> Wed May 10 13:42:38 2023 +0200
committer Ben Rohlfs <brohlfs@google.com> Mon Jul 03 16:21:42 2023 +0200
tree 7cf0223d430be261f439e18209978457d85dd957
parent 029a9625747220286e1d2f68a59112014702a4de

Use the same comment data for the ranged comment layer as diff model

And further reduce the node observer complexity.

We are removing the `commentRanges` property from gr-diff.ts and the
rather complicated way of computing it in `updateRanges()`. Instead
in `processNodes()` we are calling `this.rangeLayer.updateRanges()`
with the same comment objects that are fed into the diff model.

We are also adding the comment metadata as event detail to
`comment-thread-mouseenter` and `comment-thread-mouseleave` events.
That allows us to get rid of `getThreadEl()` in gr-diff-highlight.

Release-Notes: skip
Change-Id: I3314a7a691f7500ffa5023c6b7279acc9e6f338d

polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts

diff --git a/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts b/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts
index cfb64b9..c41dc91 100644
--- a/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts
+++ b/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts
@@ -163,8 +163,9 @@
 }
 
 /**
- * This is all the data that gr-diff extracts from comment thread elements.
- * Otherwise gr-diff treats such elements as a black box.
+ * This is all the data that gr-diff extracts from comment thread elements,
+ * see `GrDiffThreadElement`. Otherwise gr-diff treats such elements as a black
+ * box.
  */
 export interface GrDiffCommentThread {
   side: Side;
@@ -173,8 +174,12 @@
   rootId?: string;
 }
 
-export function toCommentThreadModel(
-  threadEl: HTMLElement
+/**
+ * Retrieves all the data from a comment thread element that the gr-diff API
+ * contract defines for such elements.
+ */
+export function getDataFromCommentThreadEl(
+  threadEl?: EventTarget | null
 ): GrDiffCommentThread | undefined {
   if (!isThreadEl(threadEl)) return undefined;
   const side = getSide(threadEl);
@@ -300,14 +305,19 @@
 // For Gerrit these are instances of GrCommentThread, but other gr-diff users
 // have different HTML elements in use for comment threads.
 // TODO: Also document the required HTML attributes that thread elements must
-// have, e.g. 'diff-side', 'range', 'line-num'.
+// have, e.g. 'diff-side', 'range' (optional), 'line-num'.
+// Comment widgets are also required to have `comment-thread` in their css
+// class list.
 export interface GrDiffThreadElement extends HTMLElement {
   rootId: string;
 }
 
-export function isThreadEl(node: Node): node is GrDiffThreadElement {
+export function isThreadEl(
+  node?: Node | EventTarget | null
+): node is GrDiffThreadElement {
   return (
-    node.nodeType === Node.ELEMENT_NODE &&
+    !!node &&
+    (node as Node).nodeType === Node.ELEMENT_NODE &&
     (node as Element).classList.contains('comment-thread')
   );
 }