feat: make experiment control buttons prettier

Use actual icons for the play, pause, skip, etc. buttons.
This commit is contained in:
Twirre Meulenbelt
2026-02-04 11:00:14 +01:00
parent b826b8ae47
commit 8fa2adc973
7 changed files with 59 additions and 25 deletions

View File

@@ -122,8 +122,8 @@ describe('MonitoringPage', () => {
describe('Control Buttons', () => {
test('Pause calls API and updates UI', async () => {
render(<MonitoringPage />);
const pauseBtn = screen.getByText('❚❚');
const pauseBtn = screen.getByRole('button', { name: /pause/i });
await act(async () => {
fireEvent.click(pauseBtn);
});
@@ -134,8 +134,8 @@ describe('MonitoringPage', () => {
test('Play calls API and updates UI', async () => {
render(<MonitoringPage />);
const playBtn = screen.getByText('▶');
const playBtn = screen.getByRole('button', { name: /play/i });
await act(async () => {
fireEvent.click(playBtn);
});
@@ -146,35 +146,35 @@ describe('MonitoringPage', () => {
test('Next Phase calls API', async () => {
render(<MonitoringPage />);
await act(async () => {
fireEvent.click(screen.getByText('⏭'));
fireEvent.click(screen.getByRole('button', { name: /next phase/i }));
});
expect(MonitoringAPI.nextPhase).toHaveBeenCalled();
});
test('Reset Experiment calls logic and resets state', async () => {
render(<MonitoringPage />);
// Mock graph reducer return
(VisProg.graphReducer as jest.Mock).mockReturnValue([{ id: 'new-phase' }]);
await act(async () => {
fireEvent.click(screen.getByText('⟲'));
fireEvent.click(screen.getByRole('button', { name: /reset experiment/i }));
});
expect(VisProg.graphReducer).toHaveBeenCalled();
expect(mockSetProgramState).toHaveBeenCalledWith({ phases: [{ id: 'new-phase' }] });
expect(VisProg.runProgram).toHaveBeenCalled();
});
test('Reset Experiment handles errors gracefully', async () => {
const consoleSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
(VisProg.runProgram as jest.Mock).mockRejectedValue(new Error('Fail'));
render(<MonitoringPage />);
await act(async () => {
fireEvent.click(screen.getByText('⟲'));
fireEvent.click(screen.getByRole('button', { name: /reset experiment/i }));
});
expect(consoleSpy).toHaveBeenCalledWith('Failed to reset program:', expect.any(Error));
consoleSpy.mockRestore();
});