diff --git a/apps/explorer-e2e/src/integration/asset.cy.js b/apps/explorer-e2e/src/integration/asset.cy.js index e39d1bd98..6f22ca8e0 100644 --- a/apps/explorer-e2e/src/integration/asset.cy.js +++ b/apps/explorer-e2e/src/integration/asset.cy.js @@ -1,4 +1,8 @@ context('Asset page', { tags: '@regression' }, function () { + before('gather system asset information', function () { + cy.get_asset_information().as('assetsInfo'); + }); + describe('Verify elements on page', function () { const assetsNavigation = 'a[href="/assets"]'; const assetHeader = '[data-testid="asset-header"]'; @@ -7,82 +11,101 @@ context('Asset page', { tags: '@regression' }, function () { before('Navigate to assets page', function () { cy.visit('/'); cy.get(assetsNavigation).click(); + + // Check we have enough enough assets + const assetNames = Object.keys(this.assetsInfo); + assert.isAtLeast( + assetNames.length, + 5, + 'Ensuring we have at least 5 assets to test' + ); }); - it('Assets page is displayed', function () { - cy.common_validate_blocks_data_displayed(assetHeader); - }); - - it('Assets and all asset details are displayed in JSON', function () { - cy.get_asset_information().then((assetsInfo) => { - const assetNames = Object.keys(assetsInfo); - assert.isAtLeast( - assetNames.length, - 3, - 'Ensuring we have at least 3 assets to test' - ); - - assetNames.forEach((assetName) => { - cy.get(assetHeader) - .contains(assetName) - .next() - .within(() => { - cy.get(jsonSection) - .invoke('text') - .convert_string_json_to_js_object() - .then((assetsListedInJson) => { - const assetInfo = assetsInfo[assetName]; - - assert.equal(assetsListedInJson.name, assetInfo.name); - assert.equal(assetsListedInJson.id, assetInfo.id); - assert.equal(assetsListedInJson.decimals, assetInfo.decimals); - assert.equal(assetsListedInJson.symbol, assetInfo.symbol); - assert.equal( - assetsListedInJson.source.__typename, - assetInfo.source.__typename - ); - - if (assetInfo.source.__typename == 'ERC20') { - assert.equal( - assetsListedInJson.source.contractAddress, - assetInfo.source.contractAddress - ); - } - - if (assetInfo.source.__typename == 'BuiltinAsset') { - assert.equal( - assetsListedInJson.source.maxFaucetAmountMint, - assetInfo.source.maxFaucetAmountMint - ); - } - - let knownAssetTypes = ['BuiltinAsset', 'ERC20']; - assert.include( - knownAssetTypes, - assetInfo.source.__typename, - `Checking that current asset type of ${assetInfo.source.__typename} / - is one of: ${knownAssetTypes}: / - If fail then we need to add extra tests for un-encountered asset types` - ); - }); - }); - }); + it('should be able to see assets page sections', function () { + const assetNames = Object.keys(this.assetsInfo); + assetNames.forEach((assetName) => { + cy.get(assetHeader) + .contains(assetName) + .should('be.visible') + .next() + .within(() => { + cy.get(jsonSection).should('not.be.empty'); + }); }); }); - it('Assets page able to switch between light and dark mode', function () { + it('should be able to see all asset details displayed in JSON', function () { + const assetNames = Object.keys(this.assetsInfo); + assetNames.forEach((assetName) => { + cy.get(assetHeader) + .contains(assetName) + .next() + .within(() => { + cy.get(jsonSection) + .invoke('text') + .convert_string_json_to_js_object() + .then((assetsListedInJson) => { + const assetInfo = this.assetsInfo[assetName]; + + assert.equal(assetsListedInJson.name, assetInfo.name); + assert.equal(assetsListedInJson.id, assetInfo.id); + assert.equal(assetsListedInJson.decimals, assetInfo.decimals); + assert.equal(assetsListedInJson.symbol, assetInfo.symbol); + assert.equal( + assetsListedInJson.source.__typename, + assetInfo.source.__typename + ); + + if (assetInfo.source.__typename == 'ERC20') { + assert.equal( + assetsListedInJson.source.contractAddress, + assetInfo.source.contractAddress + ); + } + + if (assetInfo.source.__typename == 'BuiltinAsset') { + assert.equal( + assetsListedInJson.source.maxFaucetAmountMint, + assetInfo.source.maxFaucetAmountMint + ); + } + + let knownAssetTypes = ['BuiltinAsset', 'ERC20']; + assert.include( + knownAssetTypes, + assetInfo.source.__typename, + `Checking that current asset type of ${assetInfo.source.__typename} / + is one of: ${knownAssetTypes}: / + If fail then we need to add extra tests for un-encountered asset types` + ); + }); + }); + }); + }); + + it('should be able to switch assets between light and dark mode', function () { const whiteThemeSelectedMenuOptionColor = 'rgb(255, 7, 127)'; const whiteThemeJsonFieldBackColor = 'rgb(255, 255, 255)'; const whiteThemeSideMenuBackgroundColor = 'rgb(255, 255, 255)'; - const blackThemeSelectedMenuOptionColor = 'rgb(223, 255, 11)'; - const blackThemeJsonFieldBackColor = 'rgb(38, 38, 38)'; - const blackThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)'; + const darkThemeSelectedMenuOptionColor = 'rgb(223, 255, 11)'; + const darkThemeJsonFieldBackColor = 'rgb(38, 38, 38)'; + const darkThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)'; const themeSwitcher = '[data-testid="theme-switcher"]'; const jsonFields = '.hljs'; const sideMenuBackground = '.absolute'; - // White Mode + // Engage dark mode if not allready set + cy.get(sideMenuBackground) + .should('have.css', 'background-color') + .then((background_color) => { + if (background_color.includes(whiteThemeSideMenuBackgroundColor)) + cy.get(themeSwitcher).click(); + }); + + // Engage white mode cy.get(themeSwitcher).click(); + + // White Mode cy.get(assetsNavigation) .should('have.css', 'background-color') .and('include', whiteThemeSelectedMenuOptionColor); @@ -97,19 +120,29 @@ context('Asset page', { tags: '@regression' }, function () { cy.get(themeSwitcher).click(); cy.get(assetsNavigation) .should('have.css', 'background-color') - .and('include', blackThemeSelectedMenuOptionColor); + .and('include', darkThemeSelectedMenuOptionColor); cy.get(jsonFields) .should('have.css', 'background-color') - .and('include', blackThemeJsonFieldBackColor); + .and('include', darkThemeJsonFieldBackColor); cy.get(sideMenuBackground) .should('have.css', 'background-color') - .and('include', blackThemeSideMenuBackgroundColor); + .and('include', darkThemeSideMenuBackgroundColor); }); - it('Assets page displayed in mobile', function () { + it('should be able to see assets page displayed in mobile', function () { cy.common_switch_to_mobile_and_click_toggle(); cy.get(assetsNavigation).click(); - cy.common_validate_blocks_data_displayed(assetHeader); + + const assetNames = Object.keys(this.assetsInfo); + assetNames.forEach((assetName) => { + cy.get(assetHeader) + .contains(assetName) + .should('be.visible') + .next() + .within(() => { + cy.get(jsonSection).should('not.be.empty'); + }); + }); }); }); }); diff --git a/apps/explorer-e2e/src/integration/network.cy.js b/apps/explorer-e2e/src/integration/network.cy.js index 5fdd3f742..91656db7e 100644 --- a/apps/explorer-e2e/src/integration/network.cy.js +++ b/apps/explorer-e2e/src/integration/network.cy.js @@ -201,19 +201,29 @@ context('Network parameters page', { tags: '@smoke' }, function () { }); }); - it.skip('should be able to switch network parameter page - between light and dark mode', function () { + it('should be able to switch network parameter page - between light and dark mode', function () { const whiteThemeSelectedMenuOptionColor = 'rgb(255, 7, 127)'; const whiteThemeJsonFieldBackColor = 'rgb(255, 255, 255)'; const whiteThemeSideMenuBackgroundColor = 'rgb(255, 255, 255)'; - const blackThemeSelectedMenuOptionColor = 'rgb(223, 255, 11)'; - const blackThemeJsonFieldBackColor = 'rgb(38, 38, 38)'; - const blackThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)'; + const darkThemeSelectedMenuOptionColor = 'rgb(223, 255, 11)'; + const darkThemeJsonFieldBackColor = 'rgb(38, 38, 38)'; + const darkThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)'; const themeSwitcher = '[data-testid="theme-switcher"]'; const jsonFields = '.hljs'; const sideMenuBackground = '.absolute'; - // White Mode + // Engage dark mode if not allready set + cy.get(sideMenuBackground) + .should('have.css', 'background-color') + .then((background_color) => { + if (background_color.includes(whiteThemeSideMenuBackgroundColor)) + cy.get(themeSwitcher).click(); + }); + + // Engage white mode cy.get(themeSwitcher).click(); + + // White Mode cy.get(networkParametersNavigation) .should('have.css', 'background-color') .and('include', whiteThemeSelectedMenuOptionColor); @@ -228,13 +238,13 @@ context('Network parameters page', { tags: '@smoke' }, function () { cy.get(themeSwitcher).click(); cy.get(networkParametersNavigation) .should('have.css', 'background-color') - .and('include', blackThemeSelectedMenuOptionColor); + .and('include', darkThemeSelectedMenuOptionColor); cy.get(jsonFields) .should('have.css', 'background-color') - .and('include', blackThemeJsonFieldBackColor); + .and('include', darkThemeJsonFieldBackColor); cy.get(sideMenuBackground) .should('have.css', 'background-color') - .and('include', blackThemeSideMenuBackgroundColor); + .and('include', darkThemeSideMenuBackgroundColor); }); it('should be able to see network parameters - on mobile', function () { diff --git a/apps/explorer-e2e/src/integration/parties.cy.js b/apps/explorer-e2e/src/integration/parties.cy.js index 524231445..c402dc592 100644 --- a/apps/explorer-e2e/src/integration/parties.cy.js +++ b/apps/explorer-e2e/src/integration/parties.cy.js @@ -147,15 +147,25 @@ context('Parties page', { tags: '@regression' }, function () { const whiteThemeSelectedMenuOptionColor = 'rgb(255, 7, 127)'; const whiteThemeJsonFieldBackColor = 'rgb(255, 255, 255)'; const whiteThemeSideMenuBackgroundColor = 'rgb(255, 255, 255)'; - const blackThemeSelectedMenuOptionColor = 'rgb(223, 255, 11)'; - const blackThemeJsonFieldBackColor = 'rgb(38, 38, 38)'; - const blackThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)'; + const darkThemeSelectedMenuOptionColor = 'rgb(223, 255, 11)'; + const darkThemeJsonFieldBackColor = 'rgb(38, 38, 38)'; + const darkThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)'; const themeSwitcher = '[data-testid="theme-switcher"]'; const jsonFields = '.hljs'; const sideMenuBackground = '.absolute'; - // White Mode + // Engage dark mode if not allready set + cy.get(sideMenuBackground) + .should('have.css', 'background-color') + .then((background_color) => { + if (background_color.includes(whiteThemeSideMenuBackgroundColor)) + cy.get(themeSwitcher).click(); + }); + + // Engage white mode cy.get(themeSwitcher).click(); + + // White Mode cy.get(partiesMenuHeader) .should('have.css', 'background-color') .and('include', whiteThemeSelectedMenuOptionColor); @@ -170,13 +180,13 @@ context('Parties page', { tags: '@regression' }, function () { cy.get(themeSwitcher).click(); cy.get(partiesMenuHeader) .should('have.css', 'background-color') - .and('include', blackThemeSelectedMenuOptionColor); + .and('include', darkThemeSelectedMenuOptionColor); cy.get(jsonFields) .should('have.css', 'background-color') - .and('include', blackThemeJsonFieldBackColor); + .and('include', darkThemeJsonFieldBackColor); cy.get(sideMenuBackground) .should('have.css', 'background-color') - .and('include', blackThemeSideMenuBackgroundColor); + .and('include', darkThemeSideMenuBackgroundColor); }); after( diff --git a/apps/explorer-e2e/src/integration/validator.cy.js b/apps/explorer-e2e/src/integration/validator.cy.js index 2aab8cfe0..547f93563 100644 --- a/apps/explorer-e2e/src/integration/validator.cy.js +++ b/apps/explorer-e2e/src/integration/validator.cy.js @@ -1,25 +1,186 @@ context('Validator page', { tags: '@smoke' }, function () { + const validatorMenuHeading = 'a[href="/validators"]'; + const tendermintDataHeader = '[data-testid="tendermint-header"]'; + const vegaDataHeader = '[data-testid="vega-header"]'; + const jsonSection = '.language-json'; + + before('Visit validators page and obtain data', function () { + cy.visit('/'); + cy.get(validatorMenuHeading).click(); + cy.get_validators().as('validators'); + }); + describe('Verify elements on page', function () { - const validatorNavigation = 'a[href="/validators"]'; - - it('Validator page is displayed', function () { - cy.visit('/'); - cy.get(validatorNavigation).click(); - validateValidatorsDisplayed(); - }); - - it('Validator page is displayed on mobile', function () { - cy.common_switch_to_mobile_and_click_toggle(); - cy.get(validatorNavigation).click(); - validateValidatorsDisplayed(); - }); - - function validateValidatorsDisplayed() { - cy.get('[data-testid="tendermint-header"]').should( - 'have.text', - 'Tendermint data' + before('Ensure at least two validators are present', function () { + assert.isAtLeast( + this.validators.length, + 2, + 'Ensuring at least two validators exist' ); - cy.get('[data-testid="tendermint-data"]').should('not.be.empty'); - } + }); + + it('should be able to see validator page sections', function () { + cy.get(vegaDataHeader) + .contains('Vega data') + .and('is.visible') + .next() + .within(() => { + cy.get(jsonSection).should('not.be.empty'); + }); + + cy.get(tendermintDataHeader) + .contains('Tendermint data') + .and('is.visible') + .next() + .within(() => { + cy.get(jsonSection).should('not.be.empty'); + }); + }); + + it('should be able to see relevant validator information', function () { + this.validators.forEach((validator, index) => { + cy.get(tendermintDataHeader) + .contains('Tendermint data') + .next() + .within(() => { + cy.get(jsonSection) + .invoke('text') + .convert_string_json_to_js_object() + .then((validatorsInJson) => { + const validatorInJson = + validatorsInJson.result.validators[index]; + + assert.equal( + validatorInJson.address, + validator.address, + `Checking that validator address shown in json matches system data` + ); + cy.contains(validator.address).should('be.visible'); + + assert.equal( + validatorInJson.pub_key.type, + validator.pub_key.type, + `Checking that validator public key type shown in json matches system data` + ); + cy.contains(validator.pub_key.type).should('be.visible'); + + assert.equal( + validatorInJson.pub_key.value, + validator.pub_key.value, + `Checking that validator public key value shown in json matches system data` + ); + cy.contains(validator.pub_key.value).should('be.visible'); + + assert.equal( + validatorInJson.voting_power, + validator.voting_power, + `Checking that validator voting power in json matches system data` + ); + cy.contains(validator.voting_power).should('be.visible'); + + // Proposer priority can change frequently mid test + // Therefore only checking the field name is present. + cy.contains('proposer_priority').should('be.visible'); + }); + }); + }); + }); + + it('should be able to see validator page displayed on mobile', function () { + cy.common_switch_to_mobile_and_click_toggle(); + cy.get(validatorMenuHeading).click(); + cy.get(vegaDataHeader) + .contains('Vega data') + .and('is.visible') + .next() + .within(() => { + cy.get(jsonSection).should('not.be.empty'); + }); + + cy.get(tendermintDataHeader) + .contains('Tendermint data') + .and('is.visible') + .next() + .within(() => { + cy.get(jsonSection).should('not.be.empty'); + }); + + this.validators.forEach((validator) => { + cy.get(tendermintDataHeader) + .contains('Tendermint data') + .next() + .within(() => { + cy.contains(validator.address).should('be.visible'); + cy.contains(validator.pub_key.type).should('be.visible'); + cy.contains(validator.pub_key.value).should('be.visible'); + cy.contains(validator.voting_power).should('be.visible'); + // Proposer priority can change frequently mid test + // Therefore only checking the field name is present. + cy.contains('proposer_priority').should('be.visible'); + }); + }); + }); + + it('should be able to switch validator page between light and dark mode', function () { + const whiteThemeSelectedMenuOptionColor = 'rgb(255, 7, 127)'; + const whiteThemeJsonFieldBackColor = 'rgb(255, 255, 255)'; + const whiteThemeSideMenuBackgroundColor = 'rgb(255, 255, 255)'; + const darkThemeSelectedMenuOptionColor = 'rgb(223, 255, 11)'; + const darkThemeJsonFieldBackColor = 'rgb(38, 38, 38)'; + const darkThemeSideMenuBackgroundColor = 'rgb(0, 0, 0)'; + const themeSwitcher = '[data-testid="theme-switcher"]'; + const jsonFields = '.hljs'; + const sideMenuBackground = '.absolute'; + + // Engage dark mode if not allready set + cy.get(sideMenuBackground) + .should('have.css', 'background-color') + .then((background_color) => { + if (background_color.includes(whiteThemeSideMenuBackgroundColor)) + cy.get(themeSwitcher).click(); + }); + + // Engage white mode + cy.get(themeSwitcher).click(); + + // White Mode + cy.get(validatorMenuHeading) + .should('have.css', 'background-color') + .and('include', whiteThemeSelectedMenuOptionColor); + cy.get(jsonFields) + .should('have.css', 'background-color') + .and('include', whiteThemeJsonFieldBackColor); + cy.get(sideMenuBackground) + .should('have.css', 'background-color') + .and('include', whiteThemeSideMenuBackgroundColor); + + // Dark Mode + cy.get(themeSwitcher).click(); + cy.get(validatorMenuHeading) + .should('have.css', 'background-color') + .and('include', darkThemeSelectedMenuOptionColor); + cy.get(jsonFields) + .should('have.css', 'background-color') + .and('include', darkThemeJsonFieldBackColor); + cy.get(sideMenuBackground) + .should('have.css', 'background-color') + .and('include', darkThemeSideMenuBackgroundColor); + }); + + Cypress.Commands.add('get_validators', () => { + cy.request({ + method: 'GET', + url: `http://localhost:26617/validators`, + headers: { 'content-type': 'application/json' }, + }) + .its(`body.result.validators`) + .then(function (response) { + let validators = []; + response.forEach((account, index) => { + validators[index] = account; + }); + return validators; + }); + }); }); }); diff --git a/libs/cypress/src/lib/commands/restart-vegacapsule-network.ts b/libs/cypress/src/lib/commands/restart-vegacapsule-network.ts index c1d38167c..13b457a08 100644 --- a/libs/cypress/src/lib/commands/restart-vegacapsule-network.ts +++ b/libs/cypress/src/lib/commands/restart-vegacapsule-network.ts @@ -19,7 +19,7 @@ export function addRestartVegacapsuleNetwork() { cy.exec('vegacapsule network destroy', { failOnNonZeroExit: false }); cy.exec('vegacapsule network destroy', { failOnNonZeroExit: false }) .its('stderr') - .should('contain', 'network cleaning up success'); + .should('contain', 'Network has been successfully cleaned up'); cy.exec( 'vegacapsule network bootstrap --config-path=../../vegacapsule/config.hcl --force', @@ -27,7 +27,7 @@ export function addRestartVegacapsuleNetwork() { ) .its('stderr') .then((response) => { - if (!response.includes('starting network success')) { + if (!response.includes('Network successfully started')) { cy.exec('vegacapsule network destroy', { failOnNonZeroExit: false }); cy.exec( 'vegacapsule network bootstrap --config-path=../../vegacapsule/config.hcl --force', @@ -39,6 +39,6 @@ export function addRestartVegacapsuleNetwork() { }); } }) - .should('contain', 'starting network success'); + .should('contain', 'Network successfully started'); }); }