feat: something
This commit is contained in:
Vlad Stan
+250
-83
@@ -774,6 +774,64 @@
|
|||||||
gap: 12px;
|
gap: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.test-type-tabs {
|
||||||
|
margin-top: 8px;
|
||||||
|
border-radius: 18px;
|
||||||
|
background: rgba(22, 32, 40, 0.04);
|
||||||
|
padding: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-type-tabs .q-tab {
|
||||||
|
flex: 1 1 0;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-type-panels {
|
||||||
|
margin-top: 14px;
|
||||||
|
background: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-type-panel {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-case-stack {
|
||||||
|
display: grid;
|
||||||
|
gap: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-case-section {
|
||||||
|
display: grid;
|
||||||
|
gap: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-case-section + .test-case-section {
|
||||||
|
padding-top: 18px;
|
||||||
|
border-top: 1px solid rgba(25, 54, 61, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-case-header {
|
||||||
|
display: flex;
|
||||||
|
gap: 12px;
|
||||||
|
align-items: flex-start;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-case-title {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1rem;
|
||||||
|
line-height: 1.25;
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
|
.test-case-subtitle {
|
||||||
|
margin-top: 4px;
|
||||||
|
color: var(--studio-muted);
|
||||||
|
font-size: 0.84rem;
|
||||||
|
line-height: 1.45;
|
||||||
|
}
|
||||||
|
|
||||||
.mock-card {
|
.mock-card {
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
border: 1px solid rgba(25, 54, 61, 0.08);
|
border: 1px solid rgba(25, 54, 61, 0.08);
|
||||||
@@ -1469,102 +1527,138 @@
|
|||||||
<div>
|
<div>
|
||||||
<h2>Tests For Selected Function</h2>
|
<h2>Tests For Selected Function</h2>
|
||||||
<div class="section-caption">
|
<div class="section-caption">
|
||||||
Each card shows the raw test case for the selected function, plus the mocks attached to the selected funding source.
|
Browse the raw test types for this function, then inspect the call params, expected result, and selected funding source mocks.
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="wallet-expanded-list">
|
<q-tabs
|
||||||
<details
|
v-if="currentFunctionTestTypeGroups.length"
|
||||||
v-for="testEntry in currentFunctionTestsForFundingSource"
|
v-model="currentSelectedTestTypeKey"
|
||||||
:key="`${currentFunction.name}-${currentFundingSource.name}-${testEntry.index}`"
|
dense
|
||||||
class="wallet-expanded-card test-expander"
|
active-color="white"
|
||||||
|
indicator-color="transparent"
|
||||||
|
align="justify"
|
||||||
|
class="test-type-tabs text-primary"
|
||||||
|
>
|
||||||
|
<q-tab
|
||||||
|
v-for="group in currentFunctionTestTypeGroups"
|
||||||
|
:key="group.key"
|
||||||
|
:name="group.key"
|
||||||
>
|
>
|
||||||
<summary class="wallet-expanded-header test-summary">
|
<div class="text-weight-bold">{{ group.label }}</div>
|
||||||
<div class="test-summary-copy">
|
</q-tab>
|
||||||
<span class="test-summary-arrow"></span>
|
</q-tabs>
|
||||||
<div>
|
|
||||||
<h3 class="wallet-expanded-title">
|
|
||||||
{{ testEntry.description || `Test ${testEntry.index + 1}` }}
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="pill-row">
|
<q-tab-panels
|
||||||
<q-chip
|
v-if="currentSelectedTestTypeGroup"
|
||||||
dense
|
v-model="currentSelectedTestTypeKey"
|
||||||
square
|
animated
|
||||||
:color="testEntry.status.color"
|
class="test-type-panels"
|
||||||
text-color="white"
|
>
|
||||||
>
|
<q-tab-panel
|
||||||
{{ testEntry.status.label }}
|
v-for="group in currentFunctionTestTypeGroups"
|
||||||
</q-chip>
|
:key="group.key"
|
||||||
<q-chip dense square color="secondary" text-color="white">
|
:name="group.key"
|
||||||
{{ currentFundingSource.name }}
|
class="test-type-panel"
|
||||||
</q-chip>
|
>
|
||||||
<q-chip dense square color="primary" text-color="white">
|
<div class="test-case-stack">
|
||||||
{{ testEntry.variantCount }} generated variants
|
<div
|
||||||
</q-chip>
|
v-for="(testEntry, entryIndex) in group.entries"
|
||||||
</div>
|
:key="`${group.key}-${testEntry.index}-${entryIndex}`"
|
||||||
</summary>
|
class="test-case-section"
|
||||||
|
>
|
||||||
<div class="wallet-expanded-body">
|
<div class="test-case-header">
|
||||||
<div v-if="testEntry.note" class="empty-state">
|
<div v-if="group.entries.length > 1">
|
||||||
{{ testEntry.note }}
|
<h3
|
||||||
</div>
|
class="test-case-title"
|
||||||
|
>
|
||||||
<div class="test-detail-grid">
|
{{
|
||||||
<div class="detail-panel">
|
`${group.label} ${entryIndex + 1}`
|
||||||
<json-panel
|
}}
|
||||||
label="Call Params"
|
</h3>
|
||||||
:value="testEntry.call_params || {}"
|
<div
|
||||||
max-height="220px"
|
class="test-case-subtitle"
|
||||||
></json-panel>
|
>
|
||||||
</div>
|
Raw test {{ testEntry.index + 1 }}
|
||||||
<div class="detail-panel">
|
|
||||||
<json-panel
|
|
||||||
:label="testEntry.expectedLabel"
|
|
||||||
:value="testEntry.expectedBlock"
|
|
||||||
empty-label="No expected result block"
|
|
||||||
max-height="220px"
|
|
||||||
></json-panel>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mock-list q-mt-lg" v-if="testEntry.rawMockSets.length">
|
|
||||||
<div
|
|
||||||
v-for="mockSet in testEntry.rawMockSets"
|
|
||||||
:key="mockSet.path"
|
|
||||||
class="mock-card"
|
|
||||||
>
|
|
||||||
<div class="mock-card-header">
|
|
||||||
<div>
|
|
||||||
<div class="mock-card-title">{{ mockSet.label }}</div>
|
|
||||||
</div>
|
</div>
|
||||||
<q-chip dense square color="primary" text-color="white">
|
|
||||||
{{ Object.keys(mockSet.value || {}).length }} mock names
|
|
||||||
</q-chip>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<json-panel
|
<div class="pill-row">
|
||||||
class="q-mt-md"
|
<q-chip
|
||||||
label="Test Mock Definition"
|
dense
|
||||||
:value="mockSet.value"
|
square
|
||||||
max-height="320px"
|
:color="testEntry.status.color"
|
||||||
></json-panel>
|
text-color="white"
|
||||||
|
>
|
||||||
|
{{ testEntry.status.label }}
|
||||||
|
</q-chip>
|
||||||
|
<q-chip dense square color="secondary" text-color="white">
|
||||||
|
{{ currentFundingSource.name }}
|
||||||
|
</q-chip>
|
||||||
|
<q-chip dense square color="primary" text-color="white">
|
||||||
|
{{ testEntry.variantCount }} generated variants
|
||||||
|
</q-chip>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="testEntry.note" class="empty-state">
|
||||||
|
{{ testEntry.note }}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="test-detail-grid">
|
||||||
|
<div class="detail-panel">
|
||||||
|
<json-panel
|
||||||
|
label="Call Params"
|
||||||
|
:value="testEntry.call_params || {}"
|
||||||
|
max-height="220px"
|
||||||
|
></json-panel>
|
||||||
|
</div>
|
||||||
|
<div class="detail-panel">
|
||||||
|
<json-panel
|
||||||
|
:label="testEntry.expectedLabel"
|
||||||
|
:value="testEntry.expectedBlock"
|
||||||
|
empty-label="No expected result block"
|
||||||
|
max-height="220px"
|
||||||
|
></json-panel>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mock-list q-mt-lg" v-if="testEntry.rawMockSets.length">
|
||||||
|
<div
|
||||||
|
v-for="mockSet in testEntry.rawMockSets"
|
||||||
|
:key="mockSet.path"
|
||||||
|
class="mock-card"
|
||||||
|
>
|
||||||
|
<div class="mock-card-header">
|
||||||
|
<div>
|
||||||
|
<div class="mock-card-title">{{ mockSet.label }}</div>
|
||||||
|
</div>
|
||||||
|
<q-chip dense square color="primary" text-color="white">
|
||||||
|
{{ Object.keys(mockSet.value || {}).length }} mock names
|
||||||
|
</q-chip>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<json-panel
|
||||||
|
class="q-mt-md"
|
||||||
|
label="Test Mock Definition"
|
||||||
|
:value="mockSet.value"
|
||||||
|
max-height="320px"
|
||||||
|
></json-panel>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-else class="empty-state q-mt-lg">
|
||||||
|
No wallet-specific mock entry is defined for
|
||||||
|
<code>{{ currentFundingSource.name }}</code>
|
||||||
|
in this test.
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-else class="empty-state q-mt-md">
|
|
||||||
No wallet-specific mock entry is defined for
|
|
||||||
<code>{{ currentFundingSource.name }}</code>
|
|
||||||
in this test.
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</details>
|
</q-tab-panel>
|
||||||
</div>
|
</q-tab-panels>
|
||||||
|
|
||||||
<div v-if="!currentFunctionTestsForFundingSource.length" class="empty-state">
|
<div v-if="!currentFunctionTestTypeGroups.length" class="empty-state">
|
||||||
No tests are defined for this function.
|
No tests are defined for this function.
|
||||||
</div>
|
</div>
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
@@ -2138,6 +2232,7 @@
|
|||||||
settingsDraftRowId: 0,
|
settingsDraftRowId: 0,
|
||||||
settingsDrafts,
|
settingsDrafts,
|
||||||
selectedDatasetKey: 'rest',
|
selectedDatasetKey: 'rest',
|
||||||
|
selectedTestTypeByScope: {},
|
||||||
selectedFunctionByDataset,
|
selectedFunctionByDataset,
|
||||||
selectedFundingSourceByDataset
|
selectedFundingSourceByDataset
|
||||||
}
|
}
|
||||||
@@ -2325,6 +2420,78 @@
|
|||||||
expectedLabel: test.expect ? 'Expect' : 'Expect Error'
|
expectedLabel: test.expect ? 'Expect' : 'Expect Error'
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
},
|
||||||
|
currentTestTypeScopeKey() {
|
||||||
|
if (!this.currentFunctionName || !this.currentFundingSourceName) {
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
|
||||||
|
return [
|
||||||
|
this.selectedDatasetKey,
|
||||||
|
this.currentFunctionName,
|
||||||
|
this.currentFundingSourceName
|
||||||
|
].join(':')
|
||||||
|
},
|
||||||
|
currentFunctionTestTypeGroups() {
|
||||||
|
const groups = []
|
||||||
|
const groupMap = new Map()
|
||||||
|
|
||||||
|
this.currentFunctionTestsForFundingSource.forEach(testEntry => {
|
||||||
|
const label =
|
||||||
|
(testEntry.description || `Test ${testEntry.index + 1}`).trim() ||
|
||||||
|
`Test ${testEntry.index + 1}`
|
||||||
|
|
||||||
|
if (!groupMap.has(label)) {
|
||||||
|
const group = {
|
||||||
|
key: label,
|
||||||
|
label,
|
||||||
|
entries: [],
|
||||||
|
totalVariants: 0
|
||||||
|
}
|
||||||
|
groupMap.set(label, group)
|
||||||
|
groups.push(group)
|
||||||
|
}
|
||||||
|
|
||||||
|
const group = groupMap.get(label)
|
||||||
|
group.entries.push(testEntry)
|
||||||
|
group.totalVariants += testEntry.variantCount
|
||||||
|
})
|
||||||
|
|
||||||
|
return groups
|
||||||
|
},
|
||||||
|
currentSelectedTestTypeKey: {
|
||||||
|
get() {
|
||||||
|
const scopeKey = this.currentTestTypeScopeKey
|
||||||
|
if (!scopeKey) {
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
|
||||||
|
const selectedKey = this.selectedTestTypeByScope[scopeKey]
|
||||||
|
if (
|
||||||
|
selectedKey &&
|
||||||
|
this.currentFunctionTestTypeGroups.some(
|
||||||
|
group => group.key === selectedKey
|
||||||
|
)
|
||||||
|
) {
|
||||||
|
return selectedKey
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.currentFunctionTestTypeGroups[0]?.key || ''
|
||||||
|
},
|
||||||
|
set(value) {
|
||||||
|
if (!this.currentTestTypeScopeKey) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
this.selectedTestTypeByScope[this.currentTestTypeScopeKey] = value
|
||||||
|
}
|
||||||
|
},
|
||||||
|
currentSelectedTestTypeGroup() {
|
||||||
|
return (
|
||||||
|
this.currentFunctionTestTypeGroups.find(
|
||||||
|
group => group.key === this.currentSelectedTestTypeKey
|
||||||
|
) || null
|
||||||
|
)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
|||||||
Reference in New Issue
Block a user