Skip to content

Commit

Permalink
Added percentile refernce lines
Browse files Browse the repository at this point in the history
  • Loading branch information
shahzad31 committed Oct 19, 2021
1 parent 92e1cd2 commit 6f48dbe
Show file tree
Hide file tree
Showing 8 changed files with 748 additions and 229 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
import { buildExistsFilter, buildPhrasesFilter } from './utils';
import { sampleAttributeKpi } from './test_data/sample_attribute_kpi';
import { RECORDS_FIELD, REPORT_METRIC_FIELD, PERCENTILE_RANKS, ReportTypes } from './constants';
import { sampleAttributeWithReferenceLines } from './test_data/sample_attribute_with_reference_lines';

describe('Lens Attribute', () => {
mockAppIndexPattern();
Expand Down Expand Up @@ -113,6 +114,7 @@ describe('Lens Attribute', () => {
},
...PERCENTILE_RANKS.reduce((acc: Record<string, any>, rank, index) => {
acc[`y-axis-column-${index === 0 ? 'layer' + index : index}`] = {
customLabel: true,
dataType: 'number',
filter: {
language: 'kuery',
Expand All @@ -134,6 +136,7 @@ describe('Lens Attribute', () => {

it('should return main y axis', function () {
expect(lnsAttr.getMainYAxis(layerConfig, 'layer0', '')).toEqual({
customLabel: true,
dataType: 'number',
isBucketed: false,
label: 'Pages loaded',
Expand All @@ -148,7 +151,7 @@ describe('Lens Attribute', () => {
formula: 'count() / overall_sum(count())',
isFormulaBroken: false,
},
references: ['y-axis-column-layer0X4'],
references: ['y-axis-column-layer0X3'],
scale: 'ratio',
});
});
Expand Down Expand Up @@ -186,6 +189,7 @@ describe('Lens Attribute', () => {
},
fieldName: 'transaction.duration.us',
columnLabel: 'Page load time',
showPercentileAnnotations: true,
})
);
});
Expand Down Expand Up @@ -219,6 +223,7 @@ describe('Lens Attribute', () => {
},
fieldName: TRANSACTION_DURATION,
columnLabel: 'Page load time',
showPercentileAnnotations: true,
})
);
});
Expand Down Expand Up @@ -322,135 +327,7 @@ describe('Lens Attribute', () => {
});

it('should return first layer', function () {
expect(lnsAttr.getLayers()).toEqual({
layer0: {
columnOrder: [
'x-axis-column-layer0',
'y-axis-column-layer0',
'y-axis-column-layer0X0',
'y-axis-column-layer0X1',
'y-axis-column-layer0X2',
'y-axis-column-layer0X3',
'y-axis-column-layer0X4',
],
columns: {
'x-axis-column-layer0': {
dataType: 'number',
isBucketed: true,
label: 'Page load time',
operationType: 'range',
params: {
maxBars: 'auto',
ranges: [
{
from: 0,
label: '',
to: 1000,
},
],
type: 'histogram',
},
scale: 'interval',
sourceField: 'transaction.duration.us',
},
'y-axis-column-layer0': {
dataType: 'number',
filter: {
language: 'kuery',
query:
'transaction.type: page-load and processor.event: transaction and transaction.type : *',
},
isBucketed: false,
label: 'Pages loaded',
operationType: 'formula',
params: {
format: {
id: 'percent',
params: {
decimals: 0,
},
},
formula:
"count(kql='transaction.type: page-load and processor.event: transaction and transaction.type : *') / overall_sum(count(kql='transaction.type: page-load and processor.event: transaction and transaction.type : *'))",
isFormulaBroken: false,
},
references: ['y-axis-column-layer0X4'],
scale: 'ratio',
},
'y-axis-column-layer0X0': {
customLabel: true,
dataType: 'number',
filter: {
language: 'kuery',
query:
'transaction.type: page-load and processor.event: transaction and transaction.type : *',
},
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'count',
scale: 'ratio',
sourceField: 'Records',
},
'y-axis-column-layer0X1': {
customLabel: true,
dataType: 'number',
filter: {
language: 'kuery',
query:
'transaction.type: page-load and processor.event: transaction and transaction.type : *',
},
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'count',
scale: 'ratio',
sourceField: 'Records',
},
'y-axis-column-layer0X2': {
customLabel: true,
dataType: 'number',
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'math',
params: {
tinymathAst: 'y-axis-column-layer0X1',
},
references: ['y-axis-column-layer0X1'],
scale: 'ratio',
},
'y-axis-column-layer0X3': {
customLabel: true,
dataType: 'number',
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'overall_sum',
references: ['y-axis-column-layer0X2'],
scale: 'ratio',
},
'y-axis-column-layer0X4': {
customLabel: true,
dataType: 'number',
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'math',
params: {
tinymathAst: {
args: ['y-axis-column-layer0X0', 'y-axis-column-layer0X3'],
location: {
max: 30,
min: 0,
},
name: 'divide',
text: "count(kql='transaction.type: page-load and processor.event: transaction and transaction.type : *') / overall_sum(count(kql='transaction.type: page-load and processor.event: transaction and transaction.type : *'))",
type: 'function',
},
},
references: ['y-axis-column-layer0X0', 'y-axis-column-layer0X3'],
scale: 'ratio',
},
},
incompleteColumns: {},
},
});
expect(lnsAttr.getLayers()).toEqual(sampleAttribute.state.datasourceStates.indexpattern.layers);
});

it('should return expected XYState', function () {
Expand All @@ -469,6 +346,60 @@ describe('Lens Attribute', () => {
xAccessor: 'x-axis-column-layer0',
yConfig: [{ color: 'green', forAccessor: 'y-axis-column-layer0' }],
},
{
accessors: [
'50th-percentile-reference-line-layer0-reference-lines',
'75th-percentile-reference-line-layer0-reference-lines',
'90th-percentile-reference-line-layer0-reference-lines',
'95th-percentile-reference-line-layer0-reference-lines',
'99th-percentile-reference-line-layer0-reference-lines',
],
layerId: 'layer0-reference-lines',
layerType: 'referenceLine',
seriesType: 'line',
yConfig: [
{
axisMode: 'bottom',
color: '#6092C0',
forAccessor: '50th-percentile-reference-line-layer0-reference-lines',
lineStyle: 'solid',
lineWidth: 2,
textVisibility: true,
},
{
axisMode: 'bottom',
color: '#6092C0',
forAccessor: '75th-percentile-reference-line-layer0-reference-lines',
lineStyle: 'solid',
lineWidth: 2,
textVisibility: true,
},
{
axisMode: 'bottom',
color: '#6092C0',
forAccessor: '90th-percentile-reference-line-layer0-reference-lines',
lineStyle: 'solid',
lineWidth: 2,
textVisibility: true,
},
{
axisMode: 'bottom',
color: '#6092C0',
forAccessor: '95th-percentile-reference-line-layer0-reference-lines',
lineStyle: 'solid',
lineWidth: 2,
textVisibility: true,
},
{
axisMode: 'bottom',
color: '#6092C0',
forAccessor: '99th-percentile-reference-line-layer0-reference-lines',
lineStyle: 'solid',
lineWidth: 2,
textVisibility: true,
},
],
},
],
legend: { isVisible: true, showSingleSeries: true, position: 'right' },
preferredSeriesType: 'line',
Expand All @@ -489,7 +420,7 @@ describe('Lens Attribute', () => {
time: { from: 'now-15m', to: 'now' },
color: 'green',
name: 'test-series',
selectedMetricField: TRANSACTION_DURATION,
selectedMetricField: LCP_FIELD,
};

lnsAttr = new LensAttributes([layerConfig1]);
Expand Down Expand Up @@ -523,7 +454,6 @@ describe('Lens Attribute', () => {
'y-axis-column-layer0X1',
'y-axis-column-layer0X2',
'y-axis-column-layer0X3',
'y-axis-column-layer0X4',
],
columns: {
'breakdown-column-layer0': {
Expand All @@ -547,7 +477,7 @@ describe('Lens Attribute', () => {
'x-axis-column-layer0': {
dataType: 'number',
isBucketed: true,
label: 'Page load time',
label: 'Largest contentful paint',
operationType: 'range',
params: {
maxBars: 'auto',
Expand All @@ -561,9 +491,10 @@ describe('Lens Attribute', () => {
type: 'histogram',
},
scale: 'interval',
sourceField: 'transaction.duration.us',
sourceField: LCP_FIELD,
},
'y-axis-column-layer0': {
customLabel: true,
dataType: 'number',
filter: {
language: 'kuery',
Expand All @@ -584,7 +515,7 @@ describe('Lens Attribute', () => {
"count(kql='transaction.type: page-load and processor.event: transaction and transaction.type : *') / overall_sum(count(kql='transaction.type: page-load and processor.event: transaction and transaction.type : *'))",
isFormulaBroken: false,
},
references: ['y-axis-column-layer0X4'],
references: ['y-axis-column-layer0X3'],
scale: 'ratio',
},
'y-axis-column-layer0X0': {
Expand Down Expand Up @@ -620,31 +551,19 @@ describe('Lens Attribute', () => {
dataType: 'number',
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'math',
params: {
tinymathAst: 'y-axis-column-layer0X1',
},
operationType: 'overall_sum',
references: ['y-axis-column-layer0X1'],
scale: 'ratio',
},
'y-axis-column-layer0X3': {
customLabel: true,
dataType: 'number',
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'overall_sum',
references: ['y-axis-column-layer0X2'],
scale: 'ratio',
},
'y-axis-column-layer0X4': {
customLabel: true,
dataType: 'number',
isBucketed: false,
label: 'Part of count() / overall_sum(count())',
operationType: 'math',
params: {
tinymathAst: {
args: ['y-axis-column-layer0X0', 'y-axis-column-layer0X3'],
args: ['y-axis-column-layer0X0', 'y-axis-column-layer0X2'],
location: {
max: 30,
min: 0,
Expand All @@ -654,7 +573,7 @@ describe('Lens Attribute', () => {
type: 'function',
},
},
references: ['y-axis-column-layer0X0', 'y-axis-column-layer0X3'],
references: ['y-axis-column-layer0X0', 'y-axis-column-layer0X2'],
scale: 'ratio',
},
},
Expand Down Expand Up @@ -688,4 +607,25 @@ describe('Lens Attribute', () => {
);
});
});

describe('Reference line layers', function () {
it('should return expected reference lines', function () {
const layerConfig1: LayerConfig = {
seriesConfig: reportViewConfig,
seriesType: 'line',
indexPattern: mockIndexPattern,
reportDefinitions: {},
time: { from: 'now-15m', to: 'now' },
color: 'green',
name: 'test-series',
selectedMetricField: TRANSACTION_DURATION,
};

lnsAttr = new LensAttributes([layerConfig1]);

const attributes = lnsAttr.getJSON();

expect(attributes).toEqual(sampleAttributeWithReferenceLines);
});
});
});
Loading

0 comments on commit 6f48dbe

Please sign in to comment.