Fix long range comment selection on Firefox

The shadow-selection-polyfill only returns the first range for
Firefox, bypassing our range-merge logic that gives us the
endpoints of the selection. This change makes gr-diff only use
the polyfill for Safari.

Change-Id: I3a33264dc804a72b0456f5224199f0844343c166

polygerrit-ui/app/elements/diff/gr-diff/gr-diff.ts

@@ -67,6 +67,7 @@ import {MovedLinkClickedEvent} from '../../../types/events';
 import * as shadow from 'shadow-selection-polyfill/shadow.js';
 
 import {CreateCommentEventDetail as CreateCommentEventDetailApi} from '../../../api/diff';
+import {isSafari} from '../../../utils/dom-util';
 
 const NO_NEWLINE_BASE = 'No newline at end of base file.';
 const NO_NEWLINE_REVISION = 'No newline at end of revision file.';
@@ -355,11 +356,13 @@ export class GrDiff extends GestureEventListeners(
   _getShadowOrDocumentSelection() {
     // When using native shadow DOM, the selection returned by
     // document.getSelection() cannot reference the actual DOM elements making
-    // up the diff, because they are in the shadow DOM of the gr-diff element.
+    // up the diff in Safari because they are in the shadow DOM of the gr-diff
-    // This takes the shadow DOM selection if one exists.
+    // element. This takes the shadow DOM selection if one exists.
     return this.root instanceof ShadowRoot && this.root.getSelection
       ? this.root.getSelection()
-      : shadow.getRange(this.root);
+      : isSafari()
+      ? shadow.getRange(this.root)
+      : document.getSelection();
   }
 
   _observeNodes() {

polygerrit-ui/app/utils/dom-util.ts

@@ -244,3 +244,11 @@ export function findActiveElement(
   }
   return root.activeElement as HTMLElement;
 }
+
+// Whether the browser is Safari. Used for polyfilling unique browser behavior.
+export function isSafari() {
+  return (
+    /^((?!chrome|android).)*safari/i.test(navigator.userAgent) ||
+    (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream)
+  );
+}