GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-11 04:39:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

test(FE):Cypress global time test case (#348)

Browse Source 
* chore: cypress version is updated

* chore: tsconfig is updated

* update: default fixture json for the api are added

* feat: redux-store is exposed to the Cypress

* test: Login test is updated

* test: global time test for default and metrics application is updated

* chore: removed duplicate test case and commented unused lines
This commit is contained in:
pal-sig 2021-10-22 17:07:57 +05:30 committed by GitHub
parent 1e33f16943
commit ae4f75e54b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 426 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/cypress/CustomFunctions/Login.ts
View File

@ -1,5 +1,3 @@
import ROUTES from 'constants/routes';
const Login = ({ email, name }: LoginProps): void => {
const emailInput = cy.findByPlaceholderText('mike@netflix.com');
@ -29,12 +27,16 @@ const Login = ({ email, name }: LoginProps): void => {
expect(inputValue).to.be.equals(name);
});
const gettingStartedButton = cy.get('button');
const gettingStartedButton = cy.findByText('Get Started');
gettingStartedButton.click();
cy.location('pathname').then((e) => {
expect(e).to.be.equal(ROUTES.APPLICATION);
});
cy
.intercept('POST', '/api/v1/user?email*', {
statusCode: 200,
})
.as('defaultUser');
cy.wait('@defaultUser');
};
export interface LoginProps {

49
frontend/cypress/CustomFunctions/checkRouteDefaultGlobalTimeOptions.ts Normal file
View File

@ -0,0 +1,49 @@
import {
getDefaultOption,
getOptions,
} from 'container/Header/DateTimeSelection/config';
// import { AppState } from 'store/reducers';
const CheckRouteDefaultGlobalTimeOptions = ({
route,
}: CheckRouteDefaultGlobalTimeOptionsProps): void => {
cy.visit(Cypress.env('baseUrl') + route);
const allOptions = getOptions(route);
const defaultValue = getDefaultOption(route);
const defaultSelectedOption = allOptions.find((e) => e.value === defaultValue);
expect(defaultSelectedOption).not.undefined;
cy
.findAllByTestId('dropDown')
.find('span')
.then((el) => {
const elements = el.get();
const item = elements[1];
expect(defaultSelectedOption?.label).to.be.equals(
item.innerText,
'Default option is not matching',
);
});
// cy
// .window()
// .its('store')
// .invoke('getState')
// .then((e: AppState) => {
// const { globalTime } = e;
// const { maxTime, minTime } = globalTime;
// // @TODO match the global min time and max time according to the selected option
// });
};
export interface CheckRouteDefaultGlobalTimeOptionsProps {
route: string;
}
export default CheckRouteDefaultGlobalTimeOptions;

1
frontend/cypress/fixtures/errorPercentage.json Normal file
View File

@ -0,0 +1 @@
{ "status": "success", "data": { "resultType": "matrix", "result": [] } }

29
frontend/cypress/fixtures/requestPerSecond.json Normal file
View File

@ -0,0 +1,29 @@
{
"status": "success",
"data": {
"resultType": "matrix",
"result": [
{
"metric": {},
"values": [
[1634741764.961, "0.9"],
[1634741824.961, "0.9"],
[1634741884.961, "0.8666666666666667"],
[1634741944.961, "1"],
[1634742004.961, "0.9166666666666666"],
[1634742064.961, "0.95"],
[1634742124.961, "0.9333333333333333"],
[1634742184.961, "0.95"],
[1634742244.961, "1.0333333333333334"],
[1634742304.961, "0.9333333333333333"],
[1634742364.961, "0.9166666666666666"],
[1634742424.961, "0.9"],
[1634742484.961, "1.0166666666666666"],
[1634742544.961, "0.8333333333333334"],
[1634742604.961, "0.9166666666666666"],
[1634742664.961, "0.95"]
]
}
]
}
}

62
frontend/cypress/fixtures/serviceOverview.json Normal file
View File

@ -0,0 +1,62 @@
[
{
"timestamp": 1634742600000000000,
"p50": 720048500,
"p95": 924409540,
"p99": 974744300,
"numCalls": 48,
"callRate": 0.8,
"numErrors": 0,
"errorRate": 0
},
{
"timestamp": 1634742540000000000,
"p50": 712614000,
"p95": 955580700,
"p99": 1045595400,
"numCalls": 59,
"callRate": 0.98333335,
"numErrors": 0,
"errorRate": 0
},
{
"timestamp": 1634742480000000000,
"p50": 720842000,
"p95": 887187600,
"p99": 943676860,
"numCalls": 53,
"callRate": 0.8833333,
"numErrors": 0,
"errorRate": 0
},
{
"timestamp": 1634742420000000000,
"p50": 712287000,
"p95": 908505540,
"p99": 976507650,
"numCalls": 58,
"callRate": 0.96666664,
"numErrors": 0,
"errorRate": 0
},
{
"timestamp": 1634742360000000000,
"p50": 697125500,
"p95": 975581800,
"p99": 1190121900,
"numCalls": 54,
"callRate": 0.9,
"numErrors": 0,
"errorRate": 0
},
{
"timestamp": 1634742300000000000,
"p50": 711592500,
"p95": 880559900,
"p99": 1100105500,
"numCalls": 40,
"callRate": 0.6666667,
"numErrors": 0,
"errorRate": 0
}
]

9
frontend/cypress/fixtures/topEndPoints.json Normal file
View File

@ -0,0 +1,9 @@
[
{
"p50": 710824000,
"p95": 1003231400,
"p99": 1231265500,
"numCalls": 299,
"name": "HTTP GET /dispatch"
}
]

2
frontend/cypress/integration/appLayout/index.spec.ts
View File

@ -22,5 +22,3 @@ describe('App Layout', () => {
});
});
});
export {};

