From b31a0bcb1106864bbd8877ce6c48b545d14084d2 Mon Sep 17 00:00:00 2001 From: Matthew Russell Date: Tue, 25 Jul 2023 18:24:23 +0100 Subject: [PATCH] feat: changes to support testing with sim, delete cypress version --- apps/trading-e2e/src/integration/navbar.cy.ts | 114 ------------------ apps/trading/components/navbar/navbar.tsx | 17 +-- 2 files changed, 9 insertions(+), 122 deletions(-) delete mode 100644 apps/trading-e2e/src/integration/navbar.cy.ts diff --git a/apps/trading-e2e/src/integration/navbar.cy.ts b/apps/trading-e2e/src/integration/navbar.cy.ts deleted file mode 100644 index 262478610..000000000 --- a/apps/trading-e2e/src/integration/navbar.cy.ts +++ /dev/null @@ -1,114 +0,0 @@ -import { mockConnectWallet } from '@vegaprotocol/cypress'; - -describe('Navbar', { tags: '@smoke' }, () => { - beforeEach(() => { - cy.clearAllLocalStorage(); - cy.mockTradingPage(); - cy.mockSubscription(); - cy.visit('/'); - cy.wait('@Markets'); - cy.wait('@MarketsData'); - }); - - const pages = [ - { name: 'Markets', link: '#/markets/all' }, - { name: 'Trading', link: '#/markets' }, - { name: 'Portfolio', link: '#/portfolio' }, - ]; - - describe('desktop view', () => { - pages.forEach(({ name, link }) => { - it(`${name} should be correctly rendered`, () => { - cy.get('nav') - .find(`a[data-testid=${name}]:visible`) - .then((element) => { - cy.wrap(element).click(); - cy.location('hash').should('contain', link); - }); - }); - }); - - it('Resources dropdown should be correctly rendered', () => { - const resourceSelector = 'ul li:contains(Resources)'; - ['Docs', 'Give Feedback'].forEach((text, index) => { - cy.get('nav').find(resourceSelector).contains('Resources').click(); - cy.get('nav') - .find(resourceSelector) - .find('.navigation-content li') - .eq(index) - .find('a') - .then((element) => { - expect(element.attr('target')).to.eq('_blank'); - expect(element.attr('href')).to.not.be.empty; - expect(element.text()).to.eq(text); - }); - }); - }); - - it('Disclaimer should be presented after choosing from menu', () => { - cy.get('nav') - .find('ul li:contains(Resources)') - .contains('Resources') - .click(); - cy.getByTestId('Disclaimer').eq(0).click(); - cy.location('hash').should('equal', '#/disclaimer'); - cy.get('p').contains( - 'Vega is a decentralised peer-to-peer protocol that can be used to trade derivatives with cryptoassets.' - ); - }); - }); - - describe('mobile view', () => { - const viewportHeight = Cypress.config('viewportHeight'); - const viewportWidth = Cypress.config('viewportWidth'); - before(() => { - // a little hack to keep the viewport size between tests (cypress bug) - Cypress.config({ - viewportWidth: 560, - viewportHeight: 890, - }); - cy.viewport(560, 890); - }); - - describe('wallet drawer', () => { - it('wallet drawer should be correctly rendered', () => { - mockConnectWallet(); - cy.connectVegaWallet(true); - cy.getByTestId('connect-vega-wallet-mobile').click(); - cy.getByTestId('wallets-drawer').should('be.visible'); - cy.getByTestId('wallets-drawer').within((el) => { - cy.wrap(el).get('button').contains('Disconnect').click(); - }); - cy.getByTestId('wallets-drawer').should('not.be.visible'); - }); - }); - - describe('menu drawer', () => { - pages.forEach(({ name, link }) => { - it(`${name} should be correctly rendered`, () => { - cy.getByTestId('button-menu-drawer').click(); - cy.getByTestId('menu-drawer').should('be.visible'); - cy.getByTestId('menu-drawer').within((el) => { - cy.wrap(el).getByTestId(name).click(); - cy.location('hash').should('contain', link); - }); - }); - }); - - it('Menu drawer should not be visible until opened', () => { - cy.getByTestId('menu-drawer').should('not.be.visible'); - cy.getByTestId('button-menu-drawer').click(); - cy.getByTestId('menu-drawer').should('be.visible'); - cy.getByTestId('button-menu-drawer').click(); - cy.getByTestId('menu-drawer').should('not.be.visible'); - }); - }); - after(() => { - // a little hack to keep the viewport size between tests (cypress bug) - Cypress.config({ - viewportWidth, - viewportHeight, - }); - }); - }); -}); diff --git a/apps/trading/components/navbar/navbar.tsx b/apps/trading/components/navbar/navbar.tsx index ba06ad193..a9b3a54db 100644 --- a/apps/trading/components/navbar/navbar.tsx +++ b/apps/trading/components/navbar/navbar.tsx @@ -60,6 +60,7 @@ export const Navbar = ({ children }: { children?: ReactNode }) => { openVegaWalletDialog(); } }} + data-testid="navbar-mobile-wallet" > {t('Wallet')} @@ -68,7 +69,7 @@ export const Navbar = ({ children }: { children?: ReactNode }) => { onClick={() => { setMenu((x) => (x === 'nav' ? null : 'nav')); }} - data-testid="navbar-burger" + data-testid="navbar-mobile-burger" > {t('Menu')} @@ -121,14 +122,14 @@ const NavbarMenu = ({ onClick }: { onClick: () => void }) => { // otherwise always go to /markets/all const tradingPath = marketId ? Links[Routes.MARKET](marketId) - : Routes.MARKETS; + : Links[Routes.MARKET](''); return (
{envNameMapping[VEGA_ENV]} - +
    {[Networks.MAINNET, Networks.TESTNET].map((n) => { const url = VEGA_NETWORKS[n]; @@ -162,7 +163,7 @@ const NavbarMenu = ({ onClick }: { onClick: () => void }) => { {t('Resources')} - +
      {DocsLinks?.NEW_TO_VEGA && (
    • @@ -274,9 +275,10 @@ const NavbarList = (props: N.NavigationMenuListProps) => { /** * Content that gets rendered when a sub section of the navbar is shown */ -const NavbarContent = ({ children }: { children: ReactNode }) => { +const NavbarContent = (props: N.NavigationMenuContentProps) => { return ( { )} onPointerEnter={preventHover} onPointerLeave={preventHover} - > - {children} - + /> ); }; @@ -312,6 +312,7 @@ const NavbarLinkExternal = ({ 'hover:text-vega-clight-50 dark:hover:text-vega-cdark-50' )} onClick={onClick} + target="_blank" > {children}