* [functional test] remove redundant navigation, wait for lens to be loaded * fix navigation to new viz * update test title Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
478 lines
15 KiB
TypeScript
478 lines
15 KiB
TypeScript
/*
|
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
* Side Public License, v 1.
|
|
*/
|
|
|
|
import { FtrProviderContext } from '../ftr_provider_context';
|
|
import { VisualizeConstants } from '../../../src/plugins/visualize/public/application/visualize_constants';
|
|
import { UI_SETTINGS } from '../../../src/plugins/data/common';
|
|
|
|
// TODO: Remove & Refactor to use the TTV page objects
|
|
interface VisualizeSaveModalArgs {
|
|
saveAsNew?: boolean;
|
|
redirectToOrigin?: boolean;
|
|
addToDashboard?: boolean;
|
|
dashboardId?: string;
|
|
}
|
|
|
|
type DashboardPickerOption =
|
|
| 'add-to-library-option'
|
|
| 'existing-dashboard-option'
|
|
| 'new-dashboard-option';
|
|
|
|
export function VisualizePageProvider({ getService, getPageObjects }: FtrProviderContext) {
|
|
const kibanaServer = getService('kibanaServer');
|
|
const testSubjects = getService('testSubjects');
|
|
const retry = getService('retry');
|
|
const find = getService('find');
|
|
const log = getService('log');
|
|
const globalNav = getService('globalNav');
|
|
const listingTable = getService('listingTable');
|
|
const queryBar = getService('queryBar');
|
|
const elasticChart = getService('elasticChart');
|
|
const { common, header, visEditor, visChart } = getPageObjects([
|
|
'common',
|
|
'header',
|
|
'visEditor',
|
|
'visChart',
|
|
]);
|
|
|
|
/**
|
|
* This page object contains the visualization type selection, the landing page,
|
|
* and the open/save dialog functions
|
|
*/
|
|
class VisualizePage {
|
|
index = {
|
|
LOGSTASH_TIME_BASED: 'logstash-*',
|
|
LOGSTASH_NON_TIME_BASED: 'logstash*',
|
|
};
|
|
|
|
public async initTests() {
|
|
await kibanaServer.savedObjects.clean({ types: ['visualization'] });
|
|
await kibanaServer.importExport.load('visualize');
|
|
|
|
await kibanaServer.uiSettings.replace({
|
|
defaultIndex: 'logstash-*',
|
|
[UI_SETTINGS.FORMAT_BYTES_DEFAULT_PATTERN]: '0,0.[000]b',
|
|
});
|
|
}
|
|
|
|
public async gotoVisualizationLandingPage() {
|
|
await common.navigateToApp('visualize');
|
|
}
|
|
|
|
public async clickNewVisualization() {
|
|
await listingTable.clickNewButton('createVisualizationPromptButton');
|
|
}
|
|
|
|
public async clickAggBasedVisualizations() {
|
|
await testSubjects.click('visGroupAggBasedExploreLink');
|
|
}
|
|
|
|
public async goBackToGroups() {
|
|
await testSubjects.click('goBackLink');
|
|
}
|
|
|
|
public async createVisualizationPromptButton() {
|
|
await testSubjects.click('createVisualizationPromptButton');
|
|
}
|
|
|
|
public async getChartTypes() {
|
|
const chartTypeField = await testSubjects.find('visNewDialogTypes');
|
|
const $ = await chartTypeField.parseDomContent();
|
|
return $('button')
|
|
.toArray()
|
|
.map((chart) => $(chart).findTestSubject('visTypeTitle').text().trim());
|
|
}
|
|
|
|
public async getPromotedVisTypes() {
|
|
const chartTypeField = await testSubjects.find('visNewDialogGroups');
|
|
const $ = await chartTypeField.parseDomContent();
|
|
const promotedVisTypes: string[] = [];
|
|
$('button')
|
|
.toArray()
|
|
.forEach((chart) => {
|
|
const title = $(chart).findTestSubject('visTypeTitle').text().trim();
|
|
if (title) {
|
|
promotedVisTypes.push(title);
|
|
}
|
|
});
|
|
return promotedVisTypes;
|
|
}
|
|
|
|
public async waitForVisualizationSelectPage() {
|
|
await retry.try(async () => {
|
|
const visualizeSelectTypePage = await testSubjects.find('visNewDialogTypes');
|
|
if (!(await visualizeSelectTypePage.isDisplayed())) {
|
|
throw new Error('wait for visualization select page');
|
|
}
|
|
});
|
|
}
|
|
|
|
public async clickRefresh() {
|
|
if (await visChart.isNewChartsLibraryEnabled()) {
|
|
await elasticChart.setNewChartUiDebugFlag();
|
|
}
|
|
await queryBar.clickQuerySubmitButton();
|
|
}
|
|
|
|
public async waitForGroupsSelectPage() {
|
|
await retry.try(async () => {
|
|
const visualizeSelectGroupStep = await testSubjects.find('visNewDialogGroups');
|
|
if (!(await visualizeSelectGroupStep.isDisplayed())) {
|
|
throw new Error('wait for vis groups select step');
|
|
}
|
|
});
|
|
}
|
|
|
|
public async navigateToNewVisualization() {
|
|
await this.gotoVisualizationLandingPage();
|
|
await header.waitUntilLoadingHasFinished();
|
|
await this.clickNewVisualization();
|
|
await this.waitForGroupsSelectPage();
|
|
}
|
|
|
|
public async navigateToNewAggBasedVisualization() {
|
|
await this.gotoVisualizationLandingPage();
|
|
await header.waitUntilLoadingHasFinished();
|
|
await this.clickNewVisualization();
|
|
await this.clickAggBasedVisualizations();
|
|
await this.waitForVisualizationSelectPage();
|
|
}
|
|
|
|
public async hasVisType(type: string) {
|
|
return await testSubjects.exists(`visType-${type}`);
|
|
}
|
|
|
|
public async clickVisType(type: string) {
|
|
await testSubjects.click(`visType-${type}`);
|
|
await header.waitUntilLoadingHasFinished();
|
|
}
|
|
|
|
public async clickAreaChart() {
|
|
await this.clickVisType('area');
|
|
}
|
|
|
|
public async clickDataTable() {
|
|
await this.clickVisType('table');
|
|
}
|
|
|
|
public async clickLineChart() {
|
|
await this.clickVisType('line');
|
|
}
|
|
|
|
public async clickRegionMap() {
|
|
await this.clickVisType('region_map');
|
|
}
|
|
|
|
public async hasRegionMap() {
|
|
return await this.hasVisType('region_map');
|
|
}
|
|
|
|
public async clickMarkdownWidget() {
|
|
await this.clickVisType('markdown');
|
|
}
|
|
|
|
public async clickMetric() {
|
|
await this.clickVisType('metric');
|
|
}
|
|
|
|
public async clickGauge() {
|
|
await this.clickVisType('gauge');
|
|
}
|
|
|
|
public async clickPieChart() {
|
|
await this.clickVisType('pie');
|
|
}
|
|
|
|
public async clickTileMap() {
|
|
await this.clickVisType('tile_map');
|
|
}
|
|
|
|
public async hasTileMap() {
|
|
return await this.hasVisType('tile_map');
|
|
}
|
|
|
|
public async clickTagCloud() {
|
|
await this.clickVisType('tagcloud');
|
|
}
|
|
|
|
public async clickVega() {
|
|
await this.clickVisType('vega');
|
|
}
|
|
|
|
public async clickVisualBuilder() {
|
|
await this.clickVisType('metrics');
|
|
}
|
|
|
|
public async clickVerticalBarChart() {
|
|
await this.clickVisType('histogram');
|
|
}
|
|
|
|
public async clickHeatmapChart() {
|
|
await this.clickVisType('heatmap');
|
|
}
|
|
|
|
public async clickInputControlVis() {
|
|
await this.clickVisType('input_control_vis');
|
|
}
|
|
|
|
public async clickLensWidget() {
|
|
await this.clickVisType('lens');
|
|
}
|
|
|
|
public async clickMapsApp() {
|
|
await this.clickVisType('maps');
|
|
}
|
|
|
|
public async hasMapsApp() {
|
|
return await this.hasVisType('maps');
|
|
}
|
|
|
|
public async createSimpleMarkdownViz(vizName: string) {
|
|
await this.gotoVisualizationLandingPage();
|
|
await this.navigateToNewVisualization();
|
|
await this.clickMarkdownWidget();
|
|
await visEditor.setMarkdownTxt(vizName);
|
|
await visEditor.clickGo();
|
|
await this.saveVisualization(vizName);
|
|
}
|
|
|
|
public async clickNewSearch(indexPattern = this.index.LOGSTASH_TIME_BASED) {
|
|
await testSubjects.click(`savedObjectTitle${indexPattern.split(' ').join('-')}`);
|
|
await header.waitUntilLoadingHasFinished();
|
|
}
|
|
|
|
public async selectVisSourceIfRequired() {
|
|
log.debug('selectVisSourceIfRequired');
|
|
const selectPage = await testSubjects.findAll('visualizeSelectSearch');
|
|
if (selectPage.length) {
|
|
log.debug('a search is required for this visualization');
|
|
await this.clickNewSearch();
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Deletes all existing visualizations
|
|
*/
|
|
public async deleteAllVisualizations() {
|
|
await retry.try(async () => {
|
|
await listingTable.checkListingSelectAllCheckbox();
|
|
await listingTable.clickDeleteSelected();
|
|
await common.clickConfirmOnModal();
|
|
await testSubjects.find('createVisualizationPromptButton');
|
|
});
|
|
}
|
|
|
|
public async isBetaInfoShown() {
|
|
return await testSubjects.exists('betaVisInfo');
|
|
}
|
|
|
|
public async getBetaTypeLinks() {
|
|
return await find.allByCssSelector('[data-vis-stage="beta"]');
|
|
}
|
|
|
|
public async getExperimentalTypeLinks() {
|
|
return await find.allByCssSelector('[data-vis-stage="experimental"]');
|
|
}
|
|
|
|
public async isExperimentalInfoShown() {
|
|
return await testSubjects.exists('experimentalVisInfo');
|
|
}
|
|
|
|
public async getExperimentalInfo() {
|
|
return await testSubjects.find('experimentalVisInfo');
|
|
}
|
|
|
|
public async getSideEditorExists() {
|
|
return await find.existsByCssSelector('.visEditor__collapsibleSidebar');
|
|
}
|
|
|
|
public async clickSavedSearch(savedSearchName: string) {
|
|
await testSubjects.click(`savedObjectTitle${savedSearchName.split(' ').join('-')}`);
|
|
await header.waitUntilLoadingHasFinished();
|
|
}
|
|
|
|
public async clickUnlinkSavedSearch() {
|
|
await testSubjects.click('showUnlinkSavedSearchPopover');
|
|
await testSubjects.click('unlinkSavedSearch');
|
|
await header.waitUntilLoadingHasFinished();
|
|
}
|
|
|
|
public async ensureSavePanelOpen() {
|
|
log.debug('ensureSavePanelOpen');
|
|
await header.waitUntilLoadingHasFinished();
|
|
const isOpen = await testSubjects.exists('savedObjectSaveModal', { timeout: 5000 });
|
|
if (!isOpen) {
|
|
await testSubjects.click('visualizeSaveButton');
|
|
}
|
|
}
|
|
|
|
public async clickLoadSavedVisButton() {
|
|
// TODO: Use a test subject selector once we rewrite breadcrumbs to accept each breadcrumb
|
|
// element as a child instead of building the breadcrumbs dynamically.
|
|
await find.clickByCssSelector('[href="#/"]');
|
|
}
|
|
|
|
public async loadSavedVisualization(vizName: string, { navigateToVisualize = true } = {}) {
|
|
if (navigateToVisualize) {
|
|
await this.clickLoadSavedVisButton();
|
|
}
|
|
await this.openSavedVisualization(vizName);
|
|
}
|
|
|
|
public async openSavedVisualization(vizName: string) {
|
|
const dataTestSubj = `visListingTitleLink-${vizName.split(' ').join('-')}`;
|
|
await testSubjects.click(dataTestSubj, 20000);
|
|
await header.waitUntilLoadingHasFinished();
|
|
}
|
|
|
|
public async waitForVisualizationSavedToastGone() {
|
|
await testSubjects.waitForDeleted('saveVisualizationSuccess');
|
|
}
|
|
|
|
public async clickLandingPageBreadcrumbLink() {
|
|
log.debug('clickLandingPageBreadcrumbLink');
|
|
await find.clickByCssSelector(`a[href="#${VisualizeConstants.LANDING_PAGE_PATH}"]`);
|
|
}
|
|
|
|
/**
|
|
* Returns true if already on the landing page (that page doesn't have a link to itself).
|
|
* @returns {Promise<boolean>}
|
|
*/
|
|
public async onLandingPage() {
|
|
log.debug(`VisualizePage.onLandingPage`);
|
|
return await testSubjects.exists('visualizationLandingPage');
|
|
}
|
|
|
|
public async gotoLandingPage() {
|
|
log.debug('VisualizePage.gotoLandingPage');
|
|
const onPage = await this.onLandingPage();
|
|
if (!onPage) {
|
|
await retry.try(async () => {
|
|
await this.clickLandingPageBreadcrumbLink();
|
|
const onLandingPage = await this.onLandingPage();
|
|
if (!onLandingPage) throw new Error('Not on the landing page.');
|
|
});
|
|
}
|
|
}
|
|
|
|
public async saveVisualization(vizName: string, saveModalArgs: VisualizeSaveModalArgs = {}) {
|
|
await this.ensureSavePanelOpen();
|
|
|
|
await this.setSaveModalValues(vizName, saveModalArgs);
|
|
log.debug('Click Save Visualization button');
|
|
|
|
await testSubjects.click('confirmSaveSavedObjectButton');
|
|
|
|
// Confirm that the Visualization has actually been saved
|
|
await testSubjects.existOrFail('saveVisualizationSuccess');
|
|
const message = await common.closeToast();
|
|
await header.waitUntilLoadingHasFinished();
|
|
await common.waitForSaveModalToClose();
|
|
|
|
return message;
|
|
}
|
|
|
|
public async setSaveModalValues(
|
|
vizName: string,
|
|
{ saveAsNew, redirectToOrigin, addToDashboard, dashboardId }: VisualizeSaveModalArgs = {}
|
|
) {
|
|
await testSubjects.setValue('savedObjectTitle', vizName);
|
|
|
|
const saveAsNewCheckboxExists = await testSubjects.exists('saveAsNewCheckbox');
|
|
if (saveAsNewCheckboxExists) {
|
|
const state = saveAsNew ? 'check' : 'uncheck';
|
|
log.debug('save as new checkbox exists. Setting its state to', state);
|
|
await testSubjects.setEuiSwitch('saveAsNewCheckbox', state);
|
|
}
|
|
|
|
const redirectToOriginCheckboxExists = await testSubjects.exists('returnToOriginModeSwitch');
|
|
if (redirectToOriginCheckboxExists) {
|
|
const state = redirectToOrigin ? 'check' : 'uncheck';
|
|
log.debug('redirect to origin checkbox exists. Setting its state to', state);
|
|
await testSubjects.setEuiSwitch('returnToOriginModeSwitch', state);
|
|
}
|
|
|
|
const dashboardSelectorExists = await testSubjects.exists('add-to-dashboard-options');
|
|
if (dashboardSelectorExists) {
|
|
let option: DashboardPickerOption = 'add-to-library-option';
|
|
if (addToDashboard) {
|
|
option = dashboardId ? 'existing-dashboard-option' : 'new-dashboard-option';
|
|
}
|
|
log.debug('save modal dashboard selector, choosing option:', option);
|
|
const dashboardSelector = await testSubjects.find('add-to-dashboard-options');
|
|
const label = await dashboardSelector.findByCssSelector(`label[for="${option}"]`);
|
|
await label.click();
|
|
|
|
if (dashboardId) {
|
|
// TODO - selecting an existing dashboard
|
|
}
|
|
}
|
|
}
|
|
|
|
public async saveVisualizationExpectSuccess(
|
|
vizName: string,
|
|
{ saveAsNew, redirectToOrigin, addToDashboard, dashboardId }: VisualizeSaveModalArgs = {}
|
|
) {
|
|
const saveMessage = await this.saveVisualization(vizName, {
|
|
saveAsNew,
|
|
redirectToOrigin,
|
|
addToDashboard,
|
|
dashboardId,
|
|
});
|
|
if (!saveMessage) {
|
|
throw new Error(
|
|
`Expected saveVisualization to respond with the saveMessage from the toast, got ${saveMessage}`
|
|
);
|
|
}
|
|
}
|
|
|
|
public async saveVisualizationExpectSuccessAndBreadcrumb(
|
|
vizName: string,
|
|
{ saveAsNew = false, redirectToOrigin = false } = {}
|
|
) {
|
|
await this.saveVisualizationExpectSuccess(vizName, { saveAsNew, redirectToOrigin });
|
|
await retry.waitFor(
|
|
'last breadcrumb to have new vis name',
|
|
async () => (await globalNav.getLastBreadcrumb()) === vizName
|
|
);
|
|
}
|
|
|
|
public async saveVisualizationAndReturn() {
|
|
await header.waitUntilLoadingHasFinished();
|
|
await testSubjects.existOrFail('visualizesaveAndReturnButton');
|
|
await testSubjects.click('visualizesaveAndReturnButton');
|
|
}
|
|
|
|
public async linkedToOriginatingApp() {
|
|
await header.waitUntilLoadingHasFinished();
|
|
await testSubjects.existOrFail('visualizesaveAndReturnButton');
|
|
}
|
|
|
|
public async notLinkedToOriginatingApp() {
|
|
await header.waitUntilLoadingHasFinished();
|
|
await testSubjects.missingOrFail('visualizesaveAndReturnButton');
|
|
}
|
|
|
|
public async cancelAndReturn(showConfirmModal: boolean) {
|
|
await header.waitUntilLoadingHasFinished();
|
|
await testSubjects.existOrFail('visualizeCancelAndReturnButton');
|
|
await testSubjects.click('visualizeCancelAndReturnButton');
|
|
if (showConfirmModal) {
|
|
await retry.waitFor(
|
|
'confirm modal to show',
|
|
async () => await testSubjects.exists('appLeaveConfirmModal')
|
|
);
|
|
await testSubjects.exists('confirmModalConfirmButton');
|
|
await testSubjects.click('confirmModalConfirmButton');
|
|
}
|
|
}
|
|
}
|
|
|
|
return new VisualizePage();
|
|
}
|