foreman-tasks 13.0.0 → 13.1.0

data/webpack/ForemanTasks/Components/TaskDetails/Components/__tests__/TaskButtons.test.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import '@testing-library/jest-dom';
 import { TaskButtons } from '../TaskButtons';
 
@@ -16,29 +17,42 @@ const defaultProps = {
   setForceUnlockModalOpen,
 };
 
+const openTaskActionsMenu = async () => {
+  await act(async () => {
+    fireEvent.click(screen.getByRole('button', { name: /^task actions$/i }));
+    await new Promise(resolve => setTimeout(resolve, 0));
+  });
+
+  await waitFor(() => {
+    expect(screen.getByRole('menu')).toBeInTheDocument();
+  });
+};
+
 describe('TaskButtons', () => {
   beforeEach(() => {
     jest.clearAllMocks();
   });
 
   describe('rendering', () => {
-    it('renders reload button with correct text when taskReload is false', () => {
+    it('shows start auto-reloading in overflow when taskReload is false', async () => {
       render(<TaskButtons {...defaultProps} taskReload={false} />);
+      await openTaskActionsMenu();
       expect(
-        screen.getByRole('button', { name: /start auto-reloading/i })
+        screen.getByRole('menuitem', { name: /start auto-reloading/i })
       ).toBeInTheDocument();
       expect(
-        screen.queryByRole('button', { name: /stop auto-reloading/i })
+        screen.queryByRole('menuitem', { name: /stop auto-reloading/i })
       ).not.toBeInTheDocument();
     });
 
-    it('renders reload button with correct text when taskReload is true', () => {
+    it('shows stop auto-reloading in overflow when taskReload is true', async () => {
       render(<TaskButtons {...defaultProps} taskReload />);
+      await openTaskActionsMenu();
       expect(
-        screen.getByRole('button', { name: /stop auto-reloading/i })
+        screen.getByRole('menuitem', { name: /stop auto-reloading/i })
       ).toBeInTheDocument();
       expect(
-        screen.queryByRole('button', { name: /start auto-reloading/i })
+        screen.queryByRole('menuitem', { name: /start auto-reloading/i })
       ).not.toBeInTheDocument();
     });
 
@@ -54,15 +68,21 @@ describe('TaskButtons', () => {
       expect(dynflowLink).toHaveAttribute('target', '_blank');
     });
 
-    it('disables dynflow console link when dynflowEnableConsole is false', () => {
-      render(<TaskButtons {...defaultProps} dynflowEnableConsole={false} />);
+    it('marks dynflow console link disabled when dynflowEnableConsole is false', () => {
+      render(
+        <TaskButtons
+          {...defaultProps}
+          dynflowEnableConsole={false}
+          externalId="ext-id"
+        />
+      );
       const dynflowLink = screen.getByRole('link', {
         name: /dynflow console/i,
       });
-      expect(dynflowLink).not.toBeDisabled();
+      expect(dynflowLink).toHaveAttribute('aria-disabled', 'true');
     });
 
-    it('enables dynflow console link when dynflowEnableConsole is true', () => {
+    it('does not disable dynflow console link when dynflowEnableConsole is true', () => {
       render(
         <TaskButtons
           {...defaultProps}
@@ -73,18 +93,20 @@ describe('TaskButtons', () => {
       const dynflowLink = screen.getByRole('link', {
         name: /dynflow console/i,
       });
-      expect(dynflowLink).not.toBeDisabled();
+      expect(dynflowLink).not.toHaveAttribute('aria-disabled', 'true');
     });
 
-    it('disables resume and cancel buttons when canEdit is false', () => {
+    it('disables resume overflow item and cancel button when canEdit is false', async () => {
       render(<TaskButtons {...defaultProps} canEdit={false} />);
-      expect(screen.getByRole('button', { name: /resume/i })).toBeDisabled();
       expect(screen.getByRole('button', { name: /cancel/i })).toBeDisabled();
+      await openTaskActionsMenu();
+      expect(screen.getByRole('menuitem', { name: /^resume$/i })).toBeDisabled();
     });
 
-    it('disables resume button when resumable is false', () => {
+    it('disables resume overflow item when resumable is false', async () => {
       render(<TaskButtons {...defaultProps} canEdit resumable={false} />);
-      expect(screen.getByRole('button', { name: /resume/i })).toBeDisabled();
+      await openTaskActionsMenu();
+      expect(screen.getByRole('menuitem', { name: /^resume$/i })).toBeDisabled();
     });
 
     it('disables cancel button when cancellable is false', () => {
@@ -92,66 +114,63 @@ describe('TaskButtons', () => {
       expect(screen.getByRole('button', { name: /cancel/i })).toBeDisabled();
     });
 
-    it('disables unlock button when state is not paused', () => {
+    it('disables unlock overflow item when state is not paused', async () => {
       render(<TaskButtons {...defaultProps} canEdit state="running" />);
-      expect(screen.getByRole('button', { name: /^unlock$/i })).toBeDisabled();
+      await openTaskActionsMenu();
+      expect(screen.getByRole('menuitem', { name: /^unlock$/i })).toBeDisabled();
     });
 
-    it('enables unlock button when state is paused and canEdit is true', () => {
+    it('enables unlock overflow item when state is paused and canEdit is true', async () => {
       render(<TaskButtons {...defaultProps} canEdit state="paused" />);
-      expect(
-        screen.getByRole('button', { name: /^unlock$/i })
-      ).not.toBeDisabled();
+      await openTaskActionsMenu();
+      expect(screen.getByRole('menuitem', { name: /^unlock$/i })).not.toBeDisabled();
     });
 
-    it('disables force unlock button when state is stopped', () => {
+    it('disables force unlock overflow item when state is stopped', async () => {
       render(<TaskButtons {...defaultProps} canEdit state="stopped" />);
-      expect(
-        screen.getByRole('button', { name: /force unlock/i })
-      ).toBeDisabled();
+      await openTaskActionsMenu();
+      expect(screen.getByRole('menuitem', { name: /force unlock/i })).toBeDisabled();
     });
 
-    it('enables force unlock button when state is not stopped and canEdit is true', () => {
+    it('enables force unlock overflow item when state is not stopped and canEdit is true', async () => {
       render(<TaskButtons {...defaultProps} canEdit state="running" />);
-      expect(
-        screen.getByRole('button', { name: /force unlock/i })
-      ).not.toBeDisabled();
+      await openTaskActionsMenu();
+      expect(screen.getByRole('menuitem', { name: /force unlock/i })).not.toBeDisabled();
     });
 
-    it('renders parent task button when parentTask is provided', () => {
+    it('includes parent task overflow link when parentTask is provided', async () => {
       render(<TaskButtons {...defaultProps} parentTask="parent-123" />);
-      const parentButton = screen.getByRole('link', { name: /parent task/i });
-      expect(parentButton).toBeInTheDocument();
-      expect(parentButton).toHaveAttribute(
-        'href',
-        '/foreman_tasks/tasks/parent-123'
-      );
+      await openTaskActionsMenu();
+      expect(
+        screen.getByRole('menuitem', { name: /parent task/i })
+      ).toHaveAttribute('href', '/foreman_tasks/tasks/parent-123');
     });
 
-    it('does not render parent task button when parentTask is not provided', () => {
+    it('does not include parent overflow item when parentTask is not provided', async () => {
       render(<TaskButtons {...defaultProps} />);
+      await openTaskActionsMenu();
       expect(
-        screen.queryByRole('link', { name: /parent task/i })
+        screen.queryByRole('menuitem', { name: /parent task/i })
       ).not.toBeInTheDocument();
     });
 
-    it('renders sub tasks button when hasSubTasks is true', () => {
+    it('includes sub tasks overflow link when hasSubTasks is true', async () => {
       render(<TaskButtons {...defaultProps} hasSubTasks id="task-123" />);
-      const subTasksButton = screen.getByRole('link', { name: /sub tasks/i });
-      expect(subTasksButton).toBeInTheDocument();
-      expect(subTasksButton).toHaveAttribute(
-        'href',
-        '/foreman_tasks/tasks/task-123/sub_tasks'
-      );
+      await openTaskActionsMenu();
+      expect(
+        screen.getByRole('menuitem', { name: /sub tasks/i })
+      ).toHaveAttribute('href', '/foreman_tasks/tasks/task-123/sub_tasks');
     });
 
-    it('does not render sub tasks button when hasSubTasks is false', () => {
+    it('does not include sub tasks overflow item when hasSubTasks is false', async () => {
       render(<TaskButtons {...defaultProps} hasSubTasks={false} />);
+      await openTaskActionsMenu();
       expect(
-        screen.queryByRole('link', { name: /sub tasks/i })
+        screen.queryByRole('menuitem', { name: /sub tasks/i })
       ).not.toBeInTheDocument();
     });
   });
+
   describe('user interactions', () => {
     const cancelTaskRequest = jest.fn();
     const resumeTaskRequest = jest.fn();
@@ -174,44 +193,41 @@ describe('TaskButtons', () => {
       state: 'paused',
     };
 
-    it('calls taskProgressToggle when reload button is clicked', () => {
+    it('calls taskProgressToggle when overflow reload item is clicked', async () => {
       render(<TaskButtons {...props} />);
-      const reloadButton = screen.getByRole('button', {
-        name: /start auto-reloading/i,
-      });
-      fireEvent.click(reloadButton);
+      await openTaskActionsMenu();
+      fireEvent.click(
+        screen.getByRole('menuitem', { name: /start auto-reloading/i })
+      );
       expect(taskProgressToggle).toHaveBeenCalled();
     });
 
-    it('calls taskReloadStart and resumeTaskRequest when resume button is clicked', () => {
+    it('calls taskReloadStart and resumeTaskRequest when resume menu item is clicked', async () => {
       render(<TaskButtons {...props} />);
-      const resumeButton = screen.getByRole('button', { name: /resume/i });
-      fireEvent.click(resumeButton);
+      await openTaskActionsMenu();
+      fireEvent.click(screen.getByRole('menuitem', { name: /^resume$/i }));
       expect(taskReloadStart).toHaveBeenCalledWith(id);
       expect(resumeTaskRequest).toHaveBeenCalledWith(id, action);
     });
 
-    it('calls taskReloadStart and cancelTaskRequest when cancel button is clicked', () => {
+    it('calls taskReloadStart and cancelTaskRequest when cancel button is clicked', async () => {
       render(<TaskButtons {...props} />);
-      const cancelButton = screen.getByRole('button', { name: /cancel/i });
-      fireEvent.click(cancelButton);
+      await userEvent.click(screen.getByRole('button', { name: /cancel/i }));
       expect(taskReloadStart).toHaveBeenCalledWith(id);
       expect(cancelTaskRequest).toHaveBeenCalledWith(id, action);
     });
 
-    it('calls setUnlockModalOpen when unlock button is clicked', () => {
+    it('calls setUnlockModalOpen when unlock menu item is clicked', async () => {
       render(<TaskButtons {...props} />);
-      const unlockButton = screen.getByRole('button', { name: /^unlock$/i });
-      fireEvent.click(unlockButton);
+      await openTaskActionsMenu();
+      fireEvent.click(screen.getByRole('menuitem', { name: /^unlock$/i }));
       expect(setUnlockModalOpen).toHaveBeenCalledWith(true);
     });
 
-    it('calls setForceUnlockModalOpen when force unlock button is clicked', () => {
+    it('calls setForceUnlockModalOpen when force unlock menu item is clicked', async () => {
       render(<TaskButtons {...props} />);
-      const forceUnlockButton = screen.getByRole('button', {
-        name: /force unlock/i,
-      });
-      fireEvent.click(forceUnlockButton);
+      await openTaskActionsMenu();
+      fireEvent.click(screen.getByRole('menuitem', { name: /force unlock/i }));
       expect(setForceUnlockModalOpen).toHaveBeenCalledWith(true);
     });
   });

data/webpack/ForemanTasks/Components/TaskDetails/Components/__tests__/TaskHelper.test.js

@@ -1,4 +1,9 @@
-import { durationInWords } from '../TaskHelper';
+import {
+  durationInWords,
+  formatTaskDuration,
+  isDelayed,
+  parseUsernameLinkHref,
+} from '../TaskHelper';
 
 describe('durationInWords', () => {
   it('should work for seconds', () => {
@@ -20,3 +25,115 @@ describe('durationInWords', () => {
     });
   });
 });
+
+describe('isDelayed', () => {
+  it('returns false when startAt is missing', () => {
+    expect(isDelayed({ startAt: null, startedAt: '2020-01-02' })).toBe(false);
+    expect(isDelayed({ startAt: '', startedAt: '2020-01-02' })).toBe(false);
+    expect(isDelayed({ startedAt: '2020-01-02' })).toBe(false);
+  });
+
+  it('returns false when startedAt is missing', () => {
+    expect(isDelayed({ startAt: '2020-01-01', startedAt: null })).toBe(false);
+    expect(isDelayed({ startAt: '2020-01-01', startedAt: '' })).toBe(false);
+    expect(isDelayed({ startAt: '2020-01-01' })).toBe(false);
+  });
+
+  it('returns false when either date is invalid', () => {
+    expect(
+      isDelayed({ startAt: 'not-a-date', startedAt: '2020-01-02' })
+    ).toBe(false);
+    expect(
+      isDelayed({ startAt: '2020-01-01', startedAt: 'not-a-date' })
+    ).toBe(false);
+  });
+
+  it('returns false when startAt and startedAt are the same instant', () => {
+    expect(
+      isDelayed({ startAt: '2020-01-01T10:00:00', startedAt: '2020-01-01T10:00:00' })
+    ).toBe(false);
+  });
+
+  it('ignores millisecond differences when comparing startAt and startedAt', () => {
+    expect(
+      isDelayed({
+        startAt: '2020-01-01T10:00:00.123',
+        startedAt: '2020-01-01T10:00:00.456',
+      })
+    ).toBe(false);
+  });
+
+  it('returns true when startAt and startedAt differ', () => {
+    expect(
+      isDelayed({ startAt: '2020-01-01', startedAt: '2020-01-02' })
+    ).toBe(true);
+  });
+});
+
+describe('parseUsernameLinkHref', () => {
+  it('returns null for empty or non-string input', () => {
+    expect(parseUsernameLinkHref(null)).toBeNull();
+    expect(parseUsernameLinkHref(undefined)).toBeNull();
+    expect(parseUsernameLinkHref('')).toBeNull();
+    expect(parseUsernameLinkHref(123)).toBeNull();
+  });
+
+  it('extracts href from double-quoted attribute values', () => {
+    expect(
+      parseUsernameLinkHref('<a href="/users/bob">Bob</a>')
+    ).toBe('/users/bob');
+  });
+
+  it('extracts href from single-quoted attribute values', () => {
+    expect(
+      parseUsernameLinkHref("<a href='/users/bob'>Bob</a>")
+    ).toBe('/users/bob');
+  });
+
+  it('returns null when no href attribute is present', () => {
+    expect(parseUsernameLinkHref('<a>Bob</a>')).toBeNull();
+  });
+});
+
+describe('formatTaskDuration', () => {
+  it('returns N/A when the task is not stopped', () => {
+    expect(
+      formatTaskDuration('2020-01-01T10:00:00', '2020-01-01T10:00:01', 'running')
+    ).toBe('N/A');
+  });
+
+  it('returns N/A when start or end time is missing', () => {
+    expect(formatTaskDuration('', '2020-01-01T10:00:01', 'stopped')).toBe(
+      'N/A'
+    );
+    expect(formatTaskDuration('2020-01-01T10:00:00', '', 'stopped')).toBe(
+      'N/A'
+    );
+  });
+
+  it('returns N/A when dates are invalid or end precedes start', () => {
+    expect(
+      formatTaskDuration('not-a-date', '2020-01-01T10:00:01', 'stopped')
+    ).toBe('N/A');
+    expect(
+      formatTaskDuration('2020-01-01T10:00:00', 'not-a-date', 'stopped')
+    ).toBe('N/A');
+    expect(
+      formatTaskDuration(
+        '2020-01-01T10:00:01',
+        '2020-01-01T10:00:00',
+        'stopped'
+      )
+    ).toBe('N/A');
+  });
+
+  it('returns a humanized duration for stopped tasks with valid timestamps', () => {
+    expect(
+      formatTaskDuration(
+        '1/1/1 10:00:00',
+        '1/1/1 10:00:01',
+        'stopped'
+      )
+    ).toBe('1 second');
+  });
+});

data/webpack/ForemanTasks/Components/TaskDetails/Components/__tests__/TaskInfo.test.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import '@testing-library/jest-dom';
 
 jest.mock('foremanReact/components/common/dates/RelativeDateTime', () => {
@@ -10,41 +11,210 @@ jest.mock('foremanReact/components/common/dates/RelativeDateTime', () => {
 });
 
 import TaskInfo from '../TaskInfo';
+import { durationInWords } from '../TaskHelper';
 
 describe('TaskInfo', () => {
-  it('renders default metadata labels when given minimal props', () => {
-    render(<TaskInfo id="test" />);
-    expect(screen.getByText(/name:/i)).toBeInTheDocument();
-    expect(screen.getByText(/start at:/i)).toBeInTheDocument();
-    expect(screen.getByText(/result:/i)).toBeInTheDocument();
+  afterEach(() => {
+    jest.clearAllMocks();
   });
 
-  it('renders task fields and troubleshooting when full props are provided', () => {
+  it('renders overview metadata headings for minimal props', () => {
+    render(<TaskInfo id="tid" />);
+
+    expect(screen.getByText('Result')).toBeInTheDocument();
+    expect(screen.getByText('State')).toBeInTheDocument();
+    expect(screen.getByText('Started at')).toBeInTheDocument();
+    expect(screen.getByText('Duration')).toBeInTheDocument();
+    expect(screen.getByText('Triggered by')).toBeInTheDocument();
+    expect(screen.getByText('Id')).toBeInTheDocument();
+
+    expect(
+      screen.getByRole('button', { name: /show more details/i })
+    ).toBeInTheDocument();
+    expect(screen.getByText('tid')).toBeInTheDocument();
+    expect(screen.getByText(/^Error$/)).toBeInTheDocument();
+  });
+
+  it('shows progress only while task state is not stopped', () => {
+    const props = {
+      id: 'r1',
+      state: 'running',
+      result: 'pending',
+      progress: 42,
+      startedAt: '',
+      usernamePath: '',
+    };
+
+    const { rerender } = render(<TaskInfo {...props} />);
+    expect(screen.getByRole('progressbar')).toBeInTheDocument();
+    expect(screen.getByRole('progressbar')).toHaveAttribute(
+      'aria-valuenow',
+      '42'
+    );
+
+    rerender(<TaskInfo {...props} state="stopped" />);
+    expect(screen.queryByRole('progressbar')).not.toBeInTheDocument();
+  });
+
+  it('expands to show label, execution type, start at, ended at, and external id', async () => {
     render(
       <TaskInfo
-        id="test"
-        startAt="2019-06-17 16:04:09 +0300"
+        id="tid"
         label="Actions::Katello::EventQueue::Monitor"
         action="Monitor Event Queue"
-        username="admin"
+        externalId="ext-42"
+        startAt="2019-06-17 16:04:09 +0300"
         startedAt="2019-06-17 16:04:09 +0300"
-        endedAt={null}
+        endedAt=""
         state="paused"
         result="error"
-        progress={0.5}
-        help={
-          "A paused task represents a process that has not finished properly. Any task in paused state can lead to potential inconsistency and needs to be resolved.\nThe recommended approach is to investigate the error messages below and in 'errors' tab, address the primary cause of the issue and resume the task."
-        }
-        output={{}}
+        progress={1}
+        username="admin"
         usernamePath=""
       />
     );
-    expect(screen.getByText('Monitor Event Queue')).toBeInTheDocument();
-    expect(screen.getByText(/troubleshooting/i)).toBeInTheDocument();
+
+    await userEvent.click(
+      screen.getByRole('button', { name: /show more details/i })
+    );
+
+    expect(screen.getByText('Execution type')).toBeInTheDocument();
+    expect(screen.getByText('Label')).toBeInTheDocument();
+    expect(screen.getByText('Start at')).toBeInTheDocument();
+    expect(screen.getByText('Ended at')).toBeInTheDocument();
+    expect(screen.getByText('External Id')).toBeInTheDocument();
+    expect(
+      screen.getByText('Actions::Katello::EventQueue::Monitor')
+    ).toBeInTheDocument();
+    expect(screen.getByText('ext-42')).toBeInTheDocument();
+    expect(screen.getByText(/^Error$/)).toBeInTheDocument();
+    expect(screen.getAllByText(/^Paused$/).length).toBeGreaterThanOrEqual(1);
+    expect(screen.getByText('1% Complete')).toBeInTheDocument();
+  });
+
+  it('reports delayed execution type when startAt and startedAt differ', async () => {
+    render(
+      <TaskInfo
+        id=""
+        state="stopped"
+        startAt="2020-01-01"
+        startedAt="2020-01-02"
+      />
+    );
+
+    await userEvent.click(
+      screen.getByRole('button', { name: /show more details/i })
+    );
+
+    expect(screen.getByText('Delayed')).toBeInTheDocument();
+  });
+
+  it('reports immediate execution type when startAt is missing', async () => {
+    render(<TaskInfo id="" state="stopped" startedAt="2020-01-02" />);
+
+    await userEvent.click(
+      screen.getByRole('button', { name: /show more details/i })
+    );
+
+    expect(screen.getByText('Immediate')).toBeInTheDocument();
+  });
+
+  it('renders triggered-by link when usernamePath embeds an href', () => {
+    render(
+      <TaskInfo
+        id=""
+        username="bob"
+        usernamePath='<a href="/users/bob">Bob</a>'
+        state=""
+      />
+    );
+
+    const link = screen.getByRole('link', { name: 'bob' });
+    expect(link).toHaveAttribute('href', '/users/bob');
+  });
+
+  it('renders triggered-by link when usernamePath uses single-quoted href', () => {
+    render(
+      <TaskInfo
+        id=""
+        username="bob"
+        usernamePath="<a href='/users/bob'>Bob</a>"
+        state=""
+      />
+    );
+
+    const link = screen.getByRole('link', { name: 'bob' });
+    expect(link).toHaveAttribute('href', '/users/bob');
+  });
+
+  it('formats stop duration when started and ended are valid', () => {
+    const startedAt = '2020-01-01T10:00:00.000Z';
+    const endedAt = '2020-01-01T10:00:45.000Z';
+
+    render(<TaskInfo id="" state="stopped" startedAt={startedAt} endedAt={endedAt} />);
+
     expect(
-      screen.getByText(/a paused task represents a process/i)
+      screen.getByText(durationInWords(startedAt, endedAt).text)
     ).toBeInTheDocument();
-    expect(screen.getByText(/^paused$/)).toBeInTheDocument();
-    expect(screen.getByText(/^error$/)).toBeInTheDocument();
+  });
+
+  it('shows start before deadline when startBefore is set', async () => {
+    render(
+      <TaskInfo
+        id="tid"
+        state="stopped"
+        startAt="2020-01-01"
+        startBefore="2020-01-05"
+      />
+    );
+
+    await userEvent.click(
+      screen.getByRole('button', { name: /show more details/i })
+    );
+
+    expect(screen.getByText('2020-01-01')).toBeInTheDocument();
+    expect(screen.getByText(/before/i)).toBeInTheDocument();
+    expect(screen.getByText('2020-01-05')).toBeInTheDocument();
+  });
+
+  it('does not show start before text when startBefore is missing', async () => {
+    render(<TaskInfo id="tid" state="stopped" startAt="2020-01-01" />);
+
+    await userEvent.click(
+      screen.getByRole('button', { name: /show more details/i })
+    );
+
+    expect(screen.getByText('2020-01-01')).toBeInTheDocument();
+    expect(screen.queryByText(/before/i)).not.toBeInTheDocument();
+  });
+
+  it('shows troubleshooting help when expanded and help is provided', async () => {
+    render(
+      <TaskInfo
+        id="tid"
+        state="paused"
+        help="Investigate the error and <a href='/docs'>troubleshooting documentation</a>."
+      />
+    );
+
+    await userEvent.click(
+      screen.getByRole('button', { name: /show more details/i })
+    );
+
+    expect(screen.getByText('Troubleshooting')).toBeInTheDocument();
+    expect(screen.getByText(/Investigate the error/i)).toBeInTheDocument();
+    expect(
+      screen.getByRole('link', { name: 'troubleshooting documentation' })
+    ).toHaveAttribute('href', '/docs');
+  });
+
+  it('does not show troubleshooting help when help is empty', async () => {
+    render(<TaskInfo id="tid" state="paused" help="" />);
+
+    await userEvent.click(
+      screen.getByRole('button', { name: /show more details/i })
+    );
+
+    expect(screen.queryByText('Troubleshooting')).not.toBeInTheDocument();
   });
 });