Skip to content

Commit

Permalink
Update jest snapshots & cypress tests (#314)
Browse files Browse the repository at this point in the history 
* update visualizations cypress

Signed-off-by: Shenoy Pratik <sgguruda@amazon.com>

* update snapshots

Signed-off-by: Shenoy Pratik <sgguruda@amazon.com>

* remove cypress delay and wait calls

Signed-off-by: Shenoy Pratik <sgguruda@amazon.com>

---------

Signed-off-by: Shenoy Pratik <sgguruda@amazon.com>
  • Loading branch information
@ps48
ps48 authored Jan 10, 2024
1 parent 98aa505 commit d1551b7
Show file tree
Hide file tree
Showing 5 changed files with 120 additions and 111 deletions.
0 ...t-chart/.cypress/utils/jaeger-sample.json → ...chart/.cypress/fixtures/jaeger-sample.txt
View file
File renamed without changes.
175 changes: 80 additions & 95 deletions gantt-chart/.cypress/integration/ui.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,35 +5,31 @@

/// <reference types="cypress" />

import {
testDataSet,
delay,
GANTT_VIS_NAME,
Y_LABEL,
X_LABEL,
DEFAULT_SIZE,
} from '../utils/constants';
import customParseFormat from 'dayjs/plugin/customParseFormat';
import dayjs from 'dayjs';
import { GANTT_VIS_NAME, Y_LABEL, X_LABEL, DEFAULT_SIZE } from '../utils/constants';
dayjs.extend(customParseFormat);

describe('Dump test data', () => {
it('Indexes test data for gantt chart', () => {
const dumpDataSet = (url, index) =>
cy.request(url).then((response) => {
cy.request({
const dumpDataSet = (ndjson, index) =>
cy.request({
method: 'POST',
form: false,
url: 'api/console/proxy',
headers: {
'content-type': 'application/json;charset=UTF-8',
'osd-xsrf': true,
},
qs: {
path: `${index}/_bulk`,
method: 'POST',
form: true,
url: 'api/console/proxy',
headers: {
'content-type': 'application/json;charset=UTF-8',
'osd-xsrf': true,
},
qs: {
path: `${index}/_bulk`,
method: 'POST',
},
body: response.body,
});
},
body: ndjson,
});
testDataSet.forEach(({ url, index }) => dumpDataSet(url, index));
cy.fixture('jaeger-sample.txt').then((ndjson) => {
dumpDataSet(ndjson, 'jaeger');
});

cy.request({
method: 'POST',
Expand All @@ -51,155 +47,146 @@ describe('Dump test data', () => {
describe('Save a gantt chart', () => {
beforeEach(() => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/visualize#`);
cy.wait(delay * 5);
});

it('Creates and saves a gantt chart', () => {
cy.get('.euiButton__text').contains('Create ').click({ force: true });
cy.wait(delay * 3);
cy.get('span[data-test-subj="visTypeTitle"]').contains('Gantt Chart').click({ force: true });
cy.wait(delay * 3);
cy.get('.euiListGroupItem__label')
.contains(/^jaeger$/)
.click({ force: true });
cy.wait(delay * 5);
cy.get('.euiButton__text').contains('Save').click({ force: true });
cy.wait(delay);
cy.get('[data-test-subj="visTypeTitle"]').contains('Gantt Chart').click({ force: true });
cy.contains(/^jaeger$/).click({ force: true });
cy.contains('Save').click({ force: true });
cy.get('input[data-test-subj="savedObjectTitle"]').type(GANTT_VIS_NAME);
cy.wait(delay);
cy.get('button[data-test-subj="confirmSaveSavedObjectButton"]').click({ force: true });
cy.wait(delay * 3);
cy.get('button[data-test-subj="confirmSaveSavedObjectButton"]').click({
force: true,
});

cy.get('.euiToastHeader__title').contains('Saved').should('exist');
cy.contains('Saved').should('exist');
});
});

describe('Render and configure a gantt chart', () => {
beforeEach(() => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/visualize#`);
cy.wait(delay * 5);
cy.get('button').contains(GANTT_VIS_NAME).click({ force: true });
cy.wait(delay * 5);
cy.contains(GANTT_VIS_NAME).click({ force: true });
});

it('Renders no data message', () => {
cy.get('.euiTitle').contains('No data').should('exist');
cy.contains('No data').should('exist');
});

it('Renders the chart', () => {
cy.get('button.euiSuperSelectControl').eq(0).click({ force: true });
cy.wait(delay);
cy.get('button[data-test-subj="gantt-chart-editor-label-field"]').click();
cy.get('.euiContextMenuItem__text')
.contains(/^spanID$/)
.click({ force: true });
cy.wait(delay);
cy.get('button.euiSuperSelectControl').eq(1).click({ force: true });
cy.wait(delay);
.click();
cy.get('button[data-test-subj="gantt-chart-editor-start-time-field"]').click();
cy.get('.euiContextMenuItem__text')
.contains(/^startTime$/)
.click({ force: true });
cy.wait(delay);
cy.get('button.euiSuperSelectControl').eq(2).click({ force: true });
cy.wait(delay);
.click();
cy.get('button[data-test-subj="gantt-chart-editor-duration-field"]').click();
cy.get('.euiContextMenuItem__text')
.contains(/^duration$/)
.click({ force: true });
cy.wait(delay);
.click();
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);

cy.get('.traces').should('have.length', DEFAULT_SIZE);

cy.get('.euiButton__text').contains('Save').click({ force: true });
cy.wait(delay);
cy.get('button[data-test-subj="confirmSaveSavedObjectButton"]').click({ force: true });
cy.wait(delay * 3);
cy.get('button[data-test-subj="confirmSaveSavedObjectButton"]').click({
force: true,
});
});
});

describe('Configure panel settings', () => {
beforeEach(() => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/visualize#`);
cy.wait(delay * 5);
cy.get('button').contains(GANTT_VIS_NAME).click({ force: true });
cy.wait(delay * 5);
cy.get('.euiTab__content').contains('Panel settings').click({ force: true });
cy.wait(delay);
cy.contains(GANTT_VIS_NAME).click({ force: true });
cy.contains('Panel settings').click({ force: true });
});

it('Changes y-axis label', () => {
cy.get('input.euiFieldText[placeholder="Label"]').eq(0).focus().type(Y_LABEL);
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);

cy.get('text.ytitle').contains(Y_LABEL).should('exist');

cy.get('.euiSwitch__label').contains('Show Y-axis label').click({ force: true });
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);

cy.get('text.ytitle').should('not.exist');
});

it('Changes x-axis label', () => {
cy.get('input.euiFieldText[placeholder="Label"]').eq(1).focus().type(X_LABEL);
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);

cy.get('text.xtitle').contains(X_LABEL).should('exist');

cy.get('.euiSwitch__label').contains('Show X-axis label').click({ force: true });
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);

cy.get('text.xtitle').should('not.exist');
});

it('Changes time formats', () => {
cy.get('g.xtick > text').contains('12:59:07.303 PM').should('exist');
cy.intercept({ method: 'POST', url: '**/api/gantt_vis/query' }).as('timeUpdateRequest');

cy.get('select').eq(3).select('MM/DD hh:mm:ss A');
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);
cy.get('g.xtick > text').contains('05/28 12:59:07 PM').should('exist');
cy.wait('@timeUpdateRequest');
cy.get('.xtick')
.eq(0)
.invoke('text')
.should('satisfy', (text) => {
return dayjs(text, 'MM/DD hh:mm:ss A', true).isValid();
});

cy.get('select').eq(3).select('MM/DD/YY hh:mm A');
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);
cy.get('g.xtick > text').contains('05/28/20 12:59 PM').should('exist');
cy.wait('@timeUpdateRequest');
cy.get('.xtick')
.eq(0)
.invoke('text')
.should('satisfy', (text) => {
return dayjs(text, 'MM/DD/YY hh:mm A', true).isValid();
});

cy.get('select').eq(3).select('HH:mm:ss.SSS');
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);
cy.get('g.xtick > text').contains('12:59:07.303').should('exist');
cy.wait('@timeUpdateRequest');
cy.get('.xtick')
.eq(0)
.invoke('text')
.should('satisfy', (text) => {
return dayjs(text, 'HH:mm:ss.SSS', true).isValid();
});

cy.get('select').eq(3).select('MM/DD HH:mm:ss');
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);
cy.get('g.xtick > text').contains('05/28 12:59:07').should('exist');
cy.wait('@timeUpdateRequest');
cy.get('.xtick')
.eq(0)
.invoke('text')
.should('satisfy', (text) => {
return dayjs(text, 'MM/DD HH:mm:ss', true).isValid();
});

cy.get('select').eq(3).select('MM/DD/YY HH:mm');
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);
cy.get('g.xtick > text').contains('05/28/20 12:59').should('exist');
cy.wait('@timeUpdateRequest');
cy.get('.xtick')
.eq(0)
.invoke('text')
.should('satisfy', (text) => {
return dayjs(text, 'MM/DD/YY HH:mm', true).isValid();
});
});

