mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2025-02-21 02:56:40 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Update evaluation UI components and add test IDs

Browse source 
- Add data-test-id to input components
- Update TagsInput to use useI18n composable
- Fix typo in TestsList component
- Add test ID to "Run Test" button
- Remove unused locale references
This commit is contained in:
Oleg Ivaniv 2024-11-12 22:48:07 +01:00
parent b8073c70fb
commit 1417fe4719
No known key found for this signature in database
5 changed files with 14 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
packages/editor-ui/src/components/WorkflowEvaluation/EditEvaluation/EvaluationHeader.vue
View file

@ -38,6 +38,7 @@ defineProps<EvaluationHeaderProps>();
<N8nInput <N8nInput
v-else v-else
ref="nameInput" ref="nameInput"
data-test-id="evaluation-name-input"
:model-value="modelValue.tempValue" :model-value="modelValue.tempValue"
type="text" type="text"
:placeholder="$locale.baseText('workflowEvaluation.edit.namePlaceholder')" :placeholder="$locale.baseText('workflowEvaluation.edit.namePlaceholder')"

1
packages/editor-ui/src/components/WorkflowEvaluation/EditEvaluation/MetricsInput.vue
View file

@ -35,6 +35,7 @@ function updateMetric(index: number, value: string) {
<div v-for="(metric, index) in modelValue" :key="index"> <div v-for="(metric, index) in modelValue" :key="index">
<N8nInput <N8nInput
:ref="`metric_${index}`" :ref="`metric_${index}`"
data-test-id="evaluation-metric-item"
:model-value="metric" :model-value="metric"
:placeholder="$locale.baseText('workflowEvaluation.edit.metricsPlaceholder')" :placeholder="$locale.baseText('workflowEvaluation.edit.metricsPlaceholder')"
@update:model-value="(value: string) => updateMetric(index, value)" @update:model-value="(value: string) => updateMetric(index, value)"

7
packages/editor-ui/src/components/WorkflowEvaluation/EditEvaluation/TagsInput.vue
View file

@ -26,6 +26,7 @@ const props = withDefaults(defineProps<TagsInputProps>(), {
const emit = defineEmits<{ 'update:modelValue': [value: TagsInputProps['modelValue']] }>(); const emit = defineEmits<{ 'update:modelValue': [value: TagsInputProps['modelValue']] }>();
const locale = useI18n();
const tagsEventBus = createEventBus(); const tagsEventBus = createEventBus();
const getTagName = computed(() => (tagId: string) => { const getTagName = computed(() => (tagId: string) => {
return props.tagsById[tagId]?.name ?? ''; return props.tagsById[tagId]?.name ?? '';
@ -45,7 +46,7 @@ function updateTags(tags: string[]) {
<n8n-input-label label="Tag name" :bold="false" size="small"> <n8n-input-label label="Tag name" :bold="false" size="small">
<div v-if="!modelValue.isEditing" :class="$style.tagsRead" @click="startEditing('tags')"> <div v-if="!modelValue.isEditing" :class="$style.tagsRead" @click="startEditing('tags')">
<n8n-text v-if="modelValue.appliedTagIds.length === 0" size="small"> <n8n-text v-if="modelValue.appliedTagIds.length === 0" size="small">
{{ $locale.baseText('workflowEvaluation.edit.selectTag') }} {{ locale.baseText('workflowEvaluation.edit.selectTag') }}
</n8n-text> </n8n-text>
<n8n-tag v-for="tagId in modelValue.appliedTagIds" :key="tagId" :text="getTagName(tagId)" /> <n8n-tag v-for="tagId in modelValue.appliedTagIds" :key="tagId" :text="getTagName(tagId)" />
<n8n-icon-button <n8n-icon-button
@ -59,7 +60,7 @@ function updateTags(tags: string[]) {
<TagsDropdown <TagsDropdown
v-else v-else
:model-value="modelValue.appliedTagIds" :model-value="modelValue.appliedTagIds"
:placeholder="$locale.baseText('executionAnnotationView.chooseOrCreateATag')" :placeholder="locale.baseText('executionAnnotationView.chooseOrCreateATag')"
:create-enabled="false" :create-enabled="false"
:all-tags="allTags" :all-tags="allTags"
:is-loading="isLoading" :is-loading="isLoading"
@ -72,7 +73,7 @@ function updateTags(tags: string[]) {
/> />
</n8n-input-label> </n8n-input-label>
<n8n-text size="small" color="text-light">{{ <n8n-text size="small" color="text-light">{{
$locale.baseText('workflowEvaluation.edit.tagsHelpText') locale.baseText('workflowEvaluation.edit.tagsHelpText')
}}</n8n-text> }}</n8n-text>
</div> </div>
</template> </template>

2
packages/editor-ui/src/components/WorkflowEvaluation/ListEvaluation/TestsList.vue
View file

@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import TestItem from './TestItem.vue'; import TestItem from './TestItem.vue';
import type { TestListItem } from '@/components/WorkflowEvaluation/types'; import type { TestListItem } from '@/components/WorkflowEvaluation/types';
s;
export interface TestListProps { export interface TestListProps {
tests: TestListItem[]; tests: TestListItem[];
} }

8
packages/editor-ui/src/views/WorkflowEvaluation/EvaluationEditView.vue
View file

@ -99,7 +99,13 @@ function hasIssues(key: string) {
<MetricsInput v-model="state.metrics" :class="{ 'has-issues': hasIssues('metrics') }" /> <MetricsInput v-model="state.metrics" :class="{ 'has-issues': hasIssues('metrics') }" />
<div :class="$style.footer"> <div :class="$style.footer">
<n8n-button type="primary" :label="buttonLabel" :loading="isSaving" @click="onSaveTest" /> <n8n-button
type="primary"
data-test-id="run-test-button"
:label="buttonLabel"
:loading="isSaving"
@click="onSaveTest"
/>
</div> </div>
</div> </div>
</template> </template>