@grafana/e2e: improve types (#27348)

This commit is contained in:
Steven Vachon 2020-09-02 20:37:23 -04:00 committed by GitHub
parent a8db544e85
commit 6c5a0421fe
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 125 additions and 100 deletions

View File

@ -15,24 +15,32 @@ export interface AddDashboardConfig {
annotations: AddAnnotationConfig[];
timeRange: TimeRangeConfig;
title: string;
variables: Array<Partial<AddVariableConfig>>;
variables: PartialAddVariableConfig[];
}
export interface AddVariableConfig {
constantValue?: string;
dataSource?: string;
interface AddVariableDefault {
hide: string;
label?: string;
name: string;
query?: string;
regex?: string;
type: string;
}
// @todo improve config input/output: https://stackoverflow.com/a/63507459/923745
// @todo this actually returns type `Cypress.Chainable`
export const addDashboard = (config?: Partial<AddDashboardConfig>): any => {
const fullConfig = {
interface AddVariableOptional {
constantValue?: string;
dataSource?: string;
label?: string;
query?: string;
regex?: string;
}
interface AddVariableRequired {
name: string;
}
export type PartialAddVariableConfig = Partial<AddVariableDefault> & AddVariableOptional & AddVariableRequired;
export type AddVariableConfig = AddVariableDefault & AddVariableOptional & AddVariableRequired;
// @todo this actually returns type `Cypress.Chainable<AddDashboardConfig>`
export const addDashboard = (config?: Partial<AddDashboardConfig>) => {
const fullConfig: AddDashboardConfig = {
annotations: [],
title: `e2e-${uuidv4()}`,
variables: [],
@ -43,7 +51,7 @@ export const addDashboard = (config?: Partial<AddDashboardConfig>): any => {
zone: 'Coordinated Universal Time',
...config?.timeRange,
},
} as AddDashboardConfig;
};
const { annotations, timeRange, title, variables } = fullConfig;
@ -54,7 +62,9 @@ export const addDashboard = (config?: Partial<AddDashboardConfig>): any => {
if (annotations.length > 0 || variables.length > 0) {
e2e.pages.Dashboard.Toolbar.toolbarItems('Dashboard settings').click();
addAnnotations(annotations);
addVariables(variables);
fullConfig.variables = addVariables(variables);
e2e.components.BackButton.backArrow().click();
}
@ -137,13 +147,12 @@ const addAnnotation = (config: AddAnnotationConfig, isFirst: boolean) => {
.click();
};
// @todo this actually returns type `Cypress.Chainable`
const addAnnotations = (configs: AddAnnotationConfig[]): any => {
const addAnnotations = (configs: AddAnnotationConfig[]) => {
if (configs.length > 0) {
e2e.pages.Dashboard.Settings.General.sectionItems('Annotations').click();
}
return configs.map((config, i) => addAnnotation(config, i === 0));
return configs.forEach((config, i) => addAnnotation(config, i === 0));
};
export const VARIABLE_HIDE_LABEL = 'Label';
@ -155,13 +164,12 @@ export const VARIABLE_TYPE_CONSTANT = 'Constant';
export const VARIABLE_TYPE_DATASOURCE = 'Datasource';
export const VARIABLE_TYPE_QUERY = 'Query';
// @todo this actually returns type `Cypress.Chainable`
const addVariable = (config: Partial<AddVariableConfig>, isFirst: boolean): any => {
const addVariable = (config: PartialAddVariableConfig, isFirst: boolean): AddVariableConfig => {
const fullConfig = {
hide: VARIABLE_HIDE_NOTHING,
type: VARIABLE_TYPE_QUERY,
...config,
} as AddVariableConfig;
};
if (isFirst) {
e2e.pages.Dashboard.Settings.Variables.List.addVariableCTA().click();
@ -227,8 +235,7 @@ const addVariable = (config: Partial<AddVariableConfig>, isFirst: boolean): any
return fullConfig;
};
// @todo this actually returns type `Cypress.Chainable`
const addVariables = (configs: Array<Partial<AddVariableConfig>>): any => {
const addVariables = (configs: PartialAddVariableConfig[]): AddVariableConfig[] => {
if (configs.length > 0) {
e2e.pages.Dashboard.Settings.General.sectionItems('Variables').click();
}

View File

@ -9,16 +9,15 @@ export interface AddDataSourceConfig {
basicAuthUser: string;
checkHealth: boolean;
expectedAlertMessage: string | RegExp;
form: Function;
form: () => void;
name: string;
skipTlsVerify: boolean;
type: string;
}
// @todo improve config input/output: https://stackoverflow.com/a/63507459/923745
// @todo this actually returns type `Cypress.Chainable`
export const addDataSource = (config?: Partial<AddDataSourceConfig>): any => {
const fullConfig = {
// @todo this actually returns type `Cypress.Chainable<AddDaaSourceConfig>`
export const addDataSource = (config?: Partial<AddDataSourceConfig>) => {
const fullConfig: AddDataSourceConfig = {
basicAuth: false,
basicAuthPassword: '',
basicAuthUser: '',
@ -29,7 +28,7 @@ export const addDataSource = (config?: Partial<AddDataSourceConfig>): any => {
skipTlsVerify: false,
type: 'TestData DB',
...config,
} as AddDataSourceConfig;
};
const {
basicAuth,

View File

@ -1,24 +1,14 @@
import { configurePanel, ConfigurePanelConfig } from './configurePanel';
import { configurePanel, PartialAddPanelConfig } from './configurePanel';
import { getScenarioContext } from '../support/scenarioContext';
import { v4 as uuidv4 } from 'uuid';
// @todo `Omit` 'isExplore'
export interface AddPanelConfig extends ConfigurePanelConfig {
dataSourceName: string;
queriesForm: (config: AddPanelConfig) => void;
visualizationName: string;
}
// @todo improve config input/output: https://stackoverflow.com/a/63507459/923745
// @todo this actually returns type `Cypress.Chainable`
export const addPanel = (config?: Partial<AddPanelConfig>): any =>
export const addPanel = (config?: Partial<PartialAddPanelConfig>) =>
getScenarioContext().then(({ lastAddedDataSource }: any) =>
configurePanel(
{
dataSourceName: lastAddedDataSource,
panelTitle: `e2e-${uuidv4()}`,
...config,
} as AddPanelConfig,
false
)
configurePanel({
dataSourceName: lastAddedDataSource,
panelTitle: `e2e-${uuidv4()}`,
...config,
isEdit: false,
isExplore: false,
})
);

View File

@ -5,45 +5,75 @@ import { selectOption } from './selectOption';
import { setDashboardTimeRange } from './setDashboardTimeRange';
import { setTimeRange, TimeRangeConfig } from './setTimeRange';
export interface ConfigurePanelConfig {
interface AddPanelOverrides {
dataSourceName: string;
queriesForm: (config: AddPanelConfig) => void;
panelTitle: string;
}
interface EditPanelOverrides {
queriesForm?: (config: EditPanelConfig) => void;
panelTitle: string;
}
interface ConfigurePanelDefault {
chartData: {
method: string;
route: string | RegExp;
};
dashboardUid: string;
dataSourceName?: string;
isExplore: boolean;
matchScreenshot: boolean;
queriesForm?: (config: any) => void;
panelTitle: string;
saveDashboard: boolean;
screenshotName: string;
timeRange?: TimeRangeConfig;
visitDashboardAtStart: boolean; // @todo remove when possible
}
interface ConfigurePanelOptional {
dataSourceName?: string;
queriesForm?: (config: ConfigurePanelConfig) => void;
panelTitle?: string;
timeRange?: TimeRangeConfig;
visualizationName?: string;
}
// @todo improve config input/output: https://stackoverflow.com/a/63507459/923745
// @todo this actually returns type `Cypress.Chainable`
export const configurePanel = (config: Partial<ConfigurePanelConfig>, isEdit: boolean): any =>
interface ConfigurePanelRequired {
isEdit: boolean;
isExplore: boolean;
}
export type PartialConfigurePanelConfig = Partial<ConfigurePanelDefault> &
ConfigurePanelOptional &
ConfigurePanelRequired;
export type ConfigurePanelConfig = ConfigurePanelDefault & ConfigurePanelOptional & ConfigurePanelRequired;
export type PartialAddPanelConfig = PartialConfigurePanelConfig & AddPanelOverrides;
export type AddPanelConfig = ConfigurePanelConfig & AddPanelOverrides;
export type PartialEditPanelConfig = PartialConfigurePanelConfig & EditPanelOverrides;
export type EditPanelConfig = ConfigurePanelConfig & EditPanelOverrides;
// @todo this actually returns type `Cypress.Chainable<AddPanelConfig | EditPanelConfig | ConfigurePanelConfig>`
export const configurePanel = (config: PartialAddPanelConfig | PartialEditPanelConfig | PartialConfigurePanelConfig) =>
getScenarioContext().then(({ lastAddedDashboardUid }: any) => {
const fullConfig = {
const fullConfig: AddPanelConfig | EditPanelConfig | ConfigurePanelConfig = {
chartData: {
method: 'POST',
route: '/api/ds/query',
},
dashboardUid: lastAddedDashboardUid,
isExplore: false,
matchScreenshot: false,
saveDashboard: true,
screenshotName: 'panel-visualization',
visitDashboardAtStart: true,
...config,
} as ConfigurePanelConfig;
};
const {
chartData,
dashboardUid,
dataSourceName,
isEdit,
isExplore,
matchScreenshot,
panelTitle,
@ -54,6 +84,10 @@ export const configurePanel = (config: Partial<ConfigurePanelConfig>, isEdit: bo
visualizationName,
} = fullConfig;
if (isEdit && isExplore) {
throw new TypeError('Invalid configuration');
}
if (isExplore) {
e2e.pages.Explore.visit();
} else {
@ -108,7 +142,7 @@ export const configurePanel = (config: Partial<ConfigurePanelConfig>, isEdit: bo
.find('[value="Panel Title"]')
.scrollIntoView()
.clear()
.type(panelTitle);
.type(panelTitle as string);
}
if (visualizationName) {

View File

@ -1,10 +1,8 @@
import { configurePanel, ConfigurePanelConfig } from './configurePanel';
import { configurePanel, PartialEditPanelConfig } from './configurePanel';
// @todo `Omit` 'isExplore'
export interface EditPanelConfig extends ConfigurePanelConfig {
queriesForm?: (config: EditPanelConfig) => void;
}
// @todo improve config input/output: https://stackoverflow.com/a/63507459/923745
// @todo this actually returns type `Cypress.Chainable`
export const editPanel = (config: Partial<EditPanelConfig>): any => configurePanel(config, true);
export const editPanel = (config: Partial<PartialEditPanelConfig>) =>
configurePanel({
...config,
isEdit: true,
isExplore: false,
});

View File

@ -1,28 +1,19 @@
import { configurePanel, ConfigurePanelConfig } from './configurePanel';
import { configurePanel, PartialConfigurePanelConfig } from './configurePanel';
import { getScenarioContext } from '../support/scenarioContext';
// @todo `Omit` 'dashboardUid' and 'panelTitle'
export interface ExploreConfig extends ConfigurePanelConfig {
queriesForm: (config: ExploreConfig) => void;
}
// @todo improve config input/output: https://stackoverflow.com/a/63507459/923745
// @todo this actually returns type `Cypress.Chainable`
export const explore = (config: Partial<ExploreConfig>): any =>
export const explore = (config: Partial<PartialConfigurePanelConfig>) =>
getScenarioContext().then(({ lastAddedDataSource }: any) =>
configurePanel(
{
dataSourceName: lastAddedDataSource,
isExplore: true,
screenshotName: 'explore-graph',
...config,
timeRange: {
from: '2020-01-01 00:00:00',
to: '2020-01-01 06:00:00',
zone: 'Coordinated Universal Time',
...config.timeRange,
},
} as ExploreConfig,
false
)
configurePanel({
dataSourceName: lastAddedDataSource,
screenshotName: 'explore-graph',
...config,
isEdit: false,
isExplore: true,
timeRange: {
from: '2020-01-01 00:00:00',
to: '2020-01-01 06:00:00',
zone: 'Coordinated Universal Time',
...config.timeRange,
},
})
);

View File

@ -2,18 +2,24 @@ import { e2e } from '../index';
import { getScenarioContext } from '../support/scenarioContext';
import { setDashboardTimeRange, TimeRangeConfig } from './setDashboardTimeRange';
export interface OpenDashboardConfig {
timeRange?: TimeRangeConfig;
interface OpenDashboardDefault {
uid: string;
}
// @todo improve config input/output: https://stackoverflow.com/a/63507459/923745
export const openDashboard = (config?: Partial<OpenDashboardConfig>) =>
interface OpenDashboardOptional {
timeRange?: TimeRangeConfig;
}
export type PartialOpenDashboardConfig = Partial<OpenDashboardDefault> & OpenDashboardOptional;
export type OpenDashboardConfig = OpenDashboardDefault & OpenDashboardOptional;
// @todo this actually returns type `Cypress.Chainable<OpenDashboardConfig>`
export const openDashboard = (config?: PartialOpenDashboardConfig) =>
getScenarioContext().then(({ lastAddedDashboardUid }: any) => {
const fullConfig = {
const fullConfig: OpenDashboardConfig = {
uid: lastAddedDashboardUid,
...config,
} as OpenDashboardConfig;
};
const { timeRange, uid } = fullConfig;

View File

@ -39,7 +39,7 @@ export const getScenarioContext = (): any =>
e2e()
.wrap(
{
getScenarioContext: () => ({ ...scenarioContext } as ScenarioContext),
getScenarioContext: (): ScenarioContext => ({ ...scenarioContext }),
},
{ log: false }
)