[Popover] Revert to type assertion to handle SVGElements

UNRELEASED.md

@@ -10,6 +10,7 @@
 ### Bug fixes
 
 - Fixed issue with passed to `ComboBox` component options prop was mutated ([#2818](https://github.com/Shopify/polaris-react/pull/2818))
+- Fixed an issue which caused `Popover` to close when clicking on a descendant SVG ([#2827](https://github.com/Shopify/polaris-react/pull/2827))
 
 ### Documentation
 

src/components/Popover/components/PopoverOverlay/PopoverOverlay.tsx

@@ -242,18 +242,15 @@ export class PopoverOverlay extends React.PureComponent<
   };
 
   private handleClick = (event: Event) => {
-    const target = event.target;
+    const target = event.target as HTMLElement;
     const {
       contentNode,
       props: {activator, onClose},
     } = this;
     const isDescendant =
-      target instanceof HTMLElement &&
       contentNode.current != null &&
       nodeContainsDescendant(contentNode.current, target);
-    const isActivatorDescendant =
-      target instanceof HTMLElement &&
-      nodeContainsDescendant(activator, target);
+    const isActivatorDescendant = nodeContainsDescendant(activator, target);
     if (
       isDescendant ||
       isActivatorDescendant ||

src/components/Popover/components/PopoverOverlay/tests/PopoverOverlay.test.tsx

@@ -1,7 +1,11 @@
 import React from 'react';
 // eslint-disable-next-line no-restricted-imports
-import {mountWithAppProvider, ReactWrapper} from 'test-utilities/legacy';
-import {TextContainer} from 'components';
+import {
+  mountWithAppProvider,
+  ReactWrapper,
+  trigger,
+} from 'test-utilities/legacy';
+import {TextContainer, TextField, EventListener} from 'components';
 import {Key} from '../../../../../types';
 import {PositionedOverlay} from '../../../../PositionedOverlay';
 import {PopoverOverlay} from '../PopoverOverlay';
@@ -180,6 +184,72 @@ describe('<PopoverOverlay />', () => {
     expect(spy).toHaveBeenCalledTimes(1);
   });
 
+  it('does not call the onClose callback when a descendent HTMLElement is clicked', () => {
+    const spy = jest.fn();
+
+    const popoverOverlay = mountWithAppProvider(
+      <PopoverOverlay
+        active
+        id="PopoverOverlay-1"
+        activator={activator}
+        onClose={spy}
+      >
+        (<TextField label="Store name" value="Click me" onChange={() => {}} />)
+      </PopoverOverlay>,
+    );
+
+    const target = popoverOverlay
+      .find(TextField)
+      .find('input')
+      .getDOMNode();
+
+    const clickEventListener = popoverOverlay
+      .find(EventListener)
+      .findWhere((node) => node.prop('event') === 'click');
+
+    trigger(clickEventListener, 'handler', {target});
+
+    expect(spy).not.toHaveBeenCalled();
+  });
+
+  it('does not call the onClose callback when a descendent SVGElement is clicked', () => {
+    const spy = jest.fn();
+
+    const popoverOverlay = mountWithAppProvider(
+      <PopoverOverlay
+        active
+        id="PopoverOverlay-1"
+        activator={activator}
+        onClose={spy}
+      >
+        (
+        <TextField
+          type="number"
+          label="Store name"
+          value="Click me"
+          onChange={() => {}}
+        />
+        )
+      </PopoverOverlay>,
+    );
+
+    const target = popoverOverlay
+      .find(TextField)
+      .find('svg')
+      .first()
+      .getDOMNode();
+
+    const clickEventListener = popoverOverlay
+      .find(EventListener)
+      .findWhere((node) => node.prop('event') === 'click');
+
+    trigger(clickEventListener, 'handler', {
+      target,
+    });
+
+    expect(spy).not.toHaveBeenCalled();
+  });
+
   it('starts animating in immediately', () => {
     const popoverOverlay = mountWithAppProvider(
       <PopoverOverlay