it('Hides legends', () => {
cy.get('g.traces').should('have.length', DEFAULT_SIZE);

cy.get('.euiSwitch__label').contains('Show legend').click({ force: true });
cy.wait(delay);
cy.get('.euiButton__text').contains('Update').click({ force: true });
cy.wait(delay);

cy.get('g.traces').should('not.exist');
});
Expand All @@ -208,14 +195,12 @@ describe('Configure panel settings', () => {
describe('Add gantt chart to dashboard', () => {
it('Adds gantt chart to dashboard', () => {
cy.visit(`${Cypress.env('opensearchDashboards')}/app/dashboards#/create`);
cy.wait(delay * 5);

cy.get('.euiLink').contains('Add an existing').click({ force: true });
cy.wait(delay);
cy.contains('Add an existing').click({ force: true });
cy.get('input[data-test-subj="savedObjectFinderSearchInput"]').focus().type(GANTT_VIS_NAME);
cy.wait(delay);
cy.get(`.euiListGroupItem__label[title="${GANTT_VIS_NAME}"]`).click({ force: true });
cy.wait(delay);
cy.get(`.euiListGroupItem__label[title="${GANTT_VIS_NAME}"]`).click({
force: true,
});

cy.get('g.traces').should('have.length', DEFAULT_SIZE);
});
Expand Down
8 changes: 0 additions & 8 deletions gantt-chart/.cypress/utils/constants.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,6 @@
* SPDX-License-Identifier: Apache-2.0
*/

export const testDataSet = [
{
url: 'https://raw.githubusercontent.com/opensearch-project/dashboards-visualizations/main/gantt-chart/.cypress/utils/jaeger-sample.json',
index: 'jaeger',
},
];

export const delay = 1000;
export const GANTT_VIS_NAME = 'A test gantt chart ' + Math.random().toString(36).substring(2);
export const Y_LABEL = 'A unique label for Y-axis';
export const X_LABEL = 'A unique label for X-axis';
Expand Down
18 changes: 15 additions & 3 deletions gantt-chart/public/components/__tests__/__snapshots__/gantt_chart_editor.test.tsx.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,11 @@ exports[`<GanttChartEditor /> spec renders the component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
/>
>
<path
d="M5.277 10.088c.02.014.04.03.057.047.582.55 1.134.812 1.666.812.586 0 1.84-.293 3.713-.88L9 6.212V2H7v4.212l-1.723 3.876Zm-.438.987L3.539 14h8.922l-1.32-2.969C9.096 11.677 7.733 12 7 12c-.74 0-1.463-.315-2.161-.925ZM6 2H5V1h6v1h-1v4l3.375 7.594A1 1 0 0 1 12.461 15H3.54a1 1 0 0 1-.914-1.406L6 6V2Z"
/>
</svg>
</span>
</div>
</div>
Expand Down Expand Up @@ -156,7 +160,11 @@ exports[`<GanttChartEditor /> spec renders the component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
/>
>
<path
d="M5.277 10.088c.02.014.04.03.057.047.582.55 1.134.812 1.666.812.586 0 1.84-.293 3.713-.88L9 6.212V2H7v4.212l-1.723 3.876Zm-.438.987L3.539 14h8.922l-1.32-2.969C9.096 11.677 7.733 12 7 12c-.74 0-1.463-.315-2.161-.925ZM6 2H5V1h6v1h-1v4l3.375 7.594A1 1 0 0 1 12.461 15H3.54a1 1 0 0 1-.914-1.406L6 6V2Z"
/>
</svg>
</span>
</div>
</div>
Expand Down Expand Up @@ -236,7 +244,11 @@ exports[`<GanttChartEditor /> spec renders the component 1`] = `
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
/>
>
<path
d="M5.277 10.088c.02.014.04.03.057.047.582.55 1.134.812 1.666.812.586 0 1.84-.293 3.713-.88L9 6.212V2H7v4.212l-1.723 3.876Zm-.438.987L3.539 14h8.922l-1.32-2.969C9.096 11.677 7.733 12 7 12c-.74 0-1.463-.315-2.161-.925ZM6 2H5V1h6v1h-1v4l3.375 7.594A1 1 0 0 1 12.461 15H3.54a1 1 0 0 1-.914-1.406L6 6V2Z"
/>
</svg>
</span>
</div>
</div>
Expand Down
Loading

0 comments on commit d1551b7

Please sign in to comment.