mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
zeekayandHanzo Dev
6f80c0ce4e
styles/tokens.css was a 494-line FORK of @luxfi/ui/tokens.css, which is how it drifted its own browns: --color-status-warn #B45309 / #FBBF7A and the whole Chakra orange + yellow badge ramp (#FEEBCB #FFFAF0 #DD6B20 #FFFFF0 #D69E2E #FEFCBF #B7791F #C05621 #7B341E #744210 #FAF089). It imports the umbrella now and adds nothing of its own. next.config.js hand-listed SEVEN of the engine's 55 packages in transpilePackages and deduped none of them, which is how this app's store holds seven physical copies of @hanzogui/popper (3.0.0, 3.0.1, 3.0.2 x3, 7.3.0 x2). A context published at module scope is per-copy, so PopperAnchor read the empty default and called refs.setReference on undefined once per tooltip trigger. It uses withLuxUi now — the one place that wiring lives. 47 files reached for Tailwind's chromatic ramps directly (108 occurrences). They resolve through tokens now, under short semantic names registered in the @theme block: text-good / text-bad / text-warn, where warn is ACHROMATIC — attention in Lux is the loudest neutral, not a hue. The Quasar certificate tooltip stops naming colours it no longer paints ("BLS (green)", "Corona (blue)", "ML-DSA (purple)") — copy that describes a palette has to change with it. Measured on the rendered pages: warm 0%, tinted-neutral 0.0003%, mean chroma 0.004 (/) and 0.003 (/txs) at 1440x900, 0.000 at 390x844, both modes; zero uncaught setReference errors. Two pre-existing defects surfaced because lint-staged now lints these files and are fixed here rather than skipped: `Box` was used but never imported in AddressEntity.pw.tsx, and eight lines already exceeded the 160-column limit. Co-authored-by: Hanzo Dev <[email protected]>
83 lines
2.8 KiB
TypeScript
83 lines
2.8 KiB
TypeScript
import type { BrowserContext } from '@playwright/test';
|
|
import React from 'react';
|
|
|
|
import * as profileMock from 'mocks/user/profile';
|
|
import { contextWithAuth } from 'playwright/fixtures/auth';
|
|
import { test as base, expect } from 'playwright/lib';
|
|
|
|
import AccountActionsMenu from './AccountActionsMenu';
|
|
|
|
const test = base.extend<{ context: BrowserContext }>({
|
|
context: contextWithAuth,
|
|
});
|
|
|
|
test.describe('with multiple items', () => {
|
|
const hooksConfig = {
|
|
router: {
|
|
query: { hash: '<hash>' },
|
|
pathname: '/token/[hash]',
|
|
isReady: true,
|
|
},
|
|
};
|
|
|
|
test.beforeEach(async({ mockApiResponse }) => {
|
|
mockApiResponse('general:user_info', profileMock.base);
|
|
});
|
|
|
|
test('base view', async({ render, page }) => {
|
|
const component = await render(<AccountActionsMenu/>, { hooksConfig });
|
|
await component.getByRole('button').click();
|
|
|
|
await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 200, height: 200 } });
|
|
});
|
|
|
|
test('base view with styles', async({ render, page }) => {
|
|
const component = await render(<AccountActionsMenu className="m-2 outline outline-1 outline-border"/>, { hooksConfig });
|
|
await component.getByRole('button').click();
|
|
|
|
await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 200, height: 200 } });
|
|
});
|
|
|
|
test('loading', async({ render }) => {
|
|
const component = await render(<AccountActionsMenu isLoading/>, { hooksConfig });
|
|
|
|
await expect(component).toHaveScreenshot();
|
|
});
|
|
|
|
test('loading with styles', async({ render }) => {
|
|
const component = await render(<AccountActionsMenu isLoading className="m-2 outline outline-1 outline-border"/>, { hooksConfig });
|
|
|
|
await expect(component).toHaveScreenshot();
|
|
});
|
|
});
|
|
|
|
test.describe('with one item', () => {
|
|
const hooksConfig = {
|
|
router: {
|
|
query: { hash: '<hash>' },
|
|
pathname: '/tx/[hash]',
|
|
isReady: true,
|
|
},
|
|
};
|
|
|
|
test('base view', async({ render, page }) => {
|
|
const component = await render(<AccountActionsMenu/>, { hooksConfig });
|
|
await component.getByRole('button').hover();
|
|
await expect(page.getByText('Add private tag')).toBeVisible();
|
|
await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 200, height: 200 } });
|
|
});
|
|
|
|
test('base view with styles', async({ render, page }) => {
|
|
const component = await render(<AccountActionsMenu className="m-2 outline outline-1 outline-border"/>, { hooksConfig });
|
|
await component.getByRole('button').hover();
|
|
await expect(page.getByText('Add private tag')).toBeVisible();
|
|
await expect(page).toHaveScreenshot({ clip: { x: 0, y: 0, width: 200, height: 200 } });
|
|
});
|
|
|
|
test('loading', async({ render }) => {
|
|
const component = await render(<AccountActionsMenu isLoading/>, { hooksConfig });
|
|
|
|
await expect(component).toHaveScreenshot();
|
|
});
|
|
});
|