From f651879958e2535f343c4304b99871fa5d9d3e86 Mon Sep 17 00:00:00 2001
From: Lily Kuang <lily@preset.io>
Date: Tue, 28 Mar 2023 17:56:36 -0700
Subject: [PATCH] update tests

---
 .../Chart/DrillBy/DrillByModal.test.tsx       | 30 ++++++++++++-------
 .../components/Chart/DrillBy/DrillByModal.tsx |  4 +--
 2 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/superset-frontend/src/components/Chart/DrillBy/DrillByModal.test.tsx b/superset-frontend/src/components/Chart/DrillBy/DrillByModal.test.tsx
index df1589da36c76..10d9e1af83c4e 100644
--- a/superset-frontend/src/components/Chart/DrillBy/DrillByModal.test.tsx
+++ b/superset-frontend/src/components/Chart/DrillBy/DrillByModal.test.tsx
@@ -20,15 +20,25 @@
 import React, { useState } from 'react';
 import userEvent from '@testing-library/user-event';
 import { render, screen } from 'spec/helpers/testing-library';
-import { getMockStoreWithNativeFilters } from 'spec/fixtures/mockStore';
 import chartQueries, { sliceId } from 'spec/fixtures/mockChartQueries';
+import mockState from 'spec/fixtures/mockState';
 import DrillByModal from './DrillByModal';
 
-const { id: chartId, form_data: formData } = chartQueries[sliceId];
+const { form_data: formData } = chartQueries[sliceId];
 const { slice_name: chartName } = formData;
-
-const renderModal = async () => {
-  const store = getMockStoreWithNativeFilters();
+const drillByModalState = {
+  ...mockState,
+  dashboardLayout: {
+    CHART_ID: {
+      id: 'CHART_ID',
+      meta: {
+        chartId: formData.slice_id,
+        sliceName: chartName,
+      },
+    },
+  },
+};
+const renderModal = async (state?: object) => {
   const DrillByModalWrapper = () => {
     const [showModal, setShowModal] = useState(false);
     return (
@@ -37,9 +47,8 @@ const renderModal = async () => {
           Show modal
         </button>
         <DrillByModal
-          chartId={chartId}
           formData={formData}
-          initialFilters={[]}
+          filters={[]}
           showModal={showModal}
           onHideModal={() => setShowModal(false)}
         />
@@ -48,9 +57,10 @@ const renderModal = async () => {
   };
 
   render(<DrillByModalWrapper />, {
-    useRouter: true,
+    useDnd: true,
     useRedux: true,
-    store,
+    useRouter: true,
+    initialState: state,
   });
 
   userEvent.click(screen.getByRole('button', { name: 'Show modal' }));
@@ -58,7 +68,7 @@ const renderModal = async () => {
 };
 
 test('should render the title', async () => {
-  await renderModal();
+  await renderModal(drillByModalState);
   expect(screen.getByText(`Drill by: ${chartName}`)).toBeInTheDocument();
 });
 
diff --git a/superset-frontend/src/components/Chart/DrillBy/DrillByModal.tsx b/superset-frontend/src/components/Chart/DrillBy/DrillByModal.tsx
index e2d25c815f062..59bb766de4649 100644
--- a/superset-frontend/src/components/Chart/DrillBy/DrillByModal.tsx
+++ b/superset-frontend/src/components/Chart/DrillBy/DrillByModal.tsx
@@ -66,9 +66,6 @@ export default function DrillByModal({
   onHideModal,
   showModal,
 }: DrillByModalProps) {
-  console.log(column);
-  console.log(formData);
-  console.log(filters);
   const theme = useTheme();
   const dashboardLayout = useSelector<RootState, DashboardLayout>(
     state => state.dashboardLayout.present,
@@ -80,6 +77,7 @@ export default function DrillByModal({
     chartLayoutItem?.meta.sliceName || chartLayoutItem?.meta.sliceNameOverride;
   const exploreChart = () => {};
 
+  console.log(column, filters);
   return (
     <Modal
       css={css`