44
frontend/cypress/integration/globalTime/default.spec.ts Normal file
View File

@ -0,0 +1,44 @@
/// <reference types="cypress" />
import ROUTES from 'constants/routes';
describe('default time', () => {
beforeEach(() => {
window.localStorage.setItem('isLoggedIn', 'yes');
});
it('Metrics Page default time', () => {
cy.checkDefaultGlobalOption({
route: ROUTES.APPLICATION,
});
});
it('Dashboard Page default time', () => {
cy.checkDefaultGlobalOption({
route: ROUTES.ALL_DASHBOARD,
});
});
it('Trace Page default time', () => {
cy.checkDefaultGlobalOption({
route: ROUTES.TRACES,
});
});
it('Instrumentation Page default time', () => {
cy.checkDefaultGlobalOption({
route: ROUTES.INSTRUMENTATION,
});
});
it('Service Page default time', () => {
cy.checkDefaultGlobalOption({
route: ROUTES.SERVICE_MAP,
});
});
it('Settings Page default time', () => {
cy.checkDefaultGlobalOption({
route: ROUTES.SETTINGS,
});
});
});

126
frontend/cypress/integration/globalTime/metricsApplication.spec.ts Normal file
View File

@ -0,0 +1,126 @@
/// <reference types="cypress" />
import getGlobalDropDownFormatedDate from 'lib/getGlobalDropDownFormatedDate';
import { AppState } from 'store/reducers';
import topEndPoints from '../../fixtures/topEndPoints.json';
describe('Global Time Metrics Application', () => {
beforeEach(() => {
cy.visit(Cypress.env('baseUrl'));
const testEmail = 'test@test.com';
const firstName = 'Test';
cy.login({
email: testEmail,
name: firstName,
});
});
it('Metrics Application', async () => {
cy
.intercept('GET', '/api/v1/services*', {
fixture: 'defaultApp.json',
})
.as('defaultApps');
cy.wait('@defaultApps');
//clicking on frontend
cy.get('tr:nth-child(1) > td:first-child').click();
cy
.intercept('GET', '/api/v1/service/top_endpoints*', {
fixture: 'topEndPoints.json',
})
.as('topEndPoints');
cy
.intercept('GET', '/api/v1/service/overview?*', {
fixture: 'serviceOverview.json',
})
.as('serviceOverview');
cy
.intercept(
'GET',
`/api/v1/query_range?query=sum(rate(signoz_latency_count*`,
{
fixture: 'requestPerSecond.json',
},
)
.as('requestPerSecond');
cy
.window()
.its('store')
.invoke('getState')
.then((e: AppState) => {
const { globalTime } = e;
const { maxTime, minTime } = globalTime;
// intercepting metrics application call
cy.wait('@topEndPoints');
cy.wait('@serviceOverview');
//TODO add errorPercentage also
// cy.wait('@errorPercentage');
cy.wait('@requestPerSecond');
cy
.get('tbody tr:first-child td:first-child')
.then((el) => {
const elements = el.get();
expect(elements.length).to.be.equals(1);
const element = elements[0];
expect(element.innerText).to.be.equals(topEndPoints[0].name);
})
.click();
cy
.findAllByTestId('dropDown')
.find('span.ant-select-selection-item')
.then((e) => {
const elements = e;
const element = elements[0];
const customSelectedTime = element.innerText;
const startTime = new Date(minTime / 1000000);
const endTime = new Date(maxTime / 1000000);
const startString = getGlobalDropDownFormatedDate(startTime);
const endString = getGlobalDropDownFormatedDate(endTime);
const result = `${startString} - ${endString}`;
expect(customSelectedTime).to.be.equals(result);
});
cy
.findByTestId('dropDown')
.click()
.then(() => {
cy.findByTitle('Last 30 min').click();
});
cy
.findByTestId('dropDown')
.find('span.ant-select-selection-item')
.then((e) => {
const elements = e;
const element = elements[0];
const selectedTime = element.innerText;
expect(selectedTime).to.be.equals('Last 30 min');
});
});
});
});

