chore: add type checking in plugin test directory (#19387)

superset-frontend/packages/superset-ui-core/src/query/types/AnnotationLayer.ts

@@ -162,9 +162,10 @@ export type RecordAnnotationResult = {
   records: DataRecord[];
 };
 
-export type TimeseriesAnnotationResult = [
-  { key: string; values: { x: string | number; y?: number }[] },
-];
+export type TimeseriesAnnotationResult = {
+  key: string;
+  values: { x: string | number; y?: number }[];
+}[];
 
 export type AnnotationResult =
   | RecordAnnotationResult

superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/types.ts

@@ -53,7 +53,8 @@ export const DEFAULT_FORM_DATA: BoxPlotQueryFormData = {
   ...DEFAULT_TITLE_FORM_DATA,
 };
 
-export interface EchartsBoxPlotChartProps extends ChartProps {
+export interface EchartsBoxPlotChartProps
+  extends ChartProps<BoxPlotQueryFormData> {
   formData: BoxPlotQueryFormData;
   queriesData: ChartDataResponseResult[];
 }

superset-frontend/plugins/plugin-chart-echarts/src/Funnel/types.ts

@@ -56,7 +56,8 @@ export enum EchartsFunnelLabelTypeType {
   KeyValuePercent,
 }
 
-export interface EchartsFunnelChartProps extends ChartProps {
+export interface EchartsFunnelChartProps
+  extends ChartProps<EchartsFunnelFormData> {
   formData: EchartsFunnelFormData;
   queriesData: ChartDataResponseResult[];
 }

superset-frontend/plugins/plugin-chart-echarts/src/Gauge/types.ts

@@ -32,7 +32,7 @@ export type AxisTickLineStyle = {
 export type EchartsGaugeFormData = QueryFormData & {
   colorScheme?: string;
   groupby: QueryFormColumn[];
-  metric?: object;
+  metric?: string;
   rowLimit: number;
   minVal: number;
   maxVal: number;
@@ -78,7 +78,8 @@ export const DEFAULT_FORM_DATA: Partial<EchartsGaugeFormData> = {
   emitFilter: false,
 };
 
-export interface EchartsGaugeChartProps extends ChartProps {
+export interface EchartsGaugeChartProps
+  extends ChartProps<EchartsGaugeFormData> {
   formData: EchartsGaugeFormData;
   queriesData: ChartDataResponseResult[];
 }

superset-frontend/plugins/plugin-chart-echarts/src/Pie/types.ts

@@ -61,7 +61,7 @@ export enum EchartsPieLabelType {
   KeyValuePercent = 'key_value_percent',
 }
 
-export interface EchartsPieChartProps extends ChartProps {
+export interface EchartsPieChartProps extends ChartProps<EchartsPieFormData> {
   formData: EchartsPieFormData;
   queriesData: ChartDataResponseResult[];
 }

superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/types.ts

@@ -122,7 +122,8 @@ export const DEFAULT_FORM_DATA: EchartsTimeseriesFormData = {
   ...DEFAULT_TITLE_FORM_DATA,
 };
 
-export interface EchartsTimeseriesChartProps extends ChartProps {
+export interface EchartsTimeseriesChartProps
+  extends ChartProps<EchartsTimeseriesFormData> {
   formData: EchartsTimeseriesFormData;
   queriesData: ChartDataResponseResult[];
 }

superset-frontend/plugins/plugin-chart-echarts/src/Treemap/types.ts

@@ -49,7 +49,8 @@ export enum EchartsTreemapLabelType {
   KeyValue = 'key_value',
 }
 
-export interface EchartsTreemapChartProps extends ChartProps {
+export interface EchartsTreemapChartProps
+  extends ChartProps<EchartsTreemapFormData> {
   formData: EchartsTreemapFormData;
   queriesData: ChartDataResponseResult[];
 }

superset-frontend/plugins/plugin-chart-echarts/src/utils/forecast.ts

@@ -17,7 +17,7 @@
  * under the License.
  */
 import { DataRecord, DTTM_ALIAS, NumberFormatter } from '@superset-ui/core';
-import { CallbackDataParams, OptionName } from 'echarts/types/src/util/types';
+import { OptionName } from 'echarts/types/src/util/types';
 import { TooltipMarker } from 'echarts/types/src/util/format';
 import {
   ForecastSeriesContext,
@@ -52,7 +52,7 @@ export const extractForecastSeriesContexts = (
   }, {} as { [key: string]: ForecastSeriesEnum[] });
 
 export const extractForecastValuesFromTooltipParams = (
-  params: (CallbackDataParams & { seriesId: string })[],
+  params: any[],
 ): Record<string, ForecastValue> => {
   const values: Record<string, ForecastValue> = {};
   params.forEach(param => {

superset-frontend/plugins/plugin-chart-echarts/test/BigNumber/transformProps.test.ts

@@ -57,7 +57,7 @@ const rawFormData = {
 function generateProps(
   data: BigNumberDatum[],
   extraFormData = {},
-  extraQueryData = {},
+  extraQueryData: any = {},
 ): BigNumberWithTrendlineChartProps {
   return {
     width: 200,

superset-frontend/plugins/plugin-chart-echarts/test/BoxPlot/buildQuery.test.ts

@@ -16,12 +16,17 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { isPostProcessingBoxplot } from '@superset-ui/core';
+import {
+  isPostProcessingBoxplot,
+  PostProcessingBoxplot,
+} from '@superset-ui/core';
+import { DEFAULT_TITLE_FORM_DATA } from '../../src/types';
 import buildQuery from '../../src/BoxPlot/buildQuery';
 import { BoxPlotQueryFormData } from '../../src/BoxPlot/types';
 
 describe('BoxPlot buildQuery', () => {
   const formData: BoxPlotQueryFormData = {
+    ...DEFAULT_TITLE_FORM_DATA,
     emitFilter: false,
     columns: [],
     datasource: '5__table',
@@ -42,7 +47,7 @@ describe('BoxPlot buildQuery', () => {
     expect(query.series_columns).toEqual(['bar']);
     const [rule] = query.post_processing || [];
     expect(isPostProcessingBoxplot(rule)).toEqual(true);
-    expect(rule.options.groupby).toEqual(['bar']);
+    expect((rule as PostProcessingBoxplot)?.options?.groupby).toEqual(['bar']);
   });
 
   it('should build non-timeseries query object when columns is defined', () => {
@@ -53,6 +58,6 @@ describe('BoxPlot buildQuery', () => {
     expect(query.series_columns).toEqual(['bar']);
     const [rule] = query.post_processing || [];
     expect(isPostProcessingBoxplot(rule)).toEqual(true);
-    expect(rule.options.groupby).toEqual(['bar']);
+    expect((rule as PostProcessingBoxplot)?.options?.groupby).toEqual(['bar']);
   });
 });

superset-frontend/plugins/plugin-chart-echarts/test/BoxPlot/transformProps.test.ts

@@ -16,11 +16,12 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { ChartProps } from '@superset-ui/core';
+import { ChartProps, SqlaFormData } from '@superset-ui/core';
+import { EchartsBoxPlotChartProps } from '../../src/BoxPlot/types';
 import transformProps from '../../src/BoxPlot/transformProps';
 
 describe('BoxPlot tranformProps', () => {
-  const formData = {
+  const formData: SqlaFormData = {
     datasource: '5__table',
     granularity_sqla: 'ds',
     time_grain_sqla: 'P1Y',
@@ -68,7 +69,7 @@ describe('BoxPlot tranformProps', () => {
   });
 
   it('should tranform chart props for viz', () => {
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsBoxPlotChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,

superset-frontend/plugins/plugin-chart-echarts/test/Funnel/transformProps.test.ts

@@ -20,7 +20,10 @@ import { ChartProps, getNumberFormatter } from '@superset-ui/core';
 import transformProps, {
   formatFunnelLabel,
 } from '../../src/Funnel/transformProps';
-import { EchartsFunnelLabelTypeType } from '../../src/Funnel/types';
+import {
+  EchartsFunnelChartProps,
+  EchartsFunnelLabelTypeType,
+} from '../../src/Funnel/types';
 
 describe('Funnel tranformProps', () => {
   const formData = {
@@ -45,7 +48,7 @@ describe('Funnel tranformProps', () => {
   });
 
   it('should tranform chart props for viz', () => {
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsFunnelChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,

superset-frontend/plugins/plugin-chart-echarts/test/Gauge/buildQuery.test.ts

@@ -26,7 +26,7 @@ describe('Gauge buildQuery', () => {
   };
 
   it('should build query fields with no group by column', () => {
-    const formData = { ...baseFormData, groupby: null };
+    const formData = { ...baseFormData, groupby: undefined };
     const queryContext = buildQuery(formData);
     const [query] = queryContext.queries;
     expect(query.groupby).toEqual([]);

superset-frontend/plugins/plugin-chart-echarts/test/Gauge/transformProps.test.ts

@@ -16,18 +16,18 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { ChartProps } from '@superset-ui/core';
+import { ChartProps, SqlaFormData } from '@superset-ui/core';
 import transformProps from '../../src/Gauge/transformProps';
-import { DEFAULT_GAUGE_SERIES_OPTION } from '../../src/Gauge/constants';
+import { EchartsGaugeChartProps } from '../../src/Gauge/types';
 
 describe('Echarts Gauge transformProps', () => {
-  const baseFormData = {
+  const baseFormData: SqlaFormData = {
     datasource: '26__table',
-    vizType: 'gauge_chart',
+    viz_type: 'gauge_chart',
     metric: 'count',
     adhocFilters: [],
     rowLimit: 10,
-    minVal: '0',
+    minVal: 0,
     maxVal: 100,
     startAngle: 225,
     endAngle: -45,
@@ -46,7 +46,7 @@ describe('Echarts Gauge transformProps', () => {
   };
 
   it('should transform chart props for no group by column', () => {
-    const formData = { ...baseFormData, groupby: [] };
+    const formData: SqlaFormData = { ...baseFormData, groupby: [] };
     const queriesData = [
       {
         colnames: ['count'],
@@ -66,7 +66,7 @@ describe('Echarts Gauge transformProps', () => {
     };
 
     const chartProps = new ChartProps(chartPropsConfig);
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsGaugeChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,
@@ -98,7 +98,10 @@ describe('Echarts Gauge transformProps', () => {
   });
 
   it('should transform chart props for single group by column', () => {
-    const formData = { ...baseFormData, groupby: ['year'] };
+    const formData: SqlaFormData = {
+      ...baseFormData,
+      groupby: ['year'],
+    };
     const queriesData = [
       {
         colnames: ['year', 'count'],
@@ -123,7 +126,7 @@ describe('Echarts Gauge transformProps', () => {
     };
 
     const chartProps = new ChartProps(chartPropsConfig);
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsGaugeChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,
@@ -170,7 +173,10 @@ describe('Echarts Gauge transformProps', () => {
   });
 
   it('should transform chart props for multiple group by columns', () => {
-    const formData = { ...baseFormData, groupby: ['year', 'platform'] };
+    const formData: SqlaFormData = {
+      ...baseFormData,
+      groupby: ['year', 'platform'],
+    };
     const queriesData = [
       {
         colnames: ['year', 'platform', 'count'],
@@ -197,7 +203,7 @@ describe('Echarts Gauge transformProps', () => {
     };
 
     const chartProps = new ChartProps(chartPropsConfig);
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsGaugeChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,
@@ -244,7 +250,7 @@ describe('Echarts Gauge transformProps', () => {
   });
 
   it('should transform chart props for intervals', () => {
-    const formData = {
+    const formData: SqlaFormData = {
       ...baseFormData,
       groupby: ['year', 'platform'],
       intervals: '50,100',
@@ -276,7 +282,7 @@ describe('Echarts Gauge transformProps', () => {
     };
 
     const chartProps = new ChartProps(chartPropsConfig);
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsGaugeChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,

superset-frontend/plugins/plugin-chart-echarts/test/Pie/transformProps.test.ts

@@ -22,7 +22,7 @@ import {
   SqlaFormData,
 } from '@superset-ui/core';
 import transformProps, { formatPieLabel } from '../../src/Pie/transformProps';
-import { EchartsPieLabelType } from '../../src/Pie/types';
+import { EchartsPieChartProps, EchartsPieLabelType } from '../../src/Pie/types';
 
 describe('Pie tranformProps', () => {
   const formData: SqlaFormData = {
@@ -48,7 +48,7 @@ describe('Pie tranformProps', () => {
   });
 
   it('should tranform chart props for viz', () => {
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsPieChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,

superset-frontend/plugins/plugin-chart-echarts/test/Timeseries/transformProps.test.ts

@@ -24,12 +24,14 @@ import {
   EventAnnotationLayer,
   FormulaAnnotationLayer,
   IntervalAnnotationLayer,
+  SqlaFormData,
   TimeseriesAnnotationLayer,
 } from '@superset-ui/core';
+import { EchartsTimeseriesChartProps } from '../../src/types';
 import transformProps from '../../src/Timeseries/transformProps';
 
 describe('EchartsTimeseries transformProps', () => {
-  const formData = {
+  const formData: SqlaFormData = {
     colorScheme: 'bnbColors',
     datasource: '3__table',
     granularity_sqla: 'ds',
@@ -54,7 +56,7 @@ describe('EchartsTimeseries transformProps', () => {
 
   it('should tranform chart props for viz', () => {
     const chartProps = new ChartProps(chartPropsConfig);
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsTimeseriesChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,
@@ -99,7 +101,7 @@ describe('EchartsTimeseries transformProps', () => {
         annotationLayers: [formula],
       },
     });
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsTimeseriesChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,
@@ -227,7 +229,7 @@ describe('EchartsTimeseries transformProps', () => {
         },
       ],
     });
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsTimeseriesChartProps)).toEqual(
       expect.objectContaining({
         echartOptions: expect.objectContaining({
           legend: expect.objectContaining({
@@ -266,7 +268,8 @@ describe('Does transformProps transform series correctly', () => {
     name: string;
   };
 
-  const formData = {
+  const formData: SqlaFormData = {
+    viz_type: 'my_viz',
     colorScheme: 'bnbColors',
     datasource: '3__table',
     granularity_sqla: 'ds',
@@ -329,8 +332,9 @@ describe('Does transformProps transform series correctly', () => {
   it('should show labels when showValue is true', () => {
     const chartProps = new ChartProps(chartPropsConfig);
 
-    const transformedSeries = transformProps(chartProps).echartOptions
-      .series as seriesType[];
+    const transformedSeries = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    ).echartOptions.series as seriesType[];
 
     transformedSeries.forEach(series => {
       expect(series.label.show).toBe(true);
@@ -345,8 +349,9 @@ describe('Does transformProps transform series correctly', () => {
 
     const chartProps = new ChartProps(updatedChartPropsConfig);
 
-    const transformedSeries = transformProps(chartProps).echartOptions
-      .series as seriesType[];
+    const transformedSeries = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    ).echartOptions.series as seriesType[];
 
     transformedSeries.forEach(series => {
       expect(series.label.show).toBe(false);
@@ -361,8 +366,9 @@ describe('Does transformProps transform series correctly', () => {
 
     const chartProps = new ChartProps(updatedChartPropsConfig);
 
-    const transformedSeries = transformProps(chartProps).echartOptions
-      .series as seriesType[];
+    const transformedSeries = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    ).echartOptions.series as seriesType[];
 
     const showValueIndexes: number[] = [];
 
@@ -400,8 +406,9 @@ describe('Does transformProps transform series correctly', () => {
   it('should show labels on values >= percentageThreshold if onlyTotal is false', () => {
     const chartProps = new ChartProps(chartPropsConfig);
 
-    const transformedSeries = transformProps(chartProps).echartOptions
-      .series as seriesType[];
+    const transformedSeries = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    ).echartOptions.series as seriesType[];
 
     const expectedThresholds = totalStackedValues.map(
       total => ((formData.percentageThreshold || 0) / 100) * total,
@@ -430,8 +437,9 @@ describe('Does transformProps transform series correctly', () => {
 
     const chartProps = new ChartProps(updatedChartPropsConfig);
 
-    const transformedSeries = transformProps(chartProps).echartOptions
-      .series as seriesType[];
+    const transformedSeries = transformProps(
+      chartProps as EchartsTimeseriesChartProps,
+    ).echartOptions.series as seriesType[];
 
     transformedSeries.forEach((series, seriesIndex) => {
       expect(series.label.show).toBe(true);

superset-frontend/plugins/plugin-chart-echarts/test/Treemap/transformProps.test.ts

@@ -17,6 +17,7 @@
  * under the License.
  */
 import { ChartProps } from '@superset-ui/core';
+import { EchartsTreemapChartProps } from '../../src/Treemap/types';
 import transformProps from '../../src/Treemap/transformProps';
 
 describe('Treemap tranformProps', () => {
@@ -42,7 +43,7 @@ describe('Treemap tranformProps', () => {
   });
 
   it('should tranform chart props for viz', () => {
-    expect(transformProps(chartProps)).toEqual(
+    expect(transformProps(chartProps as EchartsTreemapChartProps)).toEqual(
       expect.objectContaining({
         width: 800,
         height: 600,

superset-frontend/plugins/plugin-chart-pivot-table/test/plugin/buildQuery.test.ts

@@ -18,9 +18,10 @@
  */
 
 import buildQuery from '../../src/plugin/buildQuery';
+import { PivotTableQueryFormData } from '../../src/types';
 
 describe('PivotTableChart buildQuery', () => {
-  const formData = {
+  const formData: PivotTableQueryFormData = {
     groupbyRows: ['row1', 'row2'],
     groupbyColumns: ['col1', 'col2'],
     metrics: ['metric1', 'metric2'],
@@ -46,6 +47,7 @@ describe('PivotTableChart buildQuery', () => {
     setDataMask: () => {},
     legacy_order_by: 'count',
     order_desc: true,
+    margin: 0,
   };
 
   it('should build groupby with series in form data', () => {

superset-frontend/plugins/plugin-chart-table/src/types.ts

@@ -74,7 +74,7 @@ export type TableChartFormData = QueryFormData & {
 };
 
 export interface TableChartProps extends ChartProps {
-  ownCurrentState: {
+  ownCurrentState?: {
     pageSize?: number;
     currentPage?: number;
   };

superset-frontend/plugins/plugin-chart-table/test/testData.ts

@@ -79,6 +79,8 @@ const basicQueryResult: ChartDataResponseResult = {
   rowcount: 100,
   stacktrace: null,
   status: 'success',
+  from_dttm: null,
+  to_dttm: null,
 };
 
 /**

superset-frontend/tsconfig.json

@@ -72,6 +72,7 @@
     "./packages/*/types/**/*",
     "./plugins/*/src/**/*",
     "./plugins/*/types/**/*",
-    "./packages/*/test/**/*"
+    "./packages/*/test/**/*",
+    "./plugins/*/test/**/*"
   ]
 }