diff --git a/awx/ui/client/features/output/_index.less b/awx/ui/client/features/output/_index.less index 8d5ac05b31..a4bef87569 100644 --- a/awx/ui/client/features/output/_index.less +++ b/awx/ui/client/features/output/_index.less @@ -79,6 +79,10 @@ &:hover div { background-color: white; } + + &--hidden { + display: none; + } } &-row--clickable { diff --git a/awx/ui/client/features/output/index.controller.js b/awx/ui/client/features/output/index.controller.js index 2f4a3e2575..b9e81caac7 100644 --- a/awx/ui/client/features/output/index.controller.js +++ b/awx/ui/client/features/output/index.controller.js @@ -439,7 +439,7 @@ function togglePanelExpand () { const iconCollapsed = 'fa-angle-right'; const iconExpanded = 'fa-angle-down'; const iconSelector = '.at-Stdout-toggle > i'; -const lineCollapsed = 'hidden'; +const lineCollapsed = 'at-Stdout-row--hidden'; function toggleCollapseAll () { if (scroll.isPaused()) return; @@ -524,11 +524,15 @@ function togglePlayCollapse (uuid) { taskIcons.addClass(iconCollapsed); lines.addClass(lineCollapsed); + + descendants + .map(item => $(`.child-of-${item}`)) + .forEach(line => line.addClass(lineCollapsed)); } descendants .map(item => render.records[item]) - .filter(({ name }) => name === EVENT_START_TASK) + .filter((descRecord) => descRecord && descRecord.name === EVENT_START_TASK) .forEach(rec => { render.records[rec.uuid].isCollapsed = true; }); render.records[uuid].isCollapsed = !isCollapsed; diff --git a/awx/ui/client/features/output/render.service.js b/awx/ui/client/features/output/render.service.js index 0655dd0c71..f50bc27b40 100644 --- a/awx/ui/client/features/output/render.service.js +++ b/awx/ui/client/features/output/render.service.js @@ -204,7 +204,7 @@ function JobRenderService ($q, $compile, $sce, $window, strings) { return { html: '', count: 0 }; } - if (event.uuid && this.records[event.uuid]) { + if (event.uuid && this.records[event.uuid] && !this.records[event.uuid]._isIncomplete) { return { html: '', count: 0 }; } @@ -272,6 +272,9 @@ function JobRenderService ($q, $compile, $sce, $window, strings) { isClickable = true; } + const children = (this.records[event.uuid] && this.records[event.uuid].children) + ? this.records[event.uuid].children : []; + const record = { isClickable, id: event.id, @@ -285,6 +288,7 @@ function JobRenderService ($q, $compile, $sce, $window, strings) { lineCount: lines.length, isCollapsed: this.state.collapseAll, counters: [event.counter], + children }; if (event.parent_uuid) { @@ -307,12 +311,18 @@ function JobRenderService ($q, $compile, $sce, $window, strings) { if (event.parent_uuid) { if (this.records[event.parent_uuid]) { - if (this.records[event.parent_uuid].children && - !this.records[event.parent_uuid].children.includes(event.uuid)) { - this.records[event.parent_uuid].children.push(event.uuid); + if (this.records[event.parent_uuid].children) { + if (!this.records[event.parent_uuid].children.includes(event.uuid)) { + this.records[event.parent_uuid].children.push(event.uuid); + } } else { this.records[event.parent_uuid].children = [event.uuid]; } + } else { + this.records[event.parent_uuid] = { + _isIncomplete: true, + children: [event.uuid] + }; } } } @@ -397,7 +407,7 @@ function JobRenderService ($q, $compile, $sce, $window, strings) { if (record && record.isCollapsed) { if (record.level === 3 || record.level === 0) { - classList += ' hidden'; + classList += ' at-Stdout-row--hidden'; } }