Test/840 positions update (#1250)

* test: add test for positions in portfolio

* test: update position validation to include updates

* chore: add wait for marketlist

apps/trading-e2e/src/integration/home.cy.ts

@@ -55,6 +55,7 @@ describe('home', () => {
       });
 
       cy.visit('/');
+      cy.wait('@MarketList');
       cy.url().should('eq', Cypress.config().baseUrl + '/markets');
     });
   });

apps/trading-e2e/src/integration/trading-positions.cy.ts

@@ -6,41 +6,63 @@ beforeEach(() => {
   cy.mockGQL((req) => {
     mockTradingPage(req, MarketState.STATE_ACTIVE);
   });
-  cy.visit('/markets/market-0');
 });
 
 describe('positions', () => {
-  it('renders positions', () => {
+  it('renders positions on trading page', () => {
+    cy.visit('/markets/market-0');
     cy.getByTestId('Positions').click();
     cy.getByTestId('tab-positions').contains('Please connect Vega wallet');
 
     connectVegaWallet();
+    validatePositionsDisplayed();
+  });
 
+  it('renders positions on portfolio page', () => {
+    cy.visit('/portfolio');
+    connectVegaWallet();
+    validatePositionsDisplayed();
+  });
+
+  function validatePositionsDisplayed() {
     cy.getByTestId('tab-positions').should('be.visible');
-    cy.getByTestId('tab-positions')
-      .get('[col-id="marketName"]')
-      .should('be.visible')
-      .each(($marketSymbol) => {
-        cy.wrap($marketSymbol).invoke('text').should('not.be.empty');
-      });
-    cy.getByTestId('tab-positions')
-      .get('[col-id="openVolume"]')
-      .each(($openVolume) => {
+    cy.getByTestId('tab-positions').within(() => {
+      cy.get('[col-id="marketName"]')
+        .should('be.visible')
+        .each(($marketSymbol) => {
+          cy.wrap($marketSymbol).invoke('text').should('not.be.empty');
+        });
+
+      cy.get('[col-id="openVolume"]').each(($openVolume) => {
         cy.wrap($openVolume).invoke('text').should('not.be.empty');
       });
-    // includes average entry price, mark price, realised PNL & leverage
-    cy.getByTestId('tab-positions')
-      .getByTestId('flash-cell')
-      .each(($prices) => {
+
+      // includes average entry price, mark price, realised PNL & leverage
+      cy.getByTestId('flash-cell').each(($prices) => {
         cy.wrap($prices).invoke('text').should('not.be.empty');
       });
 
-    cy.get('[col-id="averageEntryPrice"]')
-      .should('contain.text', '11.29935') // entry price
-      .should('contain.text', '9.21954'); // liquidation price
+      cy.get('[col-id="averageEntryPrice"]')
+        .should('contain.text', '11.29935') // entry price
+        .should('contain.text', '9.21954'); // liquidation price
 
-    cy.get('[col-id="capitalUtilisation"]') // margin allocated
-      .should('contain.text', '0.00%')
-      .should('contain.text', '1,000.01000');
-  });
+      cy.get('[col-id="currentLeverage"]').should('contain.text', '1.1');
+
+      cy.get('[col-id="capitalUtilisation"]') // margin allocated
+        .should('contain.text', '0.00%')
+        .should('contain.text', '1,000.01000');
+
+      cy.get('[col-id="unrealisedPNL"]').each(($unrealisedPnl) => {
+        cy.wrap($unrealisedPnl).invoke('text').should('not.be.empty');
+      });
+
+      cy.getByTestId('flash-cell').should('contain.text', '2,785.19482'); // Total tDAI position
+      cy.getByTestId('flash-cell').should('contain.text', '0.00100'); // Total Realised PNL
+      cy.get('[col-id="unrealisedPNL"]').should('contain.text', '17.90000'); // Total Unrealised PNL
+    });
+
+    cy.getByTestId('balance').eq(0).should('have.text', '1,000.01000'); // Asset balance
+
+    cy.getByTestId('close-position').should('be.visible').and('have.length', 3);
+  }
 });

apps/trading-e2e/src/support/mocks/generate-positions.ts

@@ -64,6 +64,60 @@ export const generatePositions = (
         __typename: 'Market',
       },
     },
+    {
+      __typename: 'Position',
+      realisedPNL: '100',
+      openVolume: '20',
+      unrealisedPNL: '895000',
+      averageEntryPrice: '8509338',
+      updatedAt: '2022-07-28T15:09:34.441143Z',
+      marginsConnection: {
+        __typename: 'MarginConnection',
+        edges: [
+          {
+            __typename: 'MarginEdge',
+            node: {
+              __typename: 'MarginLevels',
+              maintenanceLevel: '0',
+              searchLevel: '0',
+              initialLevel: '0',
+              collateralReleaseLevel: '0',
+              market: {
+                __typename: 'Market',
+                id: '0604e8c918655474525e1a95367902266ade70d318c2c908f0cca6e3d11dcb13',
+              },
+              asset: {
+                __typename: 'Asset',
+                symbol: 'tDAI',
+              },
+            },
+          },
+        ],
+      },
+      market: {
+        id: '0604e8c918655474525e1a95367902266ade70d318c2c908f0cca6e3d11dcb13',
+        name: 'AAVEDAI Monthly (30 Jun 2022)',
+        tradingMode: MarketTradingMode.TRADING_MODE_CONTINUOUS,
+        data: {
+          markPrice: '8649338',
+          __typename: 'MarketData',
+          market: {
+            __typename: 'Market',
+            id: '0604e8c918655474525e1a95367902266ade70d318c2c908f0cca6e3d11dcb13',
+          },
+        },
+        decimalPlaces: 5,
+        positionDecimalPlaces: 0,
+        tradableInstrument: {
+          instrument: {
+            name: 'AAVEDAI Monthly (30 Jun 2022)',
+            __typename: 'Instrument',
+          },
+          __typename: 'TradableInstrument',
+        },
+        __typename: 'Market',
+      },
+    },
     {
       realisedPNL: '0',
       openVolume: '1',

libs/positions/src/lib/positions-table.tsx

@@ -130,7 +130,11 @@ const ButtonCell = ({
   data: Position;
 }) => {
   return (
-    <Button onClick={() => onClick(data)} size="sm">
+    <Button
+      data-testid="close-position"
+      onClick={() => onClick(data)}
+      size="sm"
+    >
       {t('Close')}
     </Button>
   );

libs/positions/src/lib/positions.tsx

@@ -88,7 +88,7 @@ export const Positions = memo(
           </h4>
           <p>
             {assetSymbol} {t('balance')}:
-            <span className="pl-1 font-mono">
+            <span data-testid="balance" className="pl-1 font-mono">
               <AssetBalance partyId={partyId} assetSymbol={assetSymbol} />
             </span>
           </p>