From d13d87d7a60431e270a8d316a5e2bc365cd95175 Mon Sep 17 00:00:00 2001
From: Daniel Leroux <daniel.leroux@shopify.com>
Date: Tue, 19 Nov 2019 11:27:04 -0500
Subject: [PATCH] Portal

---
 src/components/Button/Button.tsx            | 3 ++-
 src/components/Portal/Portal.tsx            | 9 ++++++++-
 src/components/Portal/tests/Portal.test.tsx | 4 +++-
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
index a1c45e61db5..d567cb3c450 100644
--- a/src/components/Button/Button.tsx
+++ b/src/components/Button/Button.tsx
@@ -147,7 +147,8 @@ export function Button({
 
     const {segmented, fullWidth, connectedTop} = buttonGroupContext;
     const lastInGroup = buttonGroupContext.buttons[0] === id;
-    const firstInGroup = [...buttonGroupContext.buttons].pop() === id;
+    const firstInGroup =
+      buttonGroupContext.buttons[buttonGroupContext.buttons.length - 1] === id;
 
     buttonGroupClassName = classNames(
       segmented && styles.inSegmentedGroup,
diff --git a/src/components/Portal/Portal.tsx b/src/components/Portal/Portal.tsx
index 7bd4b159b86..371a9884cf8 100644
--- a/src/components/Portal/Portal.tsx
+++ b/src/components/Portal/Portal.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import {createPortal} from 'react-dom';
 import {createUniqueIDFactory} from '@shopify/javascript-utilities/other';
+import {ButtonGroupContext} from '../../utilities/button-group';
 import {ThemeContext} from '../../utilities/theme';
 import {portal} from '../shared';
 
@@ -67,8 +68,14 @@ export class Portal extends React.PureComponent<PortalProps, State> {
   }
 
   render() {
+    const childrenMarkup = (
+      <ButtonGroupContext.Provider value={undefined}>
+        {this.props.children}
+      </ButtonGroupContext.Provider>
+    );
+
     return this.state.isMounted
-      ? createPortal(this.props.children, this.portalNode)
+      ? createPortal(childrenMarkup, this.portalNode)
       : null;
   }
 }
diff --git a/src/components/Portal/tests/Portal.test.tsx b/src/components/Portal/tests/Portal.test.tsx
index 89ad52d1490..2c43aeb290a 100644
--- a/src/components/Portal/tests/Portal.test.tsx
+++ b/src/components/Portal/tests/Portal.test.tsx
@@ -3,6 +3,8 @@ import {mount} from 'enzyme';
 import {mountWithAppProvider} from 'test-utilities/legacy';
 import {Portal} from '../Portal';
 import {portal} from '../../shared';
+import {ButtonGroup} from '../../ButtonGroup';
+import {ButtonGroupContext} from '../../../utilities/button-group';
 
 jest.mock('react-dom', () => ({
   ...require.requireActual('react-dom'),
@@ -26,7 +28,7 @@ describe('<Portal />', () => {
     it('get passed into the portal creation method', () => {
       const children = <div />;
       mountWithAppProvider(<Portal>{children}</Portal>);
-      expect(createPortalSpy).toHaveBeenCalledWith(children, expect.anything());
+      expect(createPortalSpy.mock.calls[0][0].props.children).toBe(children);
     });
   });