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

[Lens] metric visualization functional tests (#137731)

Browse source
This commit is contained in:
Andrew Tate 2022-08-08 10:42:07 -05:00 • committed by GitHub
parent 0fa750d2f5
commit c9f160b4db
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 305 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

38
x-pack/plugins/lens/public/visualizations/legacy_metric/dimension_editor.test.tsx
View file

@ -100,12 +100,12 @@ describe('metric dimension editor', () => {
it('should not show the dynamic coloring option for non numeric columns', () => {
const instance = mountWithIntl(<MetricDimensionEditor {...props} />);
expect(instance.find('[data-test-subj="lnsMetric_dynamicColoring_groups"]').exists()).toBe(
false
);
expect(instance.find('[data-test-subj="lnsMetric_dynamicColoring_palette"]').exists()).toBe(
false
);
expect(
instance.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_groups"]').exists()
).toBe(false);
expect(
instance.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_palette"]').exists()
).toBe(false);
});
it('should set the dynamic coloring default to "none"', () => {
@ -113,14 +113,14 @@ describe('metric dimension editor', () => {
const instance = mountWithIntl(<MetricDimensionEditor {...props} />);
expect(
instance
.find('[data-test-subj="lnsMetric_dynamicColoring_groups"]')
.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_groups"]')
.find(EuiButtonGroup)
.prop('idSelected')
).toEqual(expect.stringContaining(ColorMode.None));
expect(instance.find('[data-test-subj="lnsMetric_dynamicColoring_palette"]').exists()).toBe(
false
);
expect(
instance.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_palette"]').exists()
).toBe(false);
});
it('should show the dynamic palette display ony when colorMode is different from "none"', () => {
@ -129,14 +129,14 @@ describe('metric dimension editor', () => {
const instance = mountWithIntl(<MetricDimensionEditor {...props} />);
expect(
instance
.find('[data-test-subj="lnsMetric_dynamicColoring_groups"]')
.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_groups"]')
.find(EuiButtonGroup)
.prop('idSelected')
).toEqual(expect.stringContaining(ColorMode.Labels));
expect(instance.find('[data-test-subj="lnsMetric_dynamicColoring_palette"]').exists()).toBe(
true
);
expect(
instance.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_palette"]').exists()
).toBe(true);
});
it('should prefill the palette stops with some colors when enabling coloring', () => {
@ -145,7 +145,7 @@ describe('metric dimension editor', () => {
act(() => {
instance
.find('[data-test-subj="lnsMetric_dynamicColoring_groups"]')
.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_groups"]')
.find(EuiButtonGroup)
.prop('onChange')!(ColorMode.Labels);
});
@ -165,7 +165,7 @@ describe('metric dimension editor', () => {
act(() => {
instance
.find('[data-test-subj="lnsMetric_dynamicColoring_trigger"]')
.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_trigger"]')
.first()
.simulate('click');
});
@ -182,7 +182,7 @@ describe('metric dimension editor', () => {
act(() => {
instance
.find('[data-test-subj="lnsMetric_dynamicColoring_trigger"]')
.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_trigger"]')
.first()
.simulate('click');
});
@ -199,7 +199,7 @@ describe('metric dimension editor', () => {
act(() => {
instance
.find('[data-test-subj="lnsMetric_dynamicColoring_trigger"]')
.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_trigger"]')
.first()
.simulate('click');
});
@ -217,7 +217,7 @@ describe('metric dimension editor', () => {
act(() => {
instance
.find('[data-test-subj="lnsMetric_dynamicColoring_groups"]')
.find('[data-test-subj="lnsLegacyMetric_dynamicColoring_groups"]')
.find(EuiButtonGroup)
.prop('onChange')!(ColorMode.Background);
});

12
x-pack/plugins/lens/public/visualizations/legacy_metric/dimension_editor.tsx
View file

@ -88,7 +88,7 @@ export function MetricDimensionEditor(
legend={i18n.translate('xpack.lens.legacyMetric.dynamicColoring.label', {
defaultMessage: 'Color by value',
})}
data-test-subj="lnsMetric_dynamicColoring_groups"
data-test-subj="lnsLegacyMetric_dynamicColoring_groups"
name="dynamicColoring"
buttonSize="compressed"
options={[
@ -97,21 +97,21 @@ export function MetricDimensionEditor(
label: i18n.translate('xpack.lens.legacyMetric.dynamicColoring.none', {
defaultMessage: 'None',
}),
'data-test-subj': 'lnsMetric_dynamicColoring_groups_none',
'data-test-subj': 'lnsLegacyMetric_dynamicColoring_groups_none',
},
{
id: `${idPrefix}Background`,
label: i18n.translate('xpack.lens.legacyMetric.dynamicColoring.background', {
defaultMessage: 'Fill',
}),
'data-test-subj': 'lnsMetric_dynamicColoring_groups_background',
'data-test-subj': 'lnsLegacyMetric_dynamicColoring_groups_background',
},
{
id: `${idPrefix}Labels`,
label: i18n.translate('xpack.lens.legacyMetric.dynamicColoring.text', {
defaultMessage: 'Text',
}),
'data-test-subj': 'lnsMetric_dynamicColoring_groups_labels',
'data-test-subj': 'lnsLegacyMetric_dynamicColoring_groups_labels',
},
]}
idSelected={`${idPrefix}${currentColorMode}`}
@ -163,7 +163,7 @@ export function MetricDimensionEditor(
>
<EuiFlexItem>
<EuiColorPaletteDisplay
data-test-subj="lnsMetric_dynamicColoring_palette"
data-test-subj="lnsLegacyMetric_dynamicColoring_palette"
palette={displayStops.map(({ color }) => color)}
type={FIXED_PROGRESSION}
onClick={togglePalette}
@ -171,7 +171,7 @@ export function MetricDimensionEditor(
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiButtonEmpty
data-test-subj="lnsMetric_dynamicColoring_trigger"
data-test-subj="lnsLegacyMetric_dynamicColoring_trigger"
iconType="controlsHorizontal"
onClick={togglePalette}
size="xs"

2
x-pack/plugins/lens/public/visualizations/legacy_metric/metric_config_panel/appearance_options_popover.tsx
View file

@ -36,7 +36,7 @@ export const AppearanceOptionsPopover: React.FC<VisualOptionsPopoverProps> = ({
})}
type="visualOptions"
groupPosition="none"
buttonDataTestSubj="lnsMetricAppearanceButton"
buttonDataTestSubj="lnsLegacyMetricAppearanceButton"
>
<TextFormattingOptions state={state} setState={setState} />
<TitlePositionOptions state={state} setState={setState} />

2
x-pack/plugins/lens/public/visualizations/legacy_metric/metric_config_panel/size_options.tsx
View file

@ -81,7 +81,7 @@ export const SizeOptions: React.FC<TitlePositionProps> = ({ state, setState }) =
isDisabled={currSizeIndex === 0}
/>
}
data-test-subj="lnsMetricSizeSelect"
data-test-subj="lnsLegacyMetricSizeSelect"
compressed
options={titleSizes.map((position) => {
return {

4
x-pack/plugins/lens/public/visualizations/metric/__snapshots__/visualization.test.ts.snap generated
View file

@ -11,6 +11,7 @@ Object {
"triggerIcon": "colorBy",
},
],
"dataTestSubj": "lnsMetric_primaryMetricDimensionPanel",
"enableDimensionEditor": true,
"filterOperations": [Function],
"groupId": "metric",
@ -29,6 +30,7 @@ Object {
"columnId": "secondary-metric-col-id",
},
],
"dataTestSubj": "lnsMetric_secondaryMetricDimensionPanel",
"enableDimensionEditor": true,
"filterOperations": [Function],
"groupId": "secondaryMetric",
@ -47,6 +49,7 @@ Object {
"columnId": "max-metric-col-id",
},
],
"dataTestSubj": "lnsMetric_maxDimensionPanel",
"enableDimensionEditor": true,
"filterOperations": [Function],
"groupId": "max",
@ -68,6 +71,7 @@ Object {
"triggerIcon": "aggregate",
},
],
"dataTestSubj": "lnsMetric_breakdownByDimensionPanel",
"enableDimensionEditor": true,
"filterOperations": [Function],
"groupId": "breakdownBy",

1
x-pack/plugins/lens/public/visualizations/metric/dimension_editor.tsx
View file

@ -389,7 +389,6 @@ function StaticColorControls({ state, setState }: Pick<Props, 'state' | 'setStat
<EuiFormRow display="columnCompressed" fullWidth label={colorLabel}>
<EuiColorPicker
fullWidth
data-test-subj="lnsMetric_colorpicker"
compressed
isClearable={false}
onChange={(color: string) => handleColorChange(color)}

4
x-pack/plugins/lens/public/visualizations/metric/visualization.tsx
View file

@ -248,6 +248,7 @@ export const getMetricVisualization = ({
groups: [
{
groupId: GROUP_ID.METRIC,
dataTestSubj: 'lnsMetric_primaryMetricDimensionPanel',
groupLabel: i18n.translate('xpack.lens.primaryMetric.label', {
defaultMessage: 'Primary metric',
}),
@ -273,6 +274,7 @@ export const getMetricVisualization = ({
},
{
groupId: GROUP_ID.SECONDARY_METRIC,
dataTestSubj: 'lnsMetric_secondaryMetricDimensionPanel',
groupLabel: i18n.translate('xpack.lens.metric.secondaryMetric', {
defaultMessage: 'Secondary metric',
}),
@ -297,6 +299,7 @@ export const getMetricVisualization = ({
},
{
groupId: GROUP_ID.MAX,
dataTestSubj: 'lnsMetric_maxDimensionPanel',
groupLabel: i18n.translate('xpack.lens.metric.max', { defaultMessage: 'Maximum value' }),
paramEditorCustomProps: {
headingLabel: i18n.translate('xpack.lens.primaryMetric.headingLabel', {
@ -324,6 +327,7 @@ export const getMetricVisualization = ({
},
{
groupId: GROUP_ID.BREAKDOWN_BY,
dataTestSubj: 'lnsMetric_breakdownByDimensionPanel',
groupLabel: i18n.translate('xpack.lens.metric.breakdownBy', {
defaultMessage: 'Break down by',
}),

2
x-pack/test/functional/apps/canvas/embeddables/lens.ts
View file

@ -44,7 +44,7 @@ export default function canvasLensTest({ getService, getPageObjects }: FtrProvid
it('renders lens visualization using savedLens expression', async () => {
await PageObjects.header.waitUntilLoadingHasFinished();
await PageObjects.lens.assertMetric('Maximum of bytes', '16,788');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '16,788');
});
it('adds existing lens embeddable from the visualize library', async () => {

4
x-pack/test/functional/apps/dashboard/group1/feature_controls/time_to_visualize_security.ts
View file

@ -131,7 +131,7 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
await PageObjects.lens.switchToVisualization('lnsMetric');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
await PageObjects.header.waitUntilLoadingHasFinished();
await testSubjects.click('lnsApp_saveButton');
@ -147,7 +147,7 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'New Lens from Modal'
);

4
x-pack/test/functional/apps/lens/group1/persistent_context.ts
View file

@ -102,7 +102,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
expect(query).to.equal('');
});
it('filters, time and query reflect the visualization state', async () => {
await PageObjects.lens.assertMetric('Unique count of @timestamp', '14,181');
await PageObjects.lens.assertLegacyMetric('Unique count of @timestamp', '14,181');
});
});
});
@ -130,7 +130,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
expect(filterCount).to.equal(0);
const query = await queryBar.getQueryString();
expect(query).to.equal('');
await PageObjects.lens.assertMetric('Unique count of @timestamp', '14,181');
await PageObjects.lens.assertLegacyMetric('Unique count of @timestamp', '14,181');
});
it('when moving from empty to existing workspace, preserves time range and loads filters and query', async () => {
// go to existing vis

4
x-pack/test/functional/apps/lens/group1/smokescreen.ts
View file

@ -95,12 +95,12 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await listingTable.searchForItemWithName('Artistpreviouslyknownaslens');
await PageObjects.lens.clickVisualizeListItemTitle('Artistpreviouslyknownaslens');
await PageObjects.lens.goToTimeRange();
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
await PageObjects.lens.switchToVisualization('lnsDatatable');
expect(await PageObjects.lens.getDatatableHeaderText()).to.eql('Maximum of bytes');
expect(await PageObjects.lens.getDatatableCellText(0, 0)).to.eql('19,986');
await PageObjects.lens.switchToVisualization('lnsMetric');
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
});
it('should transition from a multi-layer stacked bar to a multi-layer line chart and correctly remove all layers', async () => {

24
x-pack/test/functional/apps/lens/group2/add_to_dashboard.ts
View file

@ -37,7 +37,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.lens.switchToVisualization('lnsMetric');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
};
const createAndSaveDashboard = async (dashboardName: string) => {
@ -60,7 +60,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.lens.clickVisualizeListItemTitle('Artistpreviouslyknownaslens');
await PageObjects.lens.goToTimeRange();
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
};
describe('lens add-to-dashboards tests', () => {
@ -70,7 +70,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'New Lens from Modal'
);
@ -88,7 +88,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'Artistpreviouslyknownaslens Copy'
);
@ -115,7 +115,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'New Lens from Modal'
);
@ -140,7 +140,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'Artistpreviouslyknownaslens Copy'
);
@ -156,7 +156,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'New by ref Lens from Modal'
);
@ -174,7 +174,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'Artistpreviouslyknownaslens by ref'
);
@ -201,7 +201,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'New Lens by ref from Modal'
);
@ -226,7 +226,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.dashboard.waitForRenderComplete();
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
const isLinked = await PageObjects.timeToVisualize.libraryNotificationExists(
'Artistpreviouslyknownaslens by ref 2'
);
@ -304,7 +304,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.lens.switchToVisualization('lnsMetric');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await testSubjects.click('lnsApp_saveButton');
@ -350,7 +350,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await PageObjects.lens.switchToVisualization('lnsMetric');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await testSubjects.click('lnsApp_saveButton');

2
x-pack/test/functional/apps/lens/group2/dashboard.ts
View file

@ -58,7 +58,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await find.clickByButtonText('Artistpreviouslyknownaslens');
await dashboardAddPanel.closeAddPanel();
await PageObjects.lens.goToTimeRange();
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
});
it('should be able to add filters/timerange by clicking in XYChart', async () => {

2
x-pack/test/functional/apps/lens/group3/chart_data.ts
View file

@ -145,7 +145,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
it('should render metric', async () => {
await PageObjects.lens.switchToVisualization('lnsMetric');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Average of bytes', '5,727.322');
await PageObjects.lens.assertLegacyMetric('Average of bytes', '5,727.322');
});
});
}

5
x-pack/test/functional/apps/lens/group3/index.ts
View file

@ -37,7 +37,7 @@ export default ({ getService, loadTestFile, getPageObjects }: FtrProviderContext
};
let indexPatternString: string;
before(async () => {
await log.debug('Starting lens before method');
log.debug('Starting lens before method');
await browser.setWindowSize(1280, 1200);
try {
config.get('esTestCluster.ccs');
@ -78,7 +78,8 @@ export default ({ getService, loadTestFile, getPageObjects }: FtrProviderContext
loadTestFile(require.resolve('./formula'));
loadTestFile(require.resolve('./heatmap'));
loadTestFile(require.resolve('./gauge'));
loadTestFile(require.resolve('./metrics'));
loadTestFile(require.resolve('./metric'));
loadTestFile(require.resolve('./legacy_metric'));
loadTestFile(require.resolve('./reference_lines'));
loadTestFile(require.resolve('./annotations'));
loadTestFile(require.resolve('./inspector'));

18
x-pack/test/functional/apps/lens/group3/metrics.ts → x-pack/test/functional/apps/lens/group3/legacy_metric.ts
View file

@ -15,20 +15,20 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
const filterBar = getService('filterBar');
const testSubjects = getService('testSubjects');
describe('lens metrics', () => {
describe('lens legacy metric', () => {
it('should render a numeric metric', async () => {
await PageObjects.visualize.gotoVisualizationLandingPage();
await listingTable.searchForItemWithName('Artistpreviouslyknownaslens');
await PageObjects.lens.clickVisualizeListItemTitle('Artistpreviouslyknownaslens');
await PageObjects.lens.goToTimeRange();
await PageObjects.lens.assertMetric('Maximum of bytes', '19,986');
await PageObjects.lens.assertLegacyMetric('Maximum of bytes', '19,986');
});
it('should allow to filter metric', async () => {
let filterCount = 0;
await retry.try(async function tryingForTime() {
// click first metric bucket
await PageObjects.lens.clickMetric();
await PageObjects.lens.clickLegacyMetric();
filterCount = await filterBar.getFilterCount();
await filterBar.removeAllFilters();
expect(filterCount).to.equal(1);
@ -37,35 +37,35 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
it('should color the metric text based on value', async () => {
await PageObjects.lens.openDimensionEditor('lns-dimensionTrigger');
await PageObjects.lens.setMetricDynamicColoring('labels');
await PageObjects.lens.setLegacyMetricDynamicColoring('labels');
await PageObjects.header.waitUntilLoadingHasFinished();
const styleObj = await PageObjects.lens.getMetricStyle();
const styleObj = await PageObjects.lens.getLegacyMetricStyle();
expect(styleObj['background-color']).to.be(undefined);
expect(styleObj.color).to.be('rgb(214, 191, 87)');
});
it('should change the color of the metric when tweaking the values in the panel', async () => {
await PageObjects.lens.openPalettePanel('lnsMetric');
await PageObjects.lens.openPalettePanel('lnsLegacyMetric');
await PageObjects.header.waitUntilLoadingHasFinished();
await testSubjects.setValue('lnsPalettePanel_dynamicColoring_range_value_1', '21000', {
clearWithKeyboard: true,
});
await PageObjects.lens.waitForVisualization('legacyMtrVis');
const styleObj = await PageObjects.lens.getMetricStyle();
const styleObj = await PageObjects.lens.getLegacyMetricStyle();
expect(styleObj.color).to.be('rgb(32, 146, 128)');
});
it('should change the color when reverting the palette', async () => {
await testSubjects.click('lnsPalettePanel_dynamicColoring_reverseColors');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
const styleObj = await PageObjects.lens.getMetricStyle();
const styleObj = await PageObjects.lens.getLegacyMetricStyle();
expect(styleObj.color).to.be('rgb(204, 86, 66)');
});
it('should reset the color stops when changing palette to a predefined one', async () => {
await PageObjects.lens.changePaletteTo('temperature');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
const styleObj = await PageObjects.lens.getMetricStyle();
const styleObj = await PageObjects.lens.getLegacyMetricStyle();
expect(styleObj.color).to.be('rgb(235, 239, 245)');
});
});

225
x-pack/test/functional/apps/lens/group3/metric.ts Normal file
View file

@ -0,0 +1,225 @@
/*
* 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; you may not use this file except in compliance with the Elastic License
* 2.0.
*/
import expect from '@kbn/expect';
import { WebElementWrapper } from '../../../../../../test/functional/services/lib/web_element_wrapper';
import { FtrProviderContext } from '../../../ftr_provider_context';
export default function ({ getService, getPageObjects }: FtrProviderContext) {
const PageObjects = getPageObjects(['visualize', 'lens', 'common', 'header']);
const findService = getService('find');
const testSubjects = getService('testSubjects');
const filterBar = getService('filterBar');
const retry = getService('retry');
const getMetricTiles = () =>
findService.allByCssSelector('[data-test-subj="mtrVis"] .echChart li');
const getIfExists = async (selector: string, container: WebElementWrapper) =>
(await findService.descendantExistsByCssSelector(selector, container))
? await container.findByCssSelector(selector)
: undefined;
const getMetricDatum = async (tile: WebElementWrapper) => {
return {
title: await (await getIfExists('h2', tile))?.getVisibleText(),
subtitle: await (await getIfExists('.echMetricText__subtitle', tile))?.getVisibleText(),
extraText: await (await getIfExists('.echMetricText__extra', tile))?.getVisibleText(),
value: await (await getIfExists('.echMetricText__value', tile))?.getVisibleText(),
color: await (await getIfExists('.echMetric', tile))?.getComputedStyle('background-color'),
};
};
const getMetricData = async () => {
const tiles = await getMetricTiles();
const showingBar = Boolean(await findService.existsByCssSelector('.echSingleMetricProgress'));
const metricData = [];
for (const tile of tiles) {
metricData.push({
...(await getMetricDatum(tile)),
showingBar,
});
}
return metricData;
};
const clickMetric = async (title: string) => {
const tiles = await getMetricTiles();
for (const tile of tiles) {
const datum = await getMetricDatum(tile);
if (datum.title === title) {
await tile.click();
return;
}
}
};
describe('lens metric', () => {
it('should render a metric', async () => {
await PageObjects.visualize.navigateToNewVisualization();
await PageObjects.visualize.clickVisType('lens');
await PageObjects.lens.goToTimeRange();
await PageObjects.lens.switchToVisualization('lnsMetricNew', 'Metric');
await PageObjects.lens.configureDimension({
dimension: 'lnsMetric_primaryMetricDimensionPanel > lns-empty-dimension',
operation: 'average',
field: 'bytes',
});
await PageObjects.lens.configureDimension({
dimension: 'lnsMetric_secondaryMetricDimensionPanel > lns-empty-dimension',
operation: 'average',
field: 'bytes',
});
expect((await getMetricData()).length).to.be.equal(1);
await PageObjects.lens.configureDimension({
dimension: 'lnsMetric_breakdownByDimensionPanel > lns-empty-dimension',
operation: 'terms',
field: 'ip',
});
await PageObjects.lens.waitForVisualization('mtrVis');
expect(await getMetricData()).to.eql([
{
title: '97.220.3.248',
subtitle: 'Average of bytes',
extraText: '19.76K',
value: '19.76K',
color: 'rgba(245, 247, 250, 1)',
showingBar: false,
},
{
title: '169.228.188.120',
subtitle: 'Average of bytes',
extraText: '18.99K',
value: '18.99K',
color: 'rgba(245, 247, 250, 1)',
showingBar: false,
},
{
title: '78.83.247.30',
subtitle: 'Average of bytes',
extraText: '17.25K',
value: '17.25K',
color: 'rgba(245, 247, 250, 1)',
showingBar: false,
},
{
title: '226.82.228.233',
subtitle: 'Average of bytes',
extraText: '15.69K',
value: '15.69K',
color: 'rgba(245, 247, 250, 1)',
showingBar: false,
},
{
title: '93.28.27.24',
subtitle: 'Average of bytes',
extraText: '15.61K',
value: '15.61K',
color: 'rgba(245, 247, 250, 1)',
showingBar: false,
},
{
title: 'Other',
subtitle: 'Average of bytes',
extraText: '5.72K',
value: '5.72K',
color: 'rgba(245, 247, 250, 1)',
showingBar: false,
},
]);
await PageObjects.lens.openDimensionEditor(
'lnsMetric_maxDimensionPanel > lns-empty-dimension'
);
await PageObjects.lens.waitForVisualization('mtrVis');
expect((await getMetricData())[0].showingBar).to.be(true);
await PageObjects.lens.closeDimensionEditor();
await PageObjects.lens.removeDimension('lnsMetric_maxDimensionPanel');
});
it('should filter by click', async () => {
expect((await filterBar.getFiltersLabel()).length).to.be(0);
const title = '93.28.27.24';
await clickMetric(title);
retry.try(async () => {
const labels = await filterBar.getFiltersLabel();
expect(labels.length).to.be(1);
expect(labels[0]).to.be(`ip: ${title}`);
});
await filterBar.removeAllFilters();
await PageObjects.lens.waitForVisualization('mtrVis');
});
it('applies static color', async () => {
await PageObjects.lens.openDimensionEditor(
'lnsMetric_primaryMetricDimensionPanel > lns-dimensionTrigger'
);
const colorPicker = await testSubjects.find('euiColorPickerAnchor');
await colorPicker.type('#000000');
await PageObjects.lens.waitForVisualization('mtrVis');
const data = await getMetricData();
expect(data.map(({ color }) => color)).to.be.eql(new Array(6).fill('rgba(0, 0, 0, 1)'));
});
const expectedDynamicColors = [
'rgba(204, 86, 66, 1)',
'rgba(204, 86, 66, 1)',
'rgba(204, 86, 66, 1)',
'rgba(204, 86, 66, 1)',
'rgba(204, 86, 66, 1)',
'rgba(32, 146, 128, 1)',
];
it('applies dynamic color', async () => {
await testSubjects.click('lnsMetric_color_mode_dynamic');
await PageObjects.lens.waitForVisualization('mtrVis');
const data = await getMetricData();
expect(data.map(({ color }) => color)).to.eql(expectedDynamicColors);
});
it('converts color stops to number', async () => {
await PageObjects.lens.openPalettePanel('lnsMetric');
await testSubjects.click('lnsPalettePanel_dynamicColoring_rangeType_groups_number');
expect([
await testSubjects.getAttribute('lnsPalettePanel_dynamicColoring_range_value_1', 'value'),
await testSubjects.getAttribute('lnsPalettePanel_dynamicColoring_range_value_2', 'value'),
]).to.be.eql(['10400.18', '15077.59']);
await PageObjects.lens.waitForVisualization('mtrVis');
expect((await getMetricData()).map(({ color }) => color)).to.eql(expectedDynamicColors); // colors shouldn't change
});
it("doesn't error with empty formula", async () => {
await PageObjects.lens.closePaletteEditor();
await PageObjects.lens.switchToFormula();
await PageObjects.lens.typeFormula('');
await PageObjects.lens.waitForVisualization('mtrVis');
});
});
}

6
x-pack/test/functional/apps/lens/group3/rollup.ts
View file

@ -73,7 +73,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
it('should allow seamless transition to and from table view', async () => {
await PageObjects.lens.switchToVisualization('lnsMetric');
await PageObjects.lens.assertMetric('Sum of bytes', '16,788');
await PageObjects.lens.assertLegacyMetric('Sum of bytes', '16,788');
await PageObjects.lens.switchToVisualization('lnsDatatable');
expect(await PageObjects.lens.getDatatableHeaderText()).to.eql('Sum of bytes');
expect(await PageObjects.lens.getDatatableCellText(0, 0)).to.eql('16,788');
@ -92,12 +92,12 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
});
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Sum of bytes', '16,788');
await PageObjects.lens.assertLegacyMetric('Sum of bytes', '16,788');
await PageObjects.lens.switchFirstLayerIndexPattern('lens_rolled_up_data');
await PageObjects.lens.waitForVisualization('legacyMtrVis');
await PageObjects.lens.assertMetric('Sum of bytes', '16,788');
await PageObjects.lens.assertLegacyMetric('Sum of bytes', '16,788');
});
});
}

8
x-pack/test/functional/apps/maps/group2/embeddable/filter_by_map_extent.js
View file

@ -30,7 +30,7 @@ export default function ({ getPageObjects, getService }) {
});
it('should not filter dashboard by map extent before "filter by map extent" is enabled', async () => {
await PageObjects.lens.assertMetric('Count of records', '6');
await PageObjects.lens.assertLegacyMetric('Count of records', '6');
});
it('should filter dashboard by map extent when "filter by map extent" is enabled', async () => {
@ -44,13 +44,13 @@ export default function ({ getPageObjects, getService }) {
await browser.pressKeys(browser.keys.ESCAPE);
await PageObjects.header.waitUntilLoadingHasFinished();
await PageObjects.lens.assertMetric('Count of records', '1');
await PageObjects.lens.assertLegacyMetric('Count of records', '1');
});
it('should filter dashboard by new map extent when map is moved', async () => {
await PageObjects.maps.setView(32.95539, -93.93054, 5);
await PageObjects.header.waitUntilLoadingHasFinished();
await PageObjects.lens.assertMetric('Count of records', '2');
await PageObjects.lens.assertLegacyMetric('Count of records', '2');
});
it('should remove map extent filter dashboard when "filter by map extent" is disabled', async () => {
@ -63,7 +63,7 @@ export default function ({ getPageObjects, getService }) {
);
await browser.pressKeys(browser.keys.ESCAPE);
await PageObjects.header.waitUntilLoadingHasFinished();
await PageObjects.lens.assertMetric('Count of records', '6');
await PageObjects.lens.assertLegacyMetric('Count of records', '6');
});
});
}

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

@ -1079,20 +1079,20 @@ export function LensPageProvider({ getService, getPageObjects }: FtrProviderCont
* @param title - expected title
* @param count - expected count of metric
*/
async assertMetric(title: string, count: string) {
async assertLegacyMetric(title: string, count: string) {
await this.assertExactText('[data-test-subj="metric_label"]', title);
await this.assertExactText('[data-test-subj="metric_value"]', count);
},
async clickMetric() {
async clickLegacyMetric() {
await testSubjects.click('metric_label');
},
async setMetricDynamicColoring(coloringType: 'none' | 'labels' | 'background') {
await testSubjects.click('lnsMetric_dynamicColoring_groups_' + coloringType);
async setLegacyMetricDynamicColoring(coloringType: 'none' | 'labels' | 'background') {
await testSubjects.click('lnsLegacyMetric_dynamicColoring_groups_' + coloringType);
},
async getMetricStyle() {
async getLegacyMetricStyle() {
const el = await testSubjects.find('metric_value');
const styleString = await el.getAttribute('style');
return styleString.split(';').reduce<Record<string, string>>((memo, cssLine) => {