72
frontend/cypress/integration/metrics/index.spec.ts
View File

@ -1,4 +1,5 @@
/// <reference types="cypress" />
import ROUTES from 'constants/routes';
import convertToNanoSecondsToSecond from 'lib/convertToNanoSecondsToSecond';
import defaultApps from '../../fixtures/defaultApp.json';
@ -9,9 +10,6 @@ describe('Metrics', () => {
const testEmail = 'test@test.com';
const firstName = 'Test';
cy
.intercept('GET', '/api/v1//services?start*', { fixture: 'defaultApp.json' })
.as('defaultApps');
cy.login({
email: testEmail,
@ -20,41 +18,47 @@ describe('Metrics', () => {
});
it('Default Apps', () => {
cy
.intercept('GET', '/api/v1/services*', {
fixture: 'defaultApp.json',
})
.as('defaultApps');
cy.wait('@defaultApps');
cy.get('tbody').then((elements) => {
const trElements = elements.children();
expect(trElements.length).to.be.equal(defaultApps.length);
cy.location().then((e) => {
expect(e.pathname).to.be.equals(ROUTES.APPLICATION);
const getChildren = (row: Element): Element => {
if (row.children.length === 0) {
return row;
}
return getChildren(row.children[0]);
};
cy.get('tbody').then((elements) => {
const trElements = elements.children();
expect(trElements.length).to.be.equal(defaultApps.length);
const getChildren = (row: Element): Element => {
if (row.children.length === 0) {
return row;
}
return getChildren(row.children[0]);
};
// this is row element
trElements.map((index, element) => {
const [
applicationElement,
p99Element,
errorRateElement,
rpsElement,
] = element.children;
const applicationName = getChildren(applicationElement).innerHTML;
const p99Name = getChildren(p99Element).innerHTML;
const errorRateName = getChildren(errorRateElement).innerHTML;
const rpsName = getChildren(rpsElement).innerHTML;
const { serviceName, p99, errorRate, callRate } = defaultApps[index];
expect(applicationName).to.be.equal(serviceName);
expect(p99Name).to.be.equal(convertToNanoSecondsToSecond(p99).toString());
expect(errorRateName).to.be.equals(
parseFloat(errorRate.toString()).toFixed(2),
);
expect(rpsName).to.be.equals(callRate.toString());
// this is row element
trElements.map((index, element) => {
const [
applicationElement,
p99Element,
errorRateElement,
rpsElement,
] = element.children;
const applicationName = getChildren(applicationElement).innerHTML;
const p99Name = getChildren(p99Element).innerHTML;
const errorRateName = getChildren(errorRateElement).innerHTML;
const rpsName = getChildren(rpsElement).innerHTML;
const { serviceName, p99, errorRate, callRate } = defaultApps[index];
expect(applicationName).to.be.equal(serviceName);
expect(p99Name).to.be.equal(convertToNanoSecondsToSecond(p99).toString());
expect(errorRateName).to.be.equals(
parseFloat(errorRate.toString()).toFixed(2),
);
expect(rpsName).to.be.equals(callRate.toString());
});
});
});
});

2
frontend/cypress/plugins/index.ts
View File

@ -19,6 +19,6 @@
/**
* @type {Cypress.PluginConfig}
*/
module.exports = (on, config: Cypress.ConfigOptions) => {};
module.exports = (on, config: Cypress.ConfigOptions): void => {};
export {};

13
frontend/cypress/support/commands.ts
View File

@ -1,13 +1,24 @@
import '@testing-library/cypress/add-commands';
import CheckRouteDefaultGlobalTimeOptions, {
CheckRouteDefaultGlobalTimeOptionsProps,
} from '../CustomFunctions/checkRouteDefaultGlobalTimeOptions';
import Login, { LoginProps } from '../CustomFunctions/Login';
Cypress.Commands.add('login', Login);
Cypress.Commands.add(
'checkDefaultGlobalOption',
CheckRouteDefaultGlobalTimeOptions,
);
declare global {
// eslint-disable-next-line @typescript-eslint/no-namespace
namespace Cypress {
interface Chainable<Subject> {
interface Chainable {
login(props: LoginProps): void;
checkDefaultGlobalOption(
props: CheckRouteDefaultGlobalTimeOptionsProps,
): void;
}
}
}

3
frontend/cypress/tsconfig.json
View File

@ -6,7 +6,8 @@
"noEmit": true,
// be explicit about types included
// to avoid clashing with Jest types
"types": ["cypress", "@testing-library/cypress"]
"types": ["cypress", "@testing-library/cypress"],
"isolatedModules": false
},
"include": ["../node_modules/cypress", "./**/*.ts"]
}

2
frontend/package.json
View File

@ -143,7 +143,7 @@
"babel-plugin-styled-components": "^1.12.0",
"compression-webpack-plugin": "^8.0.0",
"copy-webpack-plugin": "^7.0.0",
"cypress": "^8.3.0",
"cypress": "8.6.0",
"eslint": "^7.30.0",
"eslint-config-prettier": "^8.3.0",
"eslint-config-standard": "^16.0.3",

1
frontend/src/container/Header/DateTimeSelection/index.tsx
View File

@ -278,6 +278,7 @@ const DateTimeSelection = ({
<DefaultSelect
onSelect={(value): void => onSelectHandler(value as Time)}
value={getInputLabel(startTime, endTime, selectedTimeInterval)}
data-testid="dropDown"
>
{options.map(({ value, label }) => (
<Option key={value + label} value={value}>

18
frontend/src/container/Header/utils.ts
View File

@ -1,18 +0,0 @@
import ROUTES from 'constants/routes';
export const getLocalStorageRouteKey = (pathName: string) => {
let localStorageKey = '';
const pathNameSplit = pathName.split('/');
if (!pathNameSplit[2]) {
localStorageKey = pathName;
} else {
Object.keys(ROUTES).forEach((key) => {
if (ROUTES[key].indexOf(':') > -1) {
if (ROUTES[key].indexOf(pathNameSplit[1]) > -1) {
localStorageKey = ROUTES[key];
}
}
});
}
return localStorageKey;
};

5
frontend/src/index.tsx
View File

@ -14,3 +14,8 @@ ReactDOM.render(
</Provider>,
document.querySelector('#root'),
);
// setting the Store for the cypress
if (window.Cypress) {
window.store = store;
}

11
frontend/src/lib/getGlobalDropDownFormatedDate.ts Normal file
View File

@ -0,0 +1,11 @@
function getFormattedDate(date: Date): string {
const month = ('0' + (date.getMonth() + 1)).slice(-2);
const day = ('0' + date.getDate()).slice(-2);
const year = date.getFullYear();
const hour = ('0' + date.getHours()).slice(-2);
const min = ('0' + date.getMinutes()).slice(-2);
return year + '/' + month + '/' + day + ' ' + hour + ':' + min;
}
export default getFormattedDate;

11
frontend/src/typings/window.d.ts vendored Normal file
View File

@ -0,0 +1,11 @@
import Cypress from 'cypress';
import { Store } from 'redux';
declare global {
interface Window {
store: Store;
Cypress: typeof Cypress;
}
}
export {};

32
frontend/yarn.lock
View File

@ -1398,10 +1398,10 @@
resolved "https://registry.yarnpkg.com/@ctrl/tinycolor/-/tinycolor-3.4.0.tgz#c3c5ae543c897caa9c2a68630bed355be5f9990f"
integrity sha512-JZButFdZ1+/xAfpguQHoabIXkcqRRKpMrWKBkpEZZyxfY9C1DpADFB8PEqGSTeFr135SaTRfKqGKx5xSCLI7ZQ==
"@cypress/request@^2.88.5":
version "2.88.5"
resolved "https://registry.yarnpkg.com/@cypress/request/-/request-2.88.5.tgz#8d7ecd17b53a849cfd5ab06d5abe7d84976375d7"
integrity sha512-TzEC1XMi1hJkywWpRfD2clreTa/Z+lOrXDCxxBTBPEcY5azdPi56A6Xw+O4tWJnaJH3iIE7G5aDXZC6JgRZLcA==
"@cypress/request@^2.88.6":
version "2.88.6"
resolved "https://registry.yarnpkg.com/@cypress/request/-/request-2.88.6.tgz#a970dd675befc6bdf8a8921576c01f51cc5798e9"
integrity sha512-z0UxBE/+qaESAHY9p9sM2h8Y4XqtsbDCt0/DPOrqA/RZgKi4PkxdpXyK4wCCnSk1xHqWHZZAE+gV6aDAR6+caQ==
dependencies:
aws-sign2 "~0.7.0"
aws4 "^1.8.0"
@ -1416,13 +1416,12 @@
isstream "~0.1.2"
json-stringify-safe "~5.0.1"
mime-types "~2.1.19"
oauth-sign "~0.9.0"
performance-now "^2.1.0"
qs "~6.5.2"
safe-buffer "^5.1.2"
tough-cookie "~2.5.0"
tunnel-agent "^0.6.0"
uuid "^3.3.2"
uuid "^8.3.2"
"@cypress/xvfb@^1.2.4":
version "1.2.4"
@ -5074,12 +5073,12 @@ custom-event-polyfill@^1.0.6:
resolved "https://registry.yarnpkg.com/custom-event-polyfill/-/custom-event-polyfill-1.0.7.tgz#9bc993ddda937c1a30ccd335614c6c58c4f87aee"
integrity sha512-TDDkd5DkaZxZFM8p+1I3yAlvM3rSr1wbrOliG4yJiwinMZN8z/iGL7BTlDkrJcYTmgUSb4ywVCc3ZaUtOtC76w==
cypress@^8.3.0:
version "8.3.0"
resolved "https://registry.yarnpkg.com/cypress/-/cypress-8.3.0.tgz#ba906d2170888073ad94b2be1b994a749bbb7c7d"
integrity sha512-zA5Rcq8AZIfRfPXU0CCcauofF+YpaU9HYbfqkunFTmFV0Kdlo14tNjH2E3++MkjXKFnv3/pXq+HgxWtw8CSe8Q==
cypress@8.6.0:
version "8.6.0"
resolved "https://registry.yarnpkg.com/cypress/-/cypress-8.6.0.tgz#8d02fa58878b37cfc45bbfce393aa974fa8a8e22"
integrity sha512-F7qEK/6Go5FsqTueR+0wEw2vOVKNgk5847Mys8vsWkzPoEKdxs+7N9Y1dit+zhaZCLtMPyrMwjfA53ZFy+lSww==
dependencies:
"@cypress/request" "^2.88.5"
"@cypress/request" "^2.88.6"
"@cypress/xvfb" "^1.2.4"
"@types/node" "^14.14.31"
"@types/sinonjs__fake-timers" "^6.0.2"
@ -5113,6 +5112,7 @@ cypress@^8.3.0:
minimist "^1.2.5"
ospath "^1.2.2"
pretty-bytes "^5.6.0"
proxy-from-env "1.0.0"
ramda "~0.27.1"
request-progress "^3.0.0"
supports-color "^8.1.1"
@ -10237,11 +10237,6 @@ nwsapi@^2.2.0:
resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.0.tgz#204879a9e3d068ff2a55139c2c772780681a38b7"
integrity sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ==
oauth-sign@~0.9.0:
version "0.9.0"
resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.9.0.tgz#47a7b016baa68b5fa0ecf3dee08a85c679ac6455"
integrity sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==
object-assign@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-3.0.0.tgz#9bedd5ca0897949bca47e7ff408062d549f587f2"
@ -11469,6 +11464,11 @@ proxy-addr@~2.0.5:
forwarded "0.2.0"
ipaddr.js "1.9.1"
proxy-from-env@1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.0.0.tgz#33c50398f70ea7eb96d21f7b817630a55791c7ee"
integrity sha1-M8UDmPcOp+uW0h97gXYwpVeRx+4=
prr@~1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476"