diff --git a/playwright/utils/configs.ts b/playwright/utils/configs.ts index 5871ee3c45..4d9bc8802f 100644 --- a/playwright/utils/configs.ts +++ b/playwright/utils/configs.ts @@ -29,6 +29,9 @@ export const featureEnvs = { value: '[{"type":"omni","title":"OmniBridge","short_title":"OMNI"},{"type":"amb","title":"Arbitrary Message Bridge","short_title":"AMB"}]', }, ], + txInterpretation: [ + { name: 'NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER', value: 'blockscout' }, + ], zkRollup: [ { name: 'NEXT_PUBLIC_IS_ZKEVM_L2_NETWORK', value: 'true' }, { name: 'NEXT_PUBLIC_L1_BASE_URL', value: 'https://localhost:3101' }, diff --git a/ui/tx/TxSubHeading.pw.tsx b/ui/tx/TxSubHeading.pw.tsx new file mode 100644 index 0000000000..39b4397b4e --- /dev/null +++ b/ui/tx/TxSubHeading.pw.tsx @@ -0,0 +1,59 @@ +import { test, expect } from '@playwright/experimental-ct-react'; +import React from 'react'; + +import { txInterpretation } from 'mocks/txs/txInterpretation'; +import contextWithEnvs from 'playwright/fixtures/contextWithEnvs'; +import TestApp from 'playwright/TestApp'; +import buildApiUrl from 'playwright/utils/buildApiUrl'; +import * as configs from 'playwright/utils/configs'; + +import TxSubHeading from './TxSubHeading'; + +const hash = '0x62d597ebcf3e8d60096dd0363bc2f0f5e2df27ba1dacd696c51aa7c9409f3193'; + +const TX_INTERPRETATION_API_URL = buildApiUrl('tx_interpretation', { hash }); + +test('no interpretation +@mobile', async({ mount }) => { + const component = await mount( + + + , + ); + + await expect(component).toHaveScreenshot(); +}); + +const bsInterpretationTest = test.extend({ + // eslint-disable-next-line @typescript-eslint/no-explicit-any + context: contextWithEnvs(configs.featureEnvs.txInterpretation) as any, +}); + +bsInterpretationTest('with interpretation +@mobile +@dark-mode', async({ mount, page }) => { + await page.route(TX_INTERPRETATION_API_URL, (route) => route.fulfill({ + status: 200, + body: JSON.stringify(txInterpretation), + })); + + const component = await mount( + + + , + ); + + await expect(component).toHaveScreenshot(); +}); + +bsInterpretationTest('no interpretation', async({ mount, page }) => { + await page.route(TX_INTERPRETATION_API_URL, (route) => route.fulfill({ + status: 200, + body: JSON.stringify({ data: { summaries: [] } }), + })); + + const component = await mount( + + + , + ); + + await expect(component).toHaveScreenshot(); +}); diff --git a/ui/tx/TxSubHeading.tsx b/ui/tx/TxSubHeading.tsx index 97aa74ab60..477aeddef6 100644 --- a/ui/tx/TxSubHeading.tsx +++ b/ui/tx/TxSubHeading.tsx @@ -27,11 +27,11 @@ const TxSubHeading = ({ hash, hasTag }: Props) => { }); const hasInterpretation = hasInterpretationFeature && - (txInterpretationQuery.isPlaceholderData || txInterpretationQuery.data?.data.summaries.length); + (txInterpretationQuery.isPlaceholderData || Boolean(txInterpretationQuery.data?.data.summaries.length)); return ( - { hasInterpretationFeature && ( + { hasInterpretation && ( { - const component = await mount( - - - , - ); - - await expect(component).toHaveScreenshot(); -}); diff --git a/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png b/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png deleted file mode 100644 index 2215fda332..0000000000 Binary files a/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_dark-color-mode_base-view-mobile-dark-mode-1.png and /dev/null differ diff --git a/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_default_base-view-mobile-dark-mode-1.png b/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_default_base-view-mobile-dark-mode-1.png deleted file mode 100644 index d98c410d2a..0000000000 Binary files a/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_default_base-view-mobile-dark-mode-1.png and /dev/null differ diff --git a/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_mobile_base-view-mobile-dark-mode-1.png b/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_mobile_base-view-mobile-dark-mode-1.png deleted file mode 100644 index fd03fc242f..0000000000 Binary files a/ui/tx/interpretation/__screenshots__/TxInterpretation.pw.tsx_mobile_base-view-mobile-dark-mode-1.png and /dev/null differ