diff --git a/static/app/components/discover/transactionsList.tsx b/static/app/components/discover/transactionsList.tsx
index c8f44806ce5eda..2da0590c262390 100644
--- a/static/app/components/discover/transactionsList.tsx
+++ b/static/app/components/discover/transactionsList.tsx
@@ -6,8 +6,7 @@ import {Location, LocationDescriptor, Query} from 'history';
 import GuideAnchor from 'sentry/components/assistant/guideAnchor';
 import Button from 'sentry/components/button';
 import DiscoverButton from 'sentry/components/discoverButton';
-import DropdownButton from 'sentry/components/dropdownButton';
-import DropdownControl, {DropdownItem} from 'sentry/components/dropdownControl';
+import CompactSelect from 'sentry/components/forms/compactSelect';
 import Pagination, {CursorHandler} from 'sentry/components/pagination';
 import {t} from 'sentry/locale';
 import space from 'sentry/styles/space';
@@ -176,30 +175,12 @@ class _TransactionsList extends Component<Props> {
     return (
       <Fragment>
         <div>
-          <DropdownControl
-            button={({isOpen, getActorProps}) => (
-              <StyledDropdownButton
-                {...getActorProps()}
-                isOpen={isOpen}
-                prefix={t('Filter')}
-                size="xsmall"
-              >
-                {selected.label}
-              </StyledDropdownButton>
-            )}
-          >
-            {options.map(({value, label}) => (
-              <DropdownItem
-                data-test-id={`option-${value}`}
-                key={value}
-                onSelect={handleDropdownChange}
-                eventKey={value}
-                isActive={value === selected.value}
-              >
-                {label}
-              </DropdownItem>
-            ))}
-          </DropdownControl>
+          <CompactSelect
+            triggerProps={{prefix: t('Filter'), size: 'xsmall'}}
+            value={selected.value}
+            options={options}
+            onChange={opt => handleDropdownChange(opt.value)}
+          />
         </div>
         {!this.isTrend() &&
           (handleOpenAllEventsClick ? (
@@ -378,10 +359,6 @@ const Header = styled('div')`
   align-items: center;
 `;
 
-const StyledDropdownButton = styled(DropdownButton)`
-  min-width: 145px;
-`;
-
 const StyledPagination = styled(Pagination)`
   margin: 0 0 0 ${space(1)};
 `;
diff --git a/tests/js/spec/components/discover/transactionsList.spec.jsx b/tests/js/spec/components/discover/transactionsList.spec.jsx
index d49d86ed538965..217686db4c1b1a 100644
--- a/tests/js/spec/components/discover/transactionsList.spec.jsx
+++ b/tests/js/spec/components/discover/transactionsList.spec.jsx
@@ -1,5 +1,8 @@
+import {act} from 'react-dom/test-utils';
+
 import {mountWithTheme} from 'sentry-test/enzyme';
 import {initializeOrg} from 'sentry-test/initializeOrg';
+import {triggerPress} from 'sentry-test/utils';
 
 import {Client} from 'sentry/api';
 import TransactionsList from 'sentry/components/discover/transactionsList';
@@ -146,9 +149,21 @@ describe('TransactionsList', function () {
       });
     });
 
-    const selectDropdownOption = (w, selection) => {
-      w.find('DropdownControl').first().simulate('click');
-      w.find(`DropdownItem[data-test-id="option-${selection}"] span`).simulate('click');
+    const openDropdown = async w => {
+      await act(async () => {
+        triggerPress(w.find('CompactSelect Button'));
+        await tick();
+        w.update();
+      });
+    };
+
+    const selectDropdownOption = async (w, selection) => {
+      await openDropdown(w);
+      await act(async () => {
+        triggerPress(w.find(`MenuItemWrap[value="${selection}"]`));
+        await tick();
+        w.update();
+      });
     };
 
     describe('with eventsv2', function () {
@@ -168,8 +183,9 @@ describe('TransactionsList', function () {
         await tick();
         wrapper.update();
 
-        expect(wrapper.find('DropdownControl')).toHaveLength(1);
-        expect(wrapper.find('DropdownItem')).toHaveLength(2);
+        expect(wrapper.find('CompactSelect')).toHaveLength(1);
+        await openDropdown(wrapper);
+        expect(wrapper.find('MenuItemWrap')).toHaveLength(2);
         expect(wrapper.find('DiscoverButton')).toHaveLength(1);
         expect(wrapper.find('Pagination')).toHaveLength(1);
         expect(wrapper.find('PanelTable')).toHaveLength(1);
@@ -201,8 +217,9 @@ describe('TransactionsList', function () {
         await tick();
         wrapper.update();
 
-        expect(wrapper.find('DropdownControl')).toHaveLength(1);
-        expect(wrapper.find('DropdownItem')).toHaveLength(3);
+        expect(wrapper.find('CompactSelect')).toHaveLength(1);
+        await openDropdown(wrapper);
+        expect(wrapper.find('MenuItemWrap')).toHaveLength(3);
         expect(wrapper.find('DiscoverButton')).toHaveLength(0);
         expect(wrapper.find('Pagination')).toHaveLength(1);
         expect(wrapper.find('PanelTable')).toHaveLength(1);
@@ -279,7 +296,7 @@ describe('TransactionsList', function () {
         expect(wrapper.find('GridCell').last().text()).toEqual('/b');
         expect(wrapper.find('GridCellNumber').last().text()).toEqual('1000');
 
-        selectDropdownOption(wrapper, 'count');
+        await selectDropdownOption(wrapper, 'count');
         await tick();
         wrapper.update();
 
@@ -350,8 +367,9 @@ describe('TransactionsList', function () {
         wrapper.update();
 
         expect(wrapper.find('LoadingIndicator')).toHaveLength(0);
-        expect(wrapper.find('DropdownControl')).toHaveLength(1);
-        expect(wrapper.find('DropdownItem')).toHaveLength(2);
+        expect(wrapper.find('CompactSelect')).toHaveLength(1);
+        await openDropdown(wrapper);
+        expect(wrapper.find('MenuItemWrap')).toHaveLength(2);
         expect(wrapper.find('DiscoverButton')).toHaveLength(1);
         expect(wrapper.find('Pagination')).toHaveLength(1);
         expect(wrapper.find('PanelTable')).toHaveLength(1);
@@ -383,8 +401,9 @@ describe('TransactionsList', function () {
         await tick();
         wrapper.update();
 
-        expect(wrapper.find('DropdownControl')).toHaveLength(1);
-        expect(wrapper.find('DropdownItem')).toHaveLength(2);
+        expect(wrapper.find('CompactSelect')).toHaveLength(1);
+        await openDropdown(wrapper);
+        expect(wrapper.find('MenuItemWrap')).toHaveLength(2);
         expect(wrapper.find('DiscoverButton')).toHaveLength(1);
         expect(wrapper.find('Pagination')).toHaveLength(1);
         expect(wrapper.find('PanelTable')).toHaveLength(1);
@@ -416,8 +435,9 @@ describe('TransactionsList', function () {
         await tick();
         wrapper.update();
 
-        expect(wrapper.find('DropdownControl')).toHaveLength(1);
-        expect(wrapper.find('DropdownItem')).toHaveLength(3);
+        expect(wrapper.find('CompactSelect')).toHaveLength(1);
+        await openDropdown(wrapper);
+        expect(wrapper.find('MenuItemWrap')).toHaveLength(3);
         expect(wrapper.find('DiscoverButton')).toHaveLength(0);
         expect(wrapper.find('Pagination')).toHaveLength(1);
         expect(wrapper.find('PanelTable')).toHaveLength(1);
@@ -494,7 +514,7 @@ describe('TransactionsList', function () {
         expect(wrapper.find('GridCell').last().text()).toEqual('/b');
         expect(wrapper.find('GridCellNumber').last().text()).toEqual('1000');
 
-        selectDropdownOption(wrapper, 'count');
+        await selectDropdownOption(wrapper, 'count');
         await tick();
         wrapper.update();
 
@@ -565,8 +585,9 @@ describe('TransactionsList', function () {
         wrapper.update();
 
         expect(wrapper.find('LoadingIndicator')).toHaveLength(0);
-        expect(wrapper.find('DropdownControl')).toHaveLength(1);
-        expect(wrapper.find('DropdownItem')).toHaveLength(2);
+        expect(wrapper.find('CompactSelect')).toHaveLength(1);
+        await openDropdown(wrapper);
+        expect(wrapper.find('MenuItemWrap')).toHaveLength(2);
         expect(wrapper.find('DiscoverButton')).toHaveLength(1);
         expect(wrapper.find('Pagination')).toHaveLength(1);
         expect(wrapper.find('PanelTable')).toHaveLength(1);
diff --git a/tests/js/spec/views/performance/transactionSummary.spec.tsx b/tests/js/spec/views/performance/transactionSummary.spec.tsx
index 282ef23ba6c571..f01dc73c2042ec 100644
--- a/tests/js/spec/views/performance/transactionSummary.spec.tsx
+++ b/tests/js/spec/views/performance/transactionSummary.spec.tsx
@@ -606,7 +606,7 @@ describe('Performance > TransactionSummary', function () {
         screen.getByRole('button', {name: 'Filter Slow Transactions (p95)'})
       );
 
-      userEvent.click(screen.getByRole('button', {name: 'Slow Transactions (p95)'}));
+      userEvent.click(screen.getAllByText('Slow Transactions (p95)')[1]);
 
       // Check the navigation.
       expect(browserHistory.push).toHaveBeenCalledWith({
@@ -1014,7 +1014,7 @@ describe('Performance > TransactionSummary', function () {
         screen.getByRole('button', {name: 'Filter Slow Transactions (p95)'})
       );
 
-      userEvent.click(screen.getByRole('button', {name: 'Slow Transactions (p95)'}));
+      userEvent.click(screen.getAllByText('Slow Transactions (p95)')[1]);
 
       // Check the navigation.
       expect(browserHistory.push).toHaveBeenCalledWith({