fix(polish): align Compose button label with sidebar nav

- HomeScreen header button: 'Compose note' → 'Compose' (matches sidebar)
- Updated tests to use exact name match and scoped queries to avoid
  matching the sidebar nav button
This commit is contained in:
Avi 2026-09-01 11:27:23 -05:00
commit ee13d47aeb
3 changed files with 5 additions and 4 deletions

View file

@ -72,7 +72,7 @@ export function HomeScreen({ onNavigate, onCreateProfile }: HomeScreenProps) {
</div> </div>
<Button variant="primary" onClick={() => onNavigate('compose')}> <Button variant="primary" onClick={() => onNavigate('compose')}>
<Icon name="edit" size={18} /> <Icon name="edit" size={18} />
Compose note Compose
</Button> </Button>
</header> </header>

View file

@ -30,7 +30,7 @@ describe('HomeScreen', () => {
expect(within(identityCard).getByText('Alice')).toBeInTheDocument(); expect(within(identityCard).getByText('Alice')).toBeInTheDocument();
expect(within(identityCard).getByText(/npub1alice\.\.\./)).toBeInTheDocument(); expect(within(identityCard).getByText(/npub1alice\.\.\./)).toBeInTheDocument();
const compose = screen.getByRole('button', { name: /Compose note/i }); const compose = screen.getByRole('button', { name: 'Compose' });
await userEvent.setup().click(compose); await userEvent.setup().click(compose);
expect(onNavigate).toHaveBeenCalledWith('compose'); expect(onNavigate).toHaveBeenCalledWith('compose');
}); });

View file

@ -1,4 +1,4 @@
import { render, screen } from '@testing-library/react'; import { render, screen, within } from '@testing-library/react';
import userEvent from '@testing-library/user-event'; import userEvent from '@testing-library/user-event';
import App from '../App'; import App from '../App';
import { createFakeBackend, installFakeBackend } from './fakeBackend'; import { createFakeBackend, installFakeBackend } from './fakeBackend';
@ -13,7 +13,8 @@ describe('publication flow across screens', () => {
await screen.findByRole('heading', { name: 'Home' }); await screen.findByRole('heading', { name: 'Home' });
await user.click(screen.getByRole('button', { name: /Compose note/i })); const main = screen.getByRole('main');
await user.click(within(main).getByRole('button', { name: 'Compose' }));
await screen.findByRole('heading', { name: 'Compose' }); await screen.findByRole('heading', { name: 'Compose' });
await user.type(screen.getByLabelText('Note content'), 'Hello from the flow test'); await user.type(screen.getByLabelText('Note content'), 'Hello from the flow test');