github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Lens][Agg based XY] Navigate to lens functional tests. (#143549)

Browse source 
* Add functional tests for agg based XY

* Updated snapshot
This commit is contained in:
Uladzislau Lasitsa 2022-10-19 17:23:21 +03:00 • committed by GitHub
parent 2328493755
commit 0994b9271b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 323 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/__snapshots__/value_axis_options.test.tsx.snap generated
View file

@ -3,6 +3,7 @@
exports[`ValueAxisOptions component should init with the default set of props 1`] = `
<Fragment>
<SelectOption
data-test-subj="valueAxisPosition-ValueAxis-1"
label="Position"
options={
Array [

1
src/plugins/vis_types/xy/public/editor/components/options/metrics_axes/value_axis_options.tsx
View file

@ -97,6 +97,7 @@ export function ValueAxisOptions({
label={i18n.translate('visTypeXy.controls.pointSeries.valueAxes.positionLabel', {
defaultMessage: 'Position',
})}
data-test-subj={`valueAxisPosition-${axis.id}`}
options={collections.positions}
paramName="position"
value={axis.position}

1
src/plugins/vis_types/xy/public/editor/components/options/point_series/threshold_panel.tsx
View file

@ -66,6 +66,7 @@ function ThresholdPanel({
paramName="show"
value={stateParams.thresholdLine.show}
setValue={setThresholdLine}
data-test-subj="xyShowThresholdLine"
/>
{stateParams.thresholdLine.show && (

11
test/functional/page_objects/visualize_editor_page.ts
View file

@ -425,6 +425,13 @@ export class VisualizeEditorPageObject extends FtrService {
await option.click();
}
public async selectYAxisPosition(axisId: string, position: string) {
const option = await (
await this.testSubjects.find(`valueAxisPosition-${axisId}`)
).findByCssSelector(`option[value="${position}"]`);
await option.click();
}
public async selectYAxisMode(mode: string) {
const selector = await this.find.byCssSelector(`#valueAxisMode0 > option[value="${mode}"]`);
await selector.click();
@ -522,6 +529,10 @@ export class VisualizeEditorPageObject extends FtrService {
return await this.testSubjects.click('showCategoryLines');
}
public async toggleShowThresholdLine() {
return await this.testSubjects.click('xyShowThresholdLine');
}
public async toggleValuesOnChart() {
return await this.testSubjects.click('showValuesOnChart');
}

2
x-pack/plugins/lens/public/shared_components/collapse_setting.tsx
View file

@ -49,7 +49,7 @@ export function CollapseSetting({
<EuiSelect
fullWidth
compressed
data-test-subj="indexPattern-terms-orderBy"
data-test-subj="indexPattern-collapse-by"
options={options}
value={value}
onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {

301
x-pack/test/functional/apps/lens/group3/open_in_lens/agg_based/xy.ts
View file

@ -39,15 +39,282 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
expect(await visualize.hasNavigateToLensButton()).to.eql(true);
});
it('should hide the "Edit Visualization in Lens" menu item if dot size aggregation is defined', async () => {
it('should not allow converting if dot size aggregation is defined', async () => {
await visEditor.clickBucket('Dot size', 'metrics');
await visEditor.selectAggregation('Max', 'metrics');
await visEditor.selectField('memory', 'metrics');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
expect(await visualize.hasNavigateToLensButton()).to.eql(false);
});
it('should convert to Lens', async () => {
it('should not allow converting if split chart is defined', async () => {
await visEditor.clickBucket('Split chart');
await visEditor.selectAggregation('Terms');
await visEditor.selectField('machine.os.raw');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
expect(await visualize.hasNavigateToLensButton()).to.eql(false);
});
it('should not allow converting if more than one axis left/right/top/bottom are defined', async () => {
await visEditor.clickBucket('Y-axis', 'metrics');
await visEditor.selectAggregation('Max', 'metrics');
await visEditor.selectField('memory', 'metrics');
await visEditor.clickMetricsAndAxes();
await visEditor.clickAddAxis();
await visEditor.toggleAccordion('visEditorSeriesAccordion2');
await visEditor.setSeriesAxis(1, 'ValueAxis-2');
await visEditor.clickYAxisOptions('ValueAxis-1');
await visEditor.selectYAxisPosition('ValueAxis-1', 'left');
await visEditor.clickYAxisOptions('ValueAxis-2');
await visEditor.selectYAxisPosition('ValueAxis-2', 'left');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
expect(await visualize.hasNavigateToLensButton()).to.eql(false);
});
it('should not allow converting if several split series are defined', async () => {
await visEditor.clickBucket('Split series');
await visEditor.selectAggregation('Terms');
await visEditor.selectField('machine.os.raw');
await visEditor.clickBucket('Split series');
await visEditor.selectAggregation('Date histogram', 'buckets', false, 1);
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
expect(await visualize.hasNavigateToLensButton()).to.eql(false);
});
it('should not allow converting if sibling pipeline agg and split series are defined', async () => {
await visEditor.clickMetricEditor();
await visEditor.selectAggregation('Max Bucket', 'metrics');
await visEditor.clickBucket('Split series');
await visEditor.selectAggregation('Terms');
await visEditor.selectField('machine.os.raw');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
expect(await visualize.hasNavigateToLensButton()).to.eql(false);
});
it('should not allow converting of unsupported aggregation', async () => {
await visEditor.clickMetricEditor();
await visEditor.selectAggregation('Serial diff', 'metrics');
await visEditor.clickBucket('Split series');
await visEditor.selectAggregation('Date histogram');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
const button = await testSubjects.exists('visualizeEditInLensButton');
expect(button).to.eql(false);
});
it('should convert in different layers if metrics have differents chart types', async () => {
await visEditor.clickBucket('Y-axis', 'metrics');
await visEditor.selectAggregation('Max', 'metrics');
await visEditor.selectField('memory', 'metrics');
await visEditor.clickMetricsAndAxes();
await visEditor.toggleAccordion('visEditorSeriesAccordion1');
await visEditor.setSeriesType(0, 'area');
await visEditor.toggleAccordion('visEditorSeriesAccordion2');
await visEditor.setSeriesType(1, 'histogram');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
await retry.try(async () => {
expect(await lens.getLayerCount()).to.be(2);
const layersSettings = await testSubjects.findAll('lns_layer_settings');
expect(layersSettings.length).to.be(2);
expect(await layersSettings[0].getVisibleText()).to.be('Area');
expect(await layersSettings[1].getVisibleText()).to.be('Bar vertical');
const yDimensionText1 = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
const yDimensionText2 = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 1);
expect(yDimensionText1).to.be('Count');
expect(yDimensionText2).to.be('Max memory');
});
});
it('should convert in one layer if metrics have the same chart type', async () => {
await visEditor.clickBucket('Y-axis', 'metrics');
await visEditor.selectAggregation('Max', 'metrics');
await visEditor.selectField('memory', 'metrics');
await visEditor.clickMetricsAndAxes();
await visEditor.toggleAccordion('visEditorSeriesAccordion1');
await visEditor.setSeriesType(0, 'histogram');
await visEditor.toggleAccordion('visEditorSeriesAccordion2');
await visEditor.setSeriesType(1, 'histogram');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
await retry.try(async () => {
expect(await lens.getLayerCount()).to.be(1);
const layersSettings = await testSubjects.findAll('lns_layer_settings');
expect(layersSettings.length).to.be(1);
expect(await layersSettings[0].getVisibleText()).to.be('Bar vertical');
const yDimensionText1 = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
const yDimensionText2 = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 1);
expect(yDimensionText1).to.be('Count');
expect(yDimensionText2).to.be('Max memory');
});
});
it('should convert parent pipeline aggregation', async () => {
await visEditor.clickMetricEditor();
await visEditor.selectAggregation('Cumulative sum', 'metrics');
await visEditor.clickBucket('Split series');
await visEditor.selectAggregation('Date histogram');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
await retry.try(async () => {
expect(await lens.getLayerCount()).to.be(1);
const yDimensionText = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
const splitText = await lens.getDimensionTriggerText('lnsXY_splitDimensionPanel', 0);
expect(yDimensionText).to.be('Cumulative Sum of Count');
expect(splitText).to.be('@timestamp');
});
});
it('should convert sibling pipeline aggregation', async () => {
await visEditor.clickMetricEditor();
await visEditor.selectAggregation('Max Bucket', 'metrics');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
expect(await lens.getLayerCount()).to.be(1);
const yDimensionText = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
const splitText = await lens.getDimensionTriggerText('lnsXY_splitDimensionPanel', 0);
expect(yDimensionText).to.be('Overall Max of Count');
expect(splitText).to.be('@timestamp');
await lens.openDimensionEditor('lnsXY_splitDimensionPanel > lns-dimensionTrigger');
const collapseBy = await testSubjects.find('indexPattern-collapse-by');
expect(await collapseBy.getAttribute('value')).to.be('max');
});
it('should draw a reference line', async () => {
await visEditor.clickOptionsTab();
await visEditor.toggleShowThresholdLine();
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
await retry.try(async () => {
expect(await lens.getLayerCount()).to.be(2);
const yDimensionText = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
expect(yDimensionText).to.be('Count');
const referenceLineDimensionText = await lens.getDimensionTriggerText(
'lnsXY_yReferenceLineLeftPanel',
0
);
expect(referenceLineDimensionText).to.be('Static value: 10');
});
});
it('should convert line stacked to area stacked chart', async () => {
await visEditor.clickMetricsAndAxes();
await visEditor.toggleAccordion('visEditorSeriesAccordion1');
await visEditor.setSeriesType(0, 'line');
await visEditor.selectChartMode('stacked');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
await retry.try(async () => {
expect(await lens.getLayerCount()).to.be(1);
const layersSettings = await testSubjects.findAll('lns_layer_settings');
expect(layersSettings.length).to.be(1);
expect(await layersSettings[0].getVisibleText()).to.be('Area stacked');
});
});
it('should convert percentage charts', async () => {
await visEditor.clickMetricsAndAxes();
await visEditor.toggleAccordion('visEditorSeriesAccordion1');
await visEditor.setSeriesType(0, 'area');
await visEditor.selectChartMode('normal');
await visEditor.clickYAxisOptions('ValueAxis-1');
await visEditor.selectYAxisMode('percentage');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
await retry.try(async () => {
expect(await lens.getLayerCount()).to.be(1);
const layersSettings = await testSubjects.findAll('lns_layer_settings');
expect(layersSettings.length).to.be(1);
expect(await layersSettings[0].getVisibleText()).to.be('Area percentage');
});
});
it('should convert horizontal bar', async () => {
await visEditor.clickMetricsAndAxes();
await visEditor.toggleAccordion('visEditorSeriesAccordion1');
await visEditor.setSeriesType(0, 'histogram');
await visEditor.clickYAxisOptions('ValueAxis-1');
await visEditor.selectYAxisPosition('ValueAxis-1', 'top');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
await retry.try(async () => {
expect(await lens.getLayerCount()).to.be(1);
const layersSettings = await testSubjects.findAll('lns_layer_settings');
expect(layersSettings.length).to.be(1);
expect(await layersSettings[0].getVisibleText()).to.be('Bar horizontal');
});
});
it('should convert y-axis positions', async () => {
await visEditor.clickBucket('Y-axis', 'metrics');
await visEditor.selectAggregation('Max', 'metrics');
await visEditor.selectField('memory', 'metrics');
await visEditor.clickMetricsAndAxes();
await visEditor.clickAddAxis();
await visEditor.toggleAccordion('visEditorSeriesAccordion2');
await visEditor.setSeriesAxis(1, 'ValueAxis-2');
await visEditor.clickYAxisOptions('ValueAxis-1');
await visEditor.selectYAxisPosition('ValueAxis-1', 'left');
await visEditor.clickYAxisOptions('ValueAxis-2');
await visEditor.selectYAxisPosition('ValueAxis-2', 'right');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
expect(await lens.getLayerCount()).to.be(1);
const yDimensionText1 = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
const yDimensionText2 = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 1);
expect(yDimensionText1).to.be('Count');
expect(yDimensionText2).to.be('Max memory');
await lens.openDimensionEditor('lnsXY_yDimensionPanel > lns-dimensionTrigger');
let axisPosition = await lens.getSelectedAxisSide();
expect(axisPosition).to.be('Left');
await lens.closeDimensionEditor();
await lens.openDimensionEditor('lnsXY_yDimensionPanel > lns-dimensionTrigger', 0, 1);
axisPosition = await lens.getSelectedAxisSide();
expect(axisPosition).to.be('Right');
});
it('should convert split series', async () => {
await visEditor.clickBucket('Split series');
await visEditor.selectAggregation('Terms');
await visEditor.selectField('machine.os.raw');
@ -59,10 +326,32 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
await lens.waitForVisualization('xyVisChart');
const data = await lens.getCurrentChartDebugState('xyVisChart');
await retry.try(async () => {
const dimensions = await testSubjects.findAll('lns-dimensionTrigger');
expect(dimensions).to.have.length(2);
expect(await dimensions[0].getVisibleText()).to.be('Count');
expect(await dimensions[1].getVisibleText()).to.be('machine.os.raw: Descending');
const yDimensionText = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
expect(yDimensionText).to.be('Count');
const splitDimensionText = await lens.getDimensionTriggerText(
'lnsXY_splitDimensionPanel',
0
);
expect(splitDimensionText).to.be('machine.os.raw: Descending');
});
expect(data?.legend?.items.map((item) => item.name)).to.eql(expectedData);
});
it('should convert x-axis', async () => {
await visEditor.clickBucket('X-axis');
await visEditor.selectAggregation('Terms');
await visEditor.selectField('machine.os.raw');
await visEditor.clickGo(isNewChartsLibraryEnabled);
await header.waitUntilLoadingHasFinished();
const expectedData = await visChart.getLegendEntriesXYCharts('xyVisChart');
await visualize.navigateToLensFromAnotherVisulization();
await lens.waitForVisualization('xyVisChart');
const data = await lens.getCurrentChartDebugState('xyVisChart');
await retry.try(async () => {
const yDimensionText = await lens.getDimensionTriggerText('lnsXY_yDimensionPanel', 0);
expect(yDimensionText).to.be('Count');
const xDimensionText = await lens.getDimensionTriggerText('lnsXY_xDimensionPanel', 0);
expect(xDimensionText).to.be('machine.os.raw: Descending');
});
expect(data?.legend?.items.map((item) => item.name)).to.eql(expectedData);
});

13
x-pack/test/functional/page_objects/lens_page.ts
View file

@ -799,6 +799,19 @@ export function LensPageProvider({ getService, getPageObjects }: FtrProviderCont
await testSubjects.click(`lnsXY_axisSide_groups_${newSide}`);
},
async getSelectedAxisSide() {
const axisSideGroups = await find.allByCssSelector(
`[data-test-subj^="lnsXY_axisSide_groups_"]`
);
for (const axisSideGroup of axisSideGroups) {
const input = await axisSideGroup.findByTagName('input');
const isSelected = await input.isSelected();
if (isSelected) {
return axisSideGroup?.getVisibleText();
}
}
},
/** Counts the visible warnings in the config panel */
async getErrorCount() {
const moreButton = await testSubjects.exists('configuration-failure-more-errors');