Revert "test: support stubbing subgraph data in cypress (#2259)" (#2269)

This reverts commit 00403a48.

cypress/fixtures/subgraph/feeTierDistribution.json

-{
-  "data": {
-    "_meta": {
-      "block": {
-        "number": 99999999
-      }
-    },
-    "asToken0": [
-      {
-        "feeTier": "500",
-        "totalValueLockedToken0": "0",
-        "totalValueLockedToken1": "1"
-      },
-      {
-        "feeTier": "3000",
-        "totalValueLockedToken0": "0",
-        "totalValueLockedToken1": "7"
-      },
-      {
-        "feeTier": "10000",
-        "totalValueLockedToken0": "0",
-        "totalValueLockedToken1": "2"
-      }
-    ],
-    "asToken1": []
-  }
-}

cypress/fixtures/subgraph/v3Ticks.json

-{
-  "data": {
-    "ticks": [
-      {
-        "tickIdx": "-100",
-        "liquidityNet": "1500.0",
-        "price0": "1000",
-        "price1": "0.01"
-      },
-      {
-        "tickIdx": "-50",
-        "liquidityNet": "1200.0",
-        "price0": "1000",
-        "price1": "0.01"
-      },
-      {
-        "tickIdx": "-25",
-        "liquidityNet": "1000.0",
-        "price0": "1000",
-        "price1": "0.01"
-      },
-      {
-        "tickIdx": "-24",
-        "liquidityNet": "300.0",
-        "price0": "1000",
-        "price1": "0.01"
-      },
-      {
-        "tickIdx": "-23",
-        "liquidityNet": "200.0",
-        "price0": "1000",
-        "price1": "0.01"
-      },
-      {
-        "tickIdx": "-22",
-        "liquidityNet": "100.0",
-        "price0": "1000",
-        "price1": "0.01"
-      },
-      {
-        "tickIdx": "100",
-        "liquidityNet": "100.0",
-        "price0": "1000",
-        "price1": "0.01"
-      }
-    ]
-  }
-}

cypress/integration/add-liquidity.test.ts

+import { CyHttpMessages } from 'cypress/types/net-stubbing'
+import { aliasQuery, hasQuery } from '../utils/graphql-test-utils'
+
 describe('Add Liquidity', () => {
+  beforeEach(() => {
+    cy.intercept('POST', '/subgraphs/name/uniswap/uniswap-v3', (req) => {
+      aliasQuery(req, 'feeTierDistribution')
+    })
+  })
+
   it('loads the two correct tokens', () => {
     cy.visit('/add/0xF9bA5210F91D0474bd1e1DcDAeC4C58E359AaD85/0xc778417E063141139Fce010982780140Aa0cD5Ab/500')
     cy.get('#add-liquidity-input-tokena .token-symbol-container').should('contain.text', 'MKR')
@@ -24,31 +33,31 @@ describe('Add Liquidity', () => {
     cy.get('#add-liquidity-input-tokena .token-symbol-container').should('contain.text', 'MKR')
   })
 
-  describe('with subgraph', () => {
-    it('loads fee tier distribution', () => {
-      cy.intercept('POST', '/subgraphs/name/uniswap/uniswap-v3', { fixture: 'subgraph/feeTierDistribution.json' }).as(
-        'getFeeTierDistributionQuery'
-      )
+  it('loads fee tier distribution', () => {
+    cy.fixture('feeTierDistribution.json').then((feeTierDistribution) => {
+      cy.intercept('POST', '/subgraphs/name/uniswap/uniswap-v3', (req: CyHttpMessages.IncomingHttpRequest) => {
+        if (hasQuery(req, 'feeTierDistribution')) {
+          req.alias = 'feeTierDistributionQuery'
+
+          req.reply({
+            body: {
+              data: {
+                ...feeTierDistribution,
+              },
+            },
+            headers: {
+              'access-control-allow-origin': '*',
+            },
+          })
+        }
+      })
 
       cy.visit('/add/0xF9bA5210F91D0474bd1e1DcDAeC4C58E359AaD85/0xc778417E063141139Fce010982780140Aa0cD5Ab')
 
-      cy.wait('@getFeeTierDistributionQuery')
-
-      cy.get('[data-test-id=selected-fee-label]').should('contain.text', '0.3% fee tier')
-      cy.get('[data-test-id=selected-fee-percentage]').should('contain.text', '70%')
-    })
-
-    it('loads ticks data', () => {
-      cy.intercept('POST', '/subgraphs/name/uniswap/uniswap-v3', { fixture: 'subgraph/v3Ticks.json' }).as(
-        'getV3TicksQuery'
-      )
-
-      cy.visit('/add/0xF9bA5210F91D0474bd1e1DcDAeC4C58E359AaD85/0xc778417E063141139Fce010982780140Aa0cD5Ab/3000')
-
-      cy.wait('@getV3TicksQuery')
+      cy.wait('@feeTierDistributionQuery')
 
-      // TODO: test ticks data (requires stubbing infura pool.tickCurrent)
-      cy.get('[data-test-id=liquidity-chart-loader]').should('exist')
+      cy.get('#add-liquidity-selected-fee .selected-fee-label').should('contain.text', '0.3% fee tier')
+      cy.get('#add-liquidity-selected-fee .selected-fee-percentage').should('contain.text', '70%')
     })
   })
 })

src/components/FeeSelector/index.tsx

@@ -149,10 +149,10 @@ export default function FeeSelector({
                 </>
               ) : (
                 <>
-                  <TYPE.label data-test-id="selected-fee-label">
+                  <TYPE.label className="selected-fee-label">
                     <Trans>{FeeAmountLabel[feeAmount].label}% fee tier</Trans>
                   </TYPE.label>
-                  <Box style={{ width: 'fit-content', marginTop: '8px' }} data-test-id="selected-fee-percentage">
+                  <Box style={{ width: 'fit-content', marginTop: '8px' }} className="selected-fee-percentage">
                     {distributions && feeAmount && <FeeTierPercentageBadge percentage={distributions[feeAmount]} />}
                   </Box>
                 </>

src/components/LiquidityChartRangeInput/index.tsx

@@ -166,7 +166,7 @@ export default function LiquidityChartRangeInput({
           icon={<Inbox size={56} stroke={theme.text1} />}
         />
       ) : isLoading ? (
-        <InfoBox icon={<Loader size="40px" stroke={theme.text4} data-test-id="liquidity-chart-loader" />} />
+        <InfoBox icon={<Loader size="40px" stroke={theme.text4} />} />
       ) : isError ? (
         <InfoBox
           message={<Trans>Liquidity data not available.</Trans>}