Conversation
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
3ccdbfc to
cae9700
Compare
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
Autofix Details
Bugbot Autofix prepared a fix for the issue found in the latest run.
- ✅ Fixed: Removed styles mock may break test with missing colors
- Restored a local styles mock in the test to isolate from design tokens and avoid undefined color properties.
Or push these changes by commenting:
@cursor push 08c4a21625
Preview (08c4a21625)
diff --git a/app/components/UI/Perps/components/PerpsLimitPriceBottomSheet/PerpsLimitPriceBottomSheet.test.tsx b/app/components/UI/Perps/components/PerpsLimitPriceBottomSheet/PerpsLimitPriceBottomSheet.test.tsx
--- a/app/components/UI/Perps/components/PerpsLimitPriceBottomSheet/PerpsLimitPriceBottomSheet.test.tsx
+++ b/app/components/UI/Perps/components/PerpsLimitPriceBottomSheet/PerpsLimitPriceBottomSheet.test.tsx
@@ -93,6 +93,25 @@
strings: jest.fn((key) => key),
}));
+// Mock styles to avoid relying on design tokens structure
+jest.mock('./PerpsLimitPriceBottomSheet.styles', () => ({
+ __esModule: true,
+ createStyles: () => ({
+ container: {},
+ inputLabel: {},
+ errorText: {},
+ limitPriceDisplay: {},
+ limitPriceValue: {},
+ limitPriceCurrency: {},
+ marketPriceText: {},
+ percentageButtonsRow: {},
+ percentageButton: {},
+ percentageButtonActive: {},
+ keypadContainer: {},
+ footerContainer: {},
+ }),
+}));
+
// Mock BigNumber
jest.mock('bignumber.js', () => ({
BigNumber: jest.fn().mockImplementation((value) => ({
...omponents/UI/Perps/components/PerpsLimitPriceBottomSheet/PerpsLimitPriceBottomSheet.test.tsx
Show resolved
Hide resolved
| './PerpsOrderBookView.styles', | ||
| ).default; | ||
|
|
||
| if (styleSheet === perpsOrderBookViewStyleSheet) { |
There was a problem hiding this comment.
This useStyles mock is intentionally scoped to the PerpsOrderBookView stylesheet so shared components like Text can keep their own vars-aware style factories. That avoids false negatives from test-only style wiring and keeps this test focused on order book behavior.
| '../../../../../component-library/hooks', | ||
| ); | ||
| useStyles.mockReturnValue({ styles: mockStyles }); | ||
| useStyles.mockImplementation((styleSheet) => ({ |
There was a problem hiding this comment.
This test now builds styles from the real stylesheet with mockTheme, which keeps token wiring consistent with runtime behavior and reduces maintenance when style keys evolve.
| } from './useColorPulseAnimation'; | ||
| import { mockTheme } from '../../../../util/theme'; | ||
|
|
||
| jest.mock('../../../../component-library/hooks', () => ({ |
There was a problem hiding this comment.
Using mockTheme directly in the hook-level useStyles mock keeps the default pulse color path aligned with runtime token values. That avoids color fixture drift while still allowing explicit color override coverage in this test file.
| icon: { default: '#000000' }, | ||
| }, | ||
| }, | ||
| theme: mockTheme, |
There was a problem hiding this comment.
Switching the mocked theme to mockTheme here centralizes token values and removes hardcoded color fixtures. This makes the view test less sensitive to local palette stubs and closer to production theming behavior.
| beforeEach(() => { | ||
| jest.clearAllMocks(); | ||
| mockUseTheme.mockReturnValue(mockTheme); | ||
| mockUseTheme.mockReturnValue(baseMockTheme); |
There was a problem hiding this comment.
The local style mock removal here intentionally pushes this test through the component's real style creation path. That keeps assertions focused on behavior while eliminating brittle color literals that can diverge from design tokens.
2532d65 to
5fa86b5
Compare
5fa86b5 to
bdc53b5
Compare
🔍 Smart E2E Test Selection
click to see 🤖 AI reasoning detailsE2E Test Selection:
Why no E2E tests are needed:
This is a standard test maintenance/refactoring PR with zero risk to production functionality. Performance Test Selection: |
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
Bugbot Autofix prepared a fix for the issue found in the latest run.
- ✅ Fixed: PR/issue references lose
#prefix to satisfy lint- Restored
#in all affected PR/issue references and added targeted// eslint-disable-next-line @metamask/design-tokens/color-no-hexcomments to prevent false positives.
- Restored
Or push these changes by commenting:
@cursor push 642255872b
Preview (642255872b)
diff --git a/app/components/UI/Perps/Views/PerpsMarketDetailsView/PerpsMarketDetailsView.view.test.tsx b/app/components/UI/Perps/Views/PerpsMarketDetailsView/PerpsMarketDetailsView.view.test.tsx
--- a/app/components/UI/Perps/Views/PerpsMarketDetailsView/PerpsMarketDetailsView.view.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsMarketDetailsView/PerpsMarketDetailsView.view.test.tsx
@@ -136,7 +136,8 @@
).not.toBeOnTheScreen();
});
- describe('Bug 25315: Geo-restriction for Close and Modify actions', () => {
+ // eslint-disable-next-line @metamask/design-tokens/color-no-hex
+ describe('Bug #25315: Geo-restriction for Close and Modify actions', () => {
it('shows geo block bottom sheet when Close is pressed (geo-restricted user)', async () => {
renderPerpsMarketDetailsView();
diff --git a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx
--- a/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx
+++ b/app/components/UI/Perps/Views/PerpsMarketListView/PerpsMarketListView.view.test.tsx
@@ -38,7 +38,8 @@
const marketDataWithCategories = [cryptoMarket, commodityMarket];
describe('PerpsMarketListView', () => {
- describe('Bug regression: 25571', () => {
+ // eslint-disable-next-line @metamask/design-tokens/color-no-hex
+ describe('Bug regression: #25571', () => {
it('renders market list header and list with default state (no category filtering)', async () => {
renderPerpsMarketListView();
diff --git a/app/components/UI/Perps/services/PerpsConnectionManager.test.ts b/app/components/UI/Perps/services/PerpsConnectionManager.test.ts
--- a/app/components/UI/Perps/services/PerpsConnectionManager.test.ts
+++ b/app/components/UI/Perps/services/PerpsConnectionManager.test.ts
@@ -867,7 +867,8 @@
});
});
- describe('DEX Abstraction Cache Clearing (PR 25334)', () => {
+ // eslint-disable-next-line @metamask/design-tokens/color-no-hex
+ describe('DEX Abstraction Cache Clearing (PR #25334)', () => {
beforeEach(() => {
jest.clearAllMocks();
});
@@ -972,7 +973,8 @@
describe('foreground reconnection — single reconnection flow', () => {
it('PerpsConnectionManager has no AppState listener — only the hook triggers foreground reconnect', () => {
- // This test documents the fix for the race condition introduced by PR 26780.
+ // eslint-disable-next-line @metamask/design-tokens/color-no-hex
+ // This test documents the fix for the race condition introduced by PR #26780.
// Previously, PerpsConnectionManager registered its own AppState listener in
// setupStateMonitoring(), which competed with usePerpsConnectionLifecycle hook.
//
app/components/UI/Perps/Views/PerpsMarketDetailsView/PerpsMarketDetailsView.view.test.tsx
Show resolved
Hide resolved
|
Description
This PR splits out the
app/components/UI/Perpsportion of the color-no-hex lint migration from #26651 into its own reviewable batch.The change applies the same test-only updates from the original PR for Perps files, including replacing hardcoded hex usage in tests and aligning theme mocks to shared
mockThemepatterns where applicable.Changelog
CHANGELOG entry: null
Related issues
Fixes:
Manual testing steps
Commands used:
yarn jest --watchman=false app/components/UI/Perps/Views/PerpsTPSLView/PerpsTPSLView.test.tsx app/components/UI/Perps/components/PerpsLeverageBottomSheet/PerpsLeverageBottomSheet.test.tsx app/components/UI/Perps/components/PerpsLimitPriceBottomSheet/PerpsLimitPriceBottomSheet.test.tsx app/components/UI/Perps/components/PerpsPositionCard/PerpsPositionCard.test.tsx --runInBandyarn jest --watchman=false app/components/UI/Perps/utils/transactionDetailStyles.test.ts --runInBandyarn eslint app/components/UI/Perps --max-warnings=0(blocked locally by missing rule definition)Screenshots/Recordings
Before
N/A (test-only changes)
After
N/A (test-only changes)
Pre-merge author checklist
Pre-merge reviewer checklist
Note
Low Risk
Primarily test refactors plus an ESLint override to enforce
color-no-hexinapp/components/UI/Perps; main risk is new lint enforcement causing CI/local lint failures if any remaining hex usage was missed.Overview
Adds
app/components/UI/Perps/**/*to the ESLint override that errors on@metamask/design-tokens/color-no-hex.Updates Perps unit/view tests to comply by removing hardcoded hex colors and
#-prefixed bug/PR strings, standardizing theme/style mocks to use the sharedmockTheme(and in a few cases calling real style functions) so assertions and mocked styles reference theme tokens instead of literal hex values.Written by Cursor Bugbot for commit bdc53b5. This will update automatically on new commits. Configure here.