diff options
author | Sorin Sbarnea <ssbarnea@redhat.com> | 2020-04-27 14:22:54 +0100 |
---|---|---|
committer | Sorin Sbarnea <ssbarnea@redhat.com> | 2020-06-08 09:44:41 +0100 |
commit | fe030227871110f802698946a89502a725a091a5 (patch) | |
tree | 9715aed874762f4219728f5dd49bd9f53eb60986 /web/src/containers/build/BuildOutput.jsx | |
parent | b79a83f323dae193ddd0c64e5ab2190b3f46b1d7 (diff) | |
download | zuul-fe030227871110f802698946a89502a725a091a5.tar.gz |
Make task errors expandable
Add a 'more/less' button for displaying the unabridged stdout/stderr
in case is longer than the default max_lines.
Move styling from inline to the stylesheet and reuses existing
logging styles.
Change-Id: Ic7f25d3bd1495da143147e1e7d2e1473367d775d
Diffstat (limited to 'web/src/containers/build/BuildOutput.jsx')
-rw-r--r-- | web/src/containers/build/BuildOutput.jsx | 29 |
1 files changed, 24 insertions, 5 deletions
diff --git a/web/src/containers/build/BuildOutput.jsx b/web/src/containers/build/BuildOutput.jsx index 8e25c0cfd..cdd748931 100644 --- a/web/src/containers/build/BuildOutput.jsx +++ b/web/src/containers/build/BuildOutput.jsx @@ -13,6 +13,7 @@ // under the License. import * as React from 'react' +import { Fragment } from 'react' import PropTypes from 'prop-types' import { Panel } from 'react-bootstrap' import { @@ -54,6 +55,7 @@ class BuildOutput extends React.Component { } renderFailedTask (host, task) { + const max_lines = 42 return ( <Panel key={host + task.zuul_log_id}> <Panel.Heading>{host}: {task.name}</Panel.Heading> @@ -71,14 +73,31 @@ class BuildOutput extends React.Component { <pre key="exc" style={{ color: 'red' }}>{task.exception}</pre> )} {task.stdout_lines && task.stdout_lines.length > 0 && ( - <pre key="stdout" style={{ whiteSpace: 'pre-wrap' }} title="stdout"> - {task.stdout_lines.slice(-42).join('\n')} - </pre> + <Fragment> + {task.stdout_lines.length > max_lines && ( + <details className={`${'foldable'} ${'stdout'}`}><summary></summary> + <pre key="stdout" title="stdout"> + {task.stdout_lines.slice(0, -max_lines).join('\n')} + </pre> + </details>)} + <pre key="stdout" title="stdout"> + {task.stdout_lines.slice(-max_lines).join('\n')} + </pre> + </Fragment> )} {task.stderr_lines && task.stderr_lines.length > 0 && ( - <pre key="stderr" style={{whiteSpace: 'pre-wrap', color: 'red'}} title="stderr"> - {task.stderr_lines.slice(-42).join('\n')} + <Fragment> + {task.stderr_lines.length > max_lines && ( + <details className={`${'foldable'} ${'stderr'}`}><summary></summary> + <pre key="stderr" title="stderr"> + {task.stderr_lines.slice(0, -max_lines).join('\n')} + </pre> + </details> + )} + <pre key="stderr" title="stderr"> + {task.stderr_lines.slice(-max_lines).join('\n')} </pre> + </Fragment> )} </Panel.Body> </Panel> |