Fix tests errors and warnings - iteration 7 (#12212) (#12245)

superset-frontend/spec/javascripts/dashboard/components/PropertiesModal_spec.jsx

@@ -19,6 +19,7 @@
 import React from 'react';
 import { mount } from 'enzyme';
 import { Provider } from 'react-redux';
+import fetchMock from 'fetch-mock';
 
 import {
   supersetTheme,
@@ -41,6 +42,21 @@ const dashboardResult = {
   },
 };
 
+fetchMock.restore();
+
+fetchMock.get('glob:*/api/v1/dashboard/related/owners?*', {
+  result: {},
+});
+
+fetchMock.get('glob:*/api/v1/dashboard/*', {
+  result: {
+    dashboard_title: 'New Title',
+    slug: '/new',
+    json_metadata: '{"something":"foo"}',
+    owners: [],
+  },
+});
+
 describe('PropertiesModal', () => {
   afterEach(() => {
     jest.restoreAllMocks();
@@ -84,6 +100,7 @@ describe('PropertiesModal', () => {
       });
       describe('with metadata', () => {
         describe('with color_scheme in the metadata', () => {
+          it('will update the metadata', () => {
             const wrapper = setup();
             const modalInstance = wrapper.find('PropertiesModal').instance();
             modalInstance.setState({
@@ -91,7 +108,6 @@ describe('PropertiesModal', () => {
                 json_metadata: '{"color_scheme": "foo"}',
               },
             });
-          it('will update the metadata', () => {
             const spy = jest.spyOn(modalInstance, 'onMetadataChange');
             modalInstance.onColorSchemeChange('SUPERSET_DEFAULT');
             expect(spy).toHaveBeenCalledWith(

superset-frontend/spec/javascripts/views/CRUD/welcome/Welcome_spec.tsx

@@ -21,15 +21,24 @@ import { styledMount as mount } from 'spec/helpers/theming';
 import { Provider } from 'react-redux';
 import thunk from 'redux-thunk';
 import fetchMock from 'fetch-mock';
+import { act } from 'react-dom/test-utils';
 import configureStore from 'redux-mock-store';
 import Welcome from 'src/views/CRUD/welcome/Welcome';
+import { ReactWrapper } from 'enzyme';
 
 const mockStore = configureStore([thunk]);
 const store = mockStore({});
 
 const chartsEndpoint = 'glob:*/api/v1/chart/?*';
-const dashboardEndpoint = 'glob:*/api/v1/dashboard/?*';
+const chartInfoEndpoint = 'glob:*/api/v1/chart/_info?*';
+const chartFavoriteStatusEndpoint = 'glob:*/api/v1/chart/favorite_status?*';
+const dashboardsEndpoint = 'glob:*/api/v1/dashboard/?*';
+const dashboardInfoEndpoint = 'glob:*/api/v1/dashboard/_info?*';
+const dashboardFavoriteStatusEndpoint =
+  'glob:*/api/v1/dashboard/favorite_status?*';
 const savedQueryEndpoint = 'glob:*/api/v1/saved_query/?*';
+const savedQueryInfoEndpoint = 'glob:*/api/v1/saved_query/_info?*';
+const recentActivityEndpoint = 'glob:*/superset/recent_activity/*';
 
 fetchMock.get(chartsEndpoint, {
   result: [
@@ -43,7 +52,7 @@ fetchMock.get(chartsEndpoint, {
   ],
 });
 
-fetchMock.get(dashboardEndpoint, {
+fetchMock.get(dashboardsEndpoint, {
   result: [
     {
       dashboard_title: 'Dashboard_Test',
@@ -58,6 +67,28 @@ fetchMock.get(savedQueryEndpoint, {
   result: [],
 });
 
+fetchMock.get(recentActivityEndpoint, {});
+
+fetchMock.get(chartInfoEndpoint, {
+  permissions: [],
+});
+
+fetchMock.get(chartFavoriteStatusEndpoint, {
+  result: [],
+});
+
+fetchMock.get(dashboardInfoEndpoint, {
+  permissions: [],
+});
+
+fetchMock.get(dashboardFavoriteStatusEndpoint, {
+  result: [],
+});
+
+fetchMock.get(savedQueryInfoEndpoint, {
+  permissions: [],
+});
+
 describe('Welcome', () => {
   const mockedProps = {
     user: {
@@ -70,11 +101,18 @@ describe('Welcome', () => {
       isActive: true,
     },
   };
-  const wrapper = mount(
+
+  let wrapper: ReactWrapper;
+
+  beforeAll(async () => {
+    await act(async () => {
+      wrapper = mount(
         <Provider store={store}>
           <Welcome {...mockedProps} />
         </Provider>,
       );
+    });
+  });
 
   it('renders', () => {
     expect(wrapper).toExist();

superset-frontend/src/views/CRUD/alert/components/AlertStatusIcon.tsx

@@ -22,7 +22,9 @@ import { Tooltip } from 'src/common/components/Tooltip';
 import Icon, { IconName } from 'src/components/Icon';
 import { AlertState } from '../types';
 
-const StatusIcon = styled(Icon)<{ status: string; isReportEnabled: boolean }>`
+const StatusIcon = styled(Icon, {
+  shouldForwardProp: prop => prop !== 'status' && prop !== 'isReportEnabled',
+})<{ status: string; isReportEnabled: boolean }>`
   color: ${({ status, theme, isReportEnabled }) => {
     switch (status) {
       case AlertState.working:

superset-frontend/src/views/CRUD/data/query/QueryList.tsx

@@ -80,7 +80,9 @@ const StyledPopoverItem = styled.div`
   color: ${({ theme }) => theme.colors.grayscale.dark2};
 `;
 
-const StatusIcon = styled(Icon)<{ status: string }>`
+const StatusIcon = styled(Icon, {
+  shouldForwardProp: prop => prop !== 'status',
+})<{ status: string }>`
   color: ${({ status, theme }) => {
     if (status === 'success') return theme.colors.success.base;
     if (status === 'failed') return theme.colors.error.base;

superset-frontend/src/views/CRUD/welcome/Welcome.tsx

@@ -62,9 +62,9 @@ const WelcomeContainer = styled.div`
       }
     }
     .nav.navbar-nav {
-      & > li:nth-child(1),
-      & > li:nth-child(2),
-      & > li:nth-child(3) {
+      & > li:nth-of-type(1),
+      & > li:nth-of-type(2),
+      & > li:nth-of-type(3) {
         margin-top: ${({ theme }) => theme.gridUnit * 2}px;
       }
     }