test: Refactor and enhance tests for the Explore DatasourcePanel Component (#13799)

* Refactor and enhance tests

* Fix linting issues

superset-frontend/spec/javascripts/explore/components/DatasourcePanel_spec.jsx

@@ -1,127 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import React from 'react';
-import { HTML5Backend } from 'react-dnd-html5-backend';
-import { DndProvider } from 'react-dnd';
-import { render, screen } from 'spec/helpers/testing-library';
-import userEvent from '@testing-library/user-event';
-import DatasourcePanel from 'src/explore/components/DatasourcePanel';
-import { columns, metrics } from 'spec/javascripts/datasource/fixtures';
-
-describe('datasourcepanel', () => {
-  const datasource = {
-    name: 'birth_names',
-    type: 'table',
-    uid: '1__table',
-    id: 1,
-    columns,
-    metrics,
-    database: {
-      backend: 'mysql',
-      name: 'main',
-    },
-  };
-  const props = {
-    datasource,
-    controls: {
-      datasource: {
-        validationErrors: null,
-        mapStateToProps: () => null,
-        type: 'DatasourceControl',
-        label: 'hello',
-        datasource,
-      },
-    },
-    actions: {},
-  };
-
-  const setup = props => (
-    <DndProvider backend={HTML5Backend}>
-      <DatasourcePanel {...props} />
-    </DndProvider>
-  );
-
-  function search(value, input) {
-    userEvent.clear(input);
-    userEvent.type(input, value);
-  }
-
-  it('should render', () => {
-    const { container } = render(setup(props));
-    expect(container).toBeVisible();
-  });
-
-  it('should display items in controls', () => {
-    render(setup(props));
-    expect(screen.getByText('birth_names')).toBeTruthy();
-    expect(screen.getByText('Columns')).toBeTruthy();
-    expect(screen.getByText('Metrics')).toBeTruthy();
-    expect(screen.queryByTestId('warning')).not.toBeInTheDocument();
-  });
-
-  it('should render search results', () => {
-    const { container } = render(setup(props));
-    const c = container.getElementsByClassName('option-label');
-
-    expect(c).toHaveLength(5);
-  });
-
-  it('should render 0 search results', () => {
-    const { container } = render(setup(props));
-    const c = container.getElementsByClassName('option-label');
-    const searchInput = screen.getByPlaceholderText('Search Metrics & Columns');
-
-    search('sssssssss', searchInput);
-    setTimeout(() => {
-      expect(c).toHaveLength(0);
-    }, 201);
-  });
-
-  it('should render and sort search results', () => {
-    const { container } = render(setup(props));
-    const c = container.getElementsByClassName('option-label');
-    const searchInput = screen.getByPlaceholderText('Search Metrics & Columns');
-
-    search('end', searchInput);
-    setTimeout(() => {
-      expect(c).toHaveLength(4);
-      expect(c[0].value).toBe('metric_end_certified');
-    }, 201);
-  });
-
-  it('should render a warning', () => {
-    const deprecatedDatasource = {
-      ...datasource,
-      extra: JSON.stringify({ warning_markdown: 'This is a warning.' }),
-    };
-    render(
-      setup({
-        ...props,
-        datasource: deprecatedDatasource,
-        controls: {
-          datasource: {
-            ...props.controls.datasource,
-            datasource: deprecatedDatasource,
-          },
-        },
-      }),
-    );
-    expect(screen.getByTestId('alert-solid')).toBeTruthy();
-  });
-});