From 886efd5090ef05569f2b89e0a0fb2fa354ef9250 Mon Sep 17 00:00:00 2001 From: Dzmitry Lemechko Date: Wed, 4 Mar 2020 14:50:36 +0300 Subject: [PATCH 1/2] convert discover_page to ts --- .../apps/discover/_discover_histogram.js | 7 +- .../{discover_page.js => discover_page.ts} | 92 ++++++------------- test/functional/page_objects/index.ts | 2 - test/functional/services/elastic_chart.ts | 9 ++ 4 files changed, 39 insertions(+), 71 deletions(-) rename test/functional/page_objects/{discover_page.js => discover_page.ts} (76%) diff --git a/test/functional/apps/discover/_discover_histogram.js b/test/functional/apps/discover/_discover_histogram.js index 4780f36fc27c6..9310838666256 100644 --- a/test/functional/apps/discover/_discover_histogram.js +++ b/test/functional/apps/discover/_discover_histogram.js @@ -23,6 +23,7 @@ export default function({ getService, getPageObjects }) { const log = getService('log'); const esArchiver = getService('esArchiver'); const browser = getService('browser'); + const elasticChart = getService('elasticChart'); const kibanaServer = getService('kibanaServer'); const PageObjects = getPageObjects(['settings', 'common', 'discover', 'header', 'timePicker']); const defaultSettings = { @@ -64,7 +65,7 @@ export default function({ getService, getPageObjects }) { await PageObjects.timePicker.setAbsoluteRange(fromTime, toTime); await PageObjects.discover.setChartInterval('Monthly'); await PageObjects.header.waitUntilLoadingHasFinished(); - const chartCanvasExist = await PageObjects.discover.chartCanvasExist(); + const chartCanvasExist = await elasticChart.canvasExists(); expect(chartCanvasExist).to.be(true); }); it('should visualize weekly data with within DST changes', async () => { @@ -74,7 +75,7 @@ export default function({ getService, getPageObjects }) { await PageObjects.timePicker.setAbsoluteRange(fromTime, toTime); await PageObjects.discover.setChartInterval('Weekly'); await PageObjects.header.waitUntilLoadingHasFinished(); - const chartCanvasExist = await PageObjects.discover.chartCanvasExist(); + const chartCanvasExist = await elasticChart.canvasExists(); expect(chartCanvasExist).to.be(true); }); it('should visualize monthly data with different years Scaled to 30d', async () => { @@ -84,7 +85,7 @@ export default function({ getService, getPageObjects }) { await PageObjects.timePicker.setAbsoluteRange(fromTime, toTime); await PageObjects.discover.setChartInterval('Daily'); await PageObjects.header.waitUntilLoadingHasFinished(); - const chartCanvasExist = await PageObjects.discover.chartCanvasExist(); + const chartCanvasExist = await elasticChart.canvasExists(); expect(chartCanvasExist).to.be(true); }); }); diff --git a/test/functional/page_objects/discover_page.js b/test/functional/page_objects/discover_page.ts similarity index 76% rename from test/functional/page_objects/discover_page.js rename to test/functional/page_objects/discover_page.ts index 080b8c8ee753f..e71d4cee6fdea 100644 --- a/test/functional/page_objects/discover_page.js +++ b/test/functional/page_objects/discover_page.ts @@ -18,8 +18,9 @@ */ import expect from '@kbn/expect'; +import { FtrProviderContext } from '../ftr_provider_context'; -export function DiscoverPageProvider({ getService, getPageObjects }) { +export function DiscoverPageProvider({ getService, getPageObjects }: FtrProviderContext) { const log = getService('log'); const retry = getService('retry'); const testSubjects = getService('testSubjects'); @@ -33,20 +34,12 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { const elasticChart = getService('elasticChart'); class DiscoverPage { - async getQueryField() { - return await find.byCssSelector("input[ng-model='state.query']"); - } - - async getQuerySearchButton() { - return await find.byCssSelector("button[aria-label='Search']"); - } - async getChartTimespan() { const el = await find.byCssSelector('.small > label[for="dscResultsIntervalSelector"]'); return await el.getVisibleText(); } - async saveSearch(searchName) { + async saveSearch(searchName: string) { log.debug('saveSearch'); await this.clickSaveSearchButton(); await testSubjects.setValue('savedObjectTitle', searchName); @@ -63,7 +56,7 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { }); } - async inputSavedSearchTitle(searchName) { + async inputSavedSearchTitle(searchName: string) { await testSubjects.setValue('savedObjectTitle', searchName); } @@ -86,7 +79,7 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { } async openLoadSavedSearchPanel() { - const isOpen = await testSubjects.exists('loadSearchForm'); + let isOpen = await testSubjects.exists('loadSearchForm'); if (isOpen) { return; } @@ -96,7 +89,7 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { await retry.try(async () => { await this.clickLoadSavedSearchButton(); await PageObjects.header.waitUntilLoadingHasFinished(); - const isOpen = await testSubjects.exists('loadSearchForm'); + isOpen = await testSubjects.exists('loadSearchForm'); expect(isOpen).to.be(true); }); } @@ -105,12 +98,12 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { await flyout.ensureClosed('loadSearchForm'); } - async hasSavedSearch(searchName) { + async hasSavedSearch(searchName: string) { const searchLink = await find.byButtonText(searchName); - return searchLink.isDisplayed(); + return await searchLink.isDisplayed(); } - async loadSavedSearch(searchName) { + async loadSavedSearch(searchName: string) { await this.openLoadSavedSearchPanel(); const searchLink = await find.byButtonText(searchName); await searchLink.click(); @@ -133,16 +126,8 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { await testSubjects.click('euiFlyoutCloseButton'); } - async getChartCanvas() { - return await find.byCssSelector('.echChart canvas:last-of-type'); - } - - async chartCanvasExist() { - return await find.existsByCssSelector('.echChart canvas:last-of-type'); - } - async clickHistogramBar() { - const el = await this.getChartCanvas(); + const el = await elasticChart.getCanvas(); await browser .getActions() @@ -152,7 +137,7 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { } async brushHistogram() { - const el = await this.getChartCanvas(); + const el = await elasticChart.getCanvas(); await browser.dragAndDrop( { location: el, offset: { x: 200, y: 20 } }, @@ -164,39 +149,14 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { return await globalNav.getLastBreadcrumb(); } - async getBarChartData() { - let yAxisLabel = 0; - - await PageObjects.header.waitUntilLoadingHasFinished(); - const y = await find.byCssSelector( - 'div.visAxis__splitAxes--y > div > svg > g > g:last-of-type' - ); - const yLabel = await y.getVisibleText(); - yAxisLabel = yLabel.replace(',', ''); - log.debug('yAxisLabel = ' + yAxisLabel); - // #kibana-body > div.content > div > div > div > div.visEditor__canvas > visualize > div.visChart > div > div.visWrapper__column > div.visWrapper__chart > div > svg > g > g.series.\30 > rect:nth-child(1) - const svg = await find.byCssSelector('div.chart > svg'); - const $ = await svg.parseDomContent(); - const yAxisHeight = $('rect.background').attr('height'); - log.debug('theHeight = ' + yAxisHeight); - const bars = $('g > g.series > rect') - .toArray() - .map(chart => { - const barHeight = $(chart).attr('height'); - return Math.round((barHeight / yAxisHeight) * yAxisLabel); - }); - - return bars; - } - async getChartInterval() { const selectedValue = await testSubjects.getAttribute('discoverIntervalSelect', 'value'); const selectedOption = await find.byCssSelector('option[value="' + selectedValue + '"]'); return selectedOption.getVisibleText(); } - async setChartInterval(interval) { - const optionElement = await find.byCssSelector('option[label="' + interval + '"]', 5000); + async setChartInterval(interval: string) { + const optionElement = await find.byCssSelector(`option[label="'${interval}'"]`, 5000); await optionElement.click(); return await PageObjects.header.waitUntilLoadingHasFinished(); } @@ -211,12 +171,12 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { return await header.getVisibleText(); } - async getDocTableIndex(index) { - const row = await find.byCssSelector('tr.kbnDocTable__row:nth-child(' + index + ')'); + async getDocTableIndex(index: number) { + const row = await find.byCssSelector(`tr.kbnDocTable__row:nth-child('${index}')`); return await row.getVisibleText(); } - async getDocTableField(index) { + async getDocTableField(index: number) { const field = await find.byCssSelector( `tr.kbnDocTable__row:nth-child(${index}) > [data-test-subj='docTableField']` ); @@ -258,44 +218,44 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { return await testSubjects.exists('discoverNoResultsTimefilter'); } - async clickFieldListItem(field) { + async clickFieldListItem(field: string) { return await testSubjects.click(`field-${field}`); } - async clickFieldListItemAdd(field) { + async clickFieldListItemAdd(field: string) { await testSubjects.moveMouseTo(`field-${field}`); await testSubjects.click(`fieldToggle-${field}`); } - async clickFieldListItemVisualize(field) { + async clickFieldListItemVisualize(field: string) { return await retry.try(async () => { await testSubjects.click(`fieldVisualize-${field}`); }); } - async expectFieldListItemVisualize(field) { + async expectFieldListItemVisualize(field: string) { await testSubjects.existOrFail(`fieldVisualize-${field}`); } - async expectMissingFieldListItemVisualize(field) { + async expectMissingFieldListItemVisualize(field: string) { await testSubjects.missingOrFail(`fieldVisualize-${field}`, { allowHidden: true }); } - async clickFieldListPlusFilter(field, value) { + async clickFieldListPlusFilter(field: string, value: string) { // this method requires the field details to be open from clickFieldListItem() // testSubjects.find doesn't handle spaces in the data-test-subj value await find.clickByCssSelector(`[data-test-subj="plus-${field}-${value}"]`); await PageObjects.header.waitUntilLoadingHasFinished(); } - async clickFieldListMinusFilter(field, value) { + async clickFieldListMinusFilter(field: string, value: string) { // this method requires the field details to be open from clickFieldListItem() // testSubjects.find doesn't handle spaces in the data-test-subj value await find.clickByCssSelector('[data-test-subj="minus-' + field + '-' + value + '"]'); await PageObjects.header.waitUntilLoadingHasFinished(); } - async selectIndexPattern(indexPattern) { + async selectIndexPattern(indexPattern: string) { await testSubjects.click('indexPattern-switch-link'); await find.clickByCssSelector( `[data-test-subj="indexPattern-switcher"] [title="${indexPattern}"]` @@ -303,7 +263,7 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { await PageObjects.header.waitUntilLoadingHasFinished(); } - async removeHeaderColumn(name) { + async removeHeaderColumn(name: string) { await testSubjects.moveMouseTo(`docTableHeader-${name}`); await testSubjects.click(`docTableRemoveHeader-${name}`); } @@ -318,7 +278,7 @@ export function DiscoverPageProvider({ getService, getPageObjects }) { await testSubjects.missingOrFail('filterSelectionPanel', { allowHidden: true }); } - async waitForChartLoadingComplete(renderCount) { + async waitForChartLoadingComplete(renderCount: number) { await elasticChart.waitForRenderingCount('discoverChart', renderCount); } diff --git a/test/functional/page_objects/index.ts b/test/functional/page_objects/index.ts index 4ba8ddb035913..db58c3c2c7d19 100644 --- a/test/functional/page_objects/index.ts +++ b/test/functional/page_objects/index.ts @@ -23,13 +23,11 @@ import { ConsolePageProvider } from './console_page'; // @ts-ignore not TS yet import { ContextPageProvider } from './context_page'; import { DashboardPageProvider } from './dashboard_page'; -// @ts-ignore not TS yet import { DiscoverPageProvider } from './discover_page'; // @ts-ignore not TS yet import { ErrorPageProvider } from './error_page'; // @ts-ignore not TS yet import { HeaderPageProvider } from './header_page'; -// @ts-ignore not TS yet import { HomePageProvider } from './home_page'; // @ts-ignore not TS yet import { MonitoringPageProvider } from './monitoring_page'; diff --git a/test/functional/services/elastic_chart.ts b/test/functional/services/elastic_chart.ts index afae3f830b3bf..45ad157fc5c02 100644 --- a/test/functional/services/elastic_chart.ts +++ b/test/functional/services/elastic_chart.ts @@ -22,10 +22,19 @@ import { FtrProviderContext } from '../ftr_provider_context'; export function ElasticChartProvider({ getService }: FtrProviderContext) { const testSubjects = getService('testSubjects'); + const find = getService('find'); const retry = getService('retry'); const log = getService('log'); class ElasticChart { + public async getCanvas() { + return await find.byCssSelector('.echChart canvas:last-of-type'); + } + + public async canvasExists() { + return await find.existsByCssSelector('.echChart canvas:last-of-type'); + } + public async waitForRenderComplete(dataTestSubj: string) { const chart = await testSubjects.find(dataTestSubj); const rendered = await chart.findAllByCssSelector('.echChart[data-ech-render-complete=true]'); From 63c1868dcb7701cbb7d0f4f1c9cbb3b030906099 Mon Sep 17 00:00:00 2001 From: Dzmitry Lemechko Date: Wed, 4 Mar 2020 17:45:29 +0300 Subject: [PATCH 2/2] remove deuplicated methods, improve tests --- .../discover/np_ready/angular/discover.html | 2 +- .../apps/discover/_source_filters.js | 1 - test/functional/page_objects/discover_page.ts | 140 ++++++++++-------- test/functional/services/doc_table.ts | 8 +- 4 files changed, 80 insertions(+), 71 deletions(-) diff --git a/src/legacy/core_plugins/kibana/public/discover/np_ready/angular/discover.html b/src/legacy/core_plugins/kibana/public/discover/np_ready/angular/discover.html index 3fd3c5b5b7633..18254aeca5094 100644 --- a/src/legacy/core_plugins/kibana/public/discover/np_ready/angular/discover.html +++ b/src/legacy/core_plugins/kibana/public/discover/np_ready/angular/discover.html @@ -23,7 +23,7 @@

{{screenTitle}}

-