Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat(ui): show all failed tasks in report #685

Merged
merged 6 commits into from Feb 5, 2022
Merged

feat(ui): show all failed tasks in report #685

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
e93dda5
feat(ui): show all failed tasks in report
DerYeger Feb 5, 2022
b6ef51c
feat(ui): indent report for nested failed tasks
DerYeger Feb 5, 2022
31021a7
fix(ui): make report errors scrollable
DerYeger Feb 5, 2022
8f9274f
fix(ui): improve task error scrollbars
DerYeger Feb 5, 2022
daa2ac4
fix(ui): make task error scrollbar track rounded
DerYeger Feb 5, 2022
c51a98d
fix(ui): split css rules
DerYeger Feb 5, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
31 changes: 26 additions & 5 deletions packages/ui/client/components/views/ViewReport.vue
View file
Open in desktop
@@ -1,12 +1,25 @@
<script setup lang="ts">
import type { File } from '#types'
import type { File, Task } from '#types'
import { config } from '~/composables/client'

const props = defineProps<{
file?: File
}>()

const failed = computed(() => props.file?.tasks.filter(i => i.result?.state === 'fail') || [])
type LeveledTask = Task & {
level: number
}

function collectFailed(task: Task, level: number): LeveledTask[] {
if (task.result?.state !== 'fail') return []

if (task.type === 'test')
return [{ ...task, level }]
else
return [{ ...task, level }, ...task.tasks.flatMap(t => collectFailed(t, level + 1))]
}

const failed = computed(() => props.file?.tasks.flatMap(t => collectFailed(t, 0)) || [])

function relative(p: string) {
if (p.startsWith(config.value.root))
Expand All @@ -19,10 +32,9 @@ function relative(p: string) {
<div h-full class="scrolls">
<template v-if="failed.length">
<div v-for="task of failed" :key="task.id">
<div bg="red-500/10" text="red-500 sm" p="x3 y2" m-2 rounded>
<div bg="red-500/10" text="red-500 sm" p="x3 y2" m-2 rounded :style="{ 'margin-left': `${2 * task.level + 0.5}rem`}">
{{ task.name }}

<div v-if="task.result?.error">
<div v-if="task.result?.error" class="scrolls scrolls-rounded task-error">
<pre><b>{{ task.result.error.name || task.result.error.nameStr }}</b>: {{ task.result.error.message }}</pre>
<pre v-for="stack, i of task.result.error.stacks || []" :key="i" op80> - {{ relative(stack.file) }}:{{ stack.line }}:{{ stack.column }}</pre>
</div>
Expand All @@ -36,3 +48,12 @@ function relative(p: string) {
</template>
</div>
</template>

<style scoped>
.task-error {
--cm-ttc-c-thumb: #CCC;
}
html.dark .task-error {
--cm-ttc-c-thumb: #444;
}
</style>
8 changes: 6 additions & 2 deletions packages/ui/client/styles/main.css
View file
Open in desktop
Expand Up @@ -146,9 +146,13 @@ html.dark {
.CodeMirror-scroll::-webkit-scrollbar-thumb,
.scrolls::-webkit-scrollbar-thumb {
background-color: var(--cm-ttc-c-thumb);
border-radius: 3px;
border: 2px solid var(--cm-ttc-c-thumb);
}
.CodeMirror-scroll::-webkit-scrollbar-thumb,
.scrolls::-webkit-scrollbar-thumb,
.scrolls-rounded::-webkit-scrollbar-track {
border-radius: 3px;
}
.CodeMirror-scroll::-webkit-scrollbar-corner,
.scrolls::-webkit-scrollbar-corner {
background-color: var(--cm-ttc-c-track);
Expand Down Expand Up @@ -179,4 +183,4 @@ html.dark {

.v-popper__popper .v-popper__arrow-outer {
border-color: var(--background-color);
}
}