STYLES

Author: philippfromme

lib/components/Output/Output.jsx

@@ -445,7 +445,6 @@ function CollapsibleSection({ title, tooltip, defaultOpen = true, isExecuting =
         ) : (
           <span className="output__collapsible-title">{ title }</span>
         ) }
-        { isExecuting && <span className="output__collapsible-pulse-dot" /> }
         {
           isOpen ? <ChevronDown size={ 16 } className="output__chevron output__chevron--open" />
             : <ChevronRight size={ 16 } className="output__chevron" />

lib/components/TaskTesting/TaskTesting.js

@@ -10,11 +10,12 @@ import {
 import {
   CheckmarkFilled,
   Cursor_1 as Cursor,
+  Erase,
   ErrorFilled,
+  Hourglass,
   PlayFilledAlt,
-  Reset,
-  StopFilledAlt,
-  Settings
+  Settings,
+  StopFilledAlt
 } from '@carbon/icons-react';
 
 import classNames from 'classnames';
@@ -597,7 +598,7 @@ export default function TaskTesting({
                   kind="ghost"
                   size="sm"
                   hasIconOnly
-                  renderIcon={ Reset }
+                  renderIcon={ Erase }
                   iconDescription="Clear output"
                   onClick={ handleResetOutput }
                 />
@@ -675,6 +676,10 @@ function getHeaderStateClass({ isTaskExecuting, isConnectionConfigured, output }
 }
 
 function HeaderStatusIcon({ isTaskExecuting, isConnectionConfigured, output }) {
+  if (isTaskExecuting) {
+    return <Hourglass />;
+  }
+
   if (output?.error || output?.incident || !isConnectionConfigured) {
     return <ErrorFilled size={ 16 } className="task-testing__status-icon--error" />;
   }
@@ -699,6 +704,10 @@ function HeaderStatusText({ isTaskExecuting, isConnectionConfigured, taskExecuti
     return 'Connection error';
   }
 
+  if (isTaskExecuting) {
+    return 'Executing...';
+  }
+
   if (output) {
     if (output.error) {
       return output.error.message ? `Error: ${output.error.message}` : 'Error';