From 2403f4edc44fd034ba1a5055673182ea7008a9b8 Mon Sep 17 00:00:00 2001
From: Joe Tsang <30622993+jtsang586@users.noreply.github.com>
Date: Mon, 18 Jul 2022 11:54:02 +0100
Subject: [PATCH] Test/471 cancel order (#772)

* test: add assertion for cancel order button

* fix: stop cypress failing test from ResizeObserver exception
---
 .../src/integration/trading-orders.cy.ts      | 52 ++++++++++---------
 .../src/support/mocks/generate-orders.ts      | 29 +++++++++++
 libs/cypress/src/index.ts                     |  5 ++
 3 files changed, 61 insertions(+), 25 deletions(-)

diff --git a/apps/trading-e2e/src/integration/trading-orders.cy.ts b/apps/trading-e2e/src/integration/trading-orders.cy.ts
index 88ffd9b5e..00fae1633 100644
--- a/apps/trading-e2e/src/integration/trading-orders.cy.ts
+++ b/apps/trading-e2e/src/integration/trading-orders.cy.ts
@@ -29,50 +29,52 @@ describe('orders', () => {
   it('renders orders', () => {
     cy.getByTestId('tab-orders').should('be.visible');
 
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderSymbol}']`)
-      .each(($symbol) => {
+    cy.getByTestId('tab-orders').within(() => {
+      cy.get(`[col-id='${orderSymbol}']`).each(($symbol) => {
         cy.wrap($symbol).invoke('text').should('not.be.empty');
       });
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderSize}']`)
-      .each(($size) => {
+
+      cy.get(`[col-id='${orderSize}']`).each(($size) => {
         cy.wrap($size).invoke('text').should('not.be.empty');
       });
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderType}']`)
-      .each(($type) => {
+
+      cy.get(`[col-id='${orderType}']`).each(($type) => {
         cy.wrap($type).invoke('text').should('not.be.empty');
       });
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderStatus}']`)
-      .each(($status) => {
+
+      cy.get(`[col-id='${orderStatus}']`).each(($status) => {
         cy.wrap($status).invoke('text').should('not.be.empty');
       });
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderRemaining}']`)
-      .each(($remaining) => {
+
+      cy.get(`[col-id='${orderRemaining}']`).each(($remaining) => {
         cy.wrap($remaining).invoke('text').should('not.be.empty');
       });
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderPrice}']`)
-      .each(($price) => {
+
+      cy.get(`[col-id='${orderPrice}']`).each(($price) => {
         cy.wrap($price).invoke('text').should('not.be.empty');
       });
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderTimeInForce}']`)
-      .each(($timeInForce) => {
+
+      cy.get(`[col-id='${orderTimeInForce}']`).each(($timeInForce) => {
         cy.wrap($timeInForce).invoke('text').should('not.be.empty');
       });
-    cy.getByTestId('tab-orders')
-      .get(`[col-id='${orderCreatedAt}']`)
-      .each(($dateTime) => {
+
+      cy.get(`[col-id='${orderCreatedAt}']`).each(($dateTime) => {
         cy.wrap($dateTime).invoke('text').should('not.be.empty');
       });
+
+      cy.getByTestId('cancel')
+        .should('be.visible')
+        .and('have.length.at.least', 1);
+    });
   });
 
   it('orders are sorted by most recent order', () => {
-    const expectedOrderList = ['TSLA.QM21', 'BTCUSD.MF21', 'AAVEDAI.MF21'];
+    const expectedOrderList = [
+      'UNIDAI.MF21',
+      'TSLA.QM21',
+      'BTCUSD.MF21',
+      'AAVEDAI.MF21',
+    ];
 
     cy.getByTestId('tab-orders')
       .get(`[col-id='${orderSymbol}']`)
diff --git a/apps/trading-e2e/src/support/mocks/generate-orders.ts b/apps/trading-e2e/src/support/mocks/generate-orders.ts
index 08ec6ea23..5e2c2c814 100644
--- a/apps/trading-e2e/src/support/mocks/generate-orders.ts
+++ b/apps/trading-e2e/src/support/mocks/generate-orders.ts
@@ -97,6 +97,35 @@ export const generateOrders = (override?: PartialDeep<Orders>): Orders => {
       expiresAt: null,
       rejectionReason: null,
     },
+    {
+      __typename: 'Order',
+      id: '94737d2bafafa4bc3b80a56ef084ae52a983b91aa067c31e243c61a0f962a836',
+      market: {
+        __typename: 'Market',
+        id: 'a316fa51dab97d76a1472c2f22906f4e461728e04355096788165d5b13999ed5',
+        name: 'UNIDAI Monthly (30 Jun 2022)',
+        decimalPlaces: 5,
+        positionDecimalPlaces: 0,
+        tradableInstrument: {
+          __typename: 'TradableInstrument',
+          instrument: {
+            __typename: 'Instrument',
+            code: 'UNIDAI.MF21',
+          },
+        },
+      },
+      size: '1',
+      type: OrderType.Limit,
+      status: OrderStatus.Active,
+      side: Side.Buy,
+      remaining: '0',
+      price: '100000',
+      timeInForce: OrderTimeInForce.GTC,
+      createdAt: new Date(2022, 7, 15).toISOString(),
+      updatedAt: null,
+      expiresAt: null,
+      rejectionReason: null,
+    },
   ];
 
   const defaultResult = {
diff --git a/libs/cypress/src/index.ts b/libs/cypress/src/index.ts
index 03349d1de..4d6344fd7 100644
--- a/libs/cypress/src/index.ts
+++ b/libs/cypress/src/index.ts
@@ -13,3 +13,8 @@ addMockWeb3ProviderCommand();
 addHighlightLog();
 
 export * from './lib/graphql-test-utils';
+
+Cypress.on(
+  'uncaught:exception',
+  (err) => !err.message.includes('ResizeObserver loop limit exceeded')
+);