Render result tracebacks as stdout

awx/ui_next/src/screens/Job/JobOutput/JobOutput.jsx

@@ -225,7 +225,7 @@ class JobOutput extends Component {
     this.state = {
       contentError: null,
       deletionError: null,
-      hasContentLoading: true,
+      hasContentLoading: !props?.job?.result_traceback,
       results: {},
       currentlyLoading: [],
       remoteRowCount: 0,
@@ -241,6 +241,7 @@ class JobOutput extends Component {
 
     this._isMounted = false;
     this.loadJobEvents = this.loadJobEvents.bind(this);
+    this.loadTracebackEvents = this.loadTracebackEvents.bind(this);
     this.handleDeleteJob = this.handleDeleteJob.bind(this);
     this.rowRenderer = this.rowRenderer.bind(this);
     this.handleHostEventClick = this.handleHostEventClick.bind(this);
@@ -261,6 +262,8 @@ class JobOutput extends Component {
     this._isMounted = true;
     this.loadJobEvents();
 
+    if (job.result_traceback) return;
+
     connectJobSocket(job, data => {
       if (data.counter && data.counter > this.jobSocketCounter) {
         this.jobSocketCounter = data.counter;
@@ -308,8 +311,32 @@ class JobOutput extends Component {
     }
   }
 
+  loadTracebackEvents() {
+    // When a job has traceback results, render it as a job event
+    // with the traceback as the stdout text
+    const { job } = this.props;
+    const remoteRowCount = 1;
+    const results = [
+      {
+        counter: -1,
+        created: null,
+        event: null,
+        type: null,
+        stdout: job?.result_traceback || '',
+        start_line: 0,
+      },
+    ];
+    this._isMounted && this.setState({ results, remoteRowCount });
+  }
+
   async loadJobEvents() {
     const { job, type } = this.props;
+    if (job.result_traceback) {
+      // Jobs with tracebacks don't have actual job events to show,
+      // so just render the traceback as stdout
+      this.loadTracebackEvents();
+      return;
+    }
 
     const loadRange = range(1, 50);
     this._isMounted &&