fix(explore): Prevent shared controls from checking feature flags outside React render (#21315)

superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.test.tsx

@@ -16,6 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
+import { FeatureFlag } from '@superset-ui/core';
 import React from 'react';
 import { render, screen } from 'spec/helpers/testing-library';
 import {
@@ -27,12 +28,18 @@ const defaultProps: DndColumnSelectProps = {
   type: 'DndColumnSelect',
   name: 'Filter',
   onChange: jest.fn(),
-  options: {
-    string: { column_name: 'Column A' },
-  },
+  options: [{ column_name: 'Column A' }],
   actions: { setControlValue: jest.fn() },
 };
 
+beforeAll(() => {
+  window.featureFlags = { [FeatureFlag.ENABLE_EXPLORE_DRAG_AND_DROP]: true };
+});
+
+afterAll(() => {
+  window.featureFlags = {};
+});
+
 test('renders with default props', async () => {
   render(<DndColumnSelect {...defaultProps} />, {
     useDnd: true,
@@ -42,7 +49,7 @@ test('renders with default props', async () => {
 });
 
 test('renders with value', async () => {
-  render(<DndColumnSelect {...defaultProps} value="string" />, {
+  render(<DndColumnSelect {...defaultProps} value="Column A" />, {
     useDnd: true,
     useRedux: true,
   });