github-mirror/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2026-06-01 09:17:08 +02:00
Code Issues Actions 13 Packages Projects Releases Wiki Activity Graph

fix(editor): Input/output panel in log view shows "N of N item(s)" when nothing matched (#20224)

Browse Source
This commit is contained in:
Suguru Inoue 2025-10-08 11:04:19 +02:00 committed by GitHub
parent 2a7b34197a
commit 9b46bf65f3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 66 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/frontend/editor-ui/src/components/RunDataItemCount.vue
View File

@ -17,7 +17,7 @@ const i18n = useI18n();
</script>
<template>
<N8nText v-if="search" :class="$style.itemsText">
<N8nText v-if="search" :class="$style.itemsText" data-test-id="run-data-item-count">
{{
i18n.baseText('ndv.search.items', {
adjustToNumber: unfilteredDataCount,
@ -25,7 +25,7 @@ const i18n = useI18n();
})
}}
</N8nText>
<N8nText v-else :class="$style.itemsText">
<N8nText v-else :class="$style.itemsText" data-test-id="run-data-item-count">
<span>
{{
i18n.baseText('ndv.output.items', {

60
packages/frontend/editor-ui/src/features/logs/components/LogsViewRunData.test.ts Normal file
View File

@ -0,0 +1,60 @@
import { createTestNode, createTestTaskData, createTestWorkflowObject } from '@/__tests__/mocks';
import { createTestLogEntry } from '../__test__/mocks';
import { fireEvent, render, waitFor } from '@testing-library/vue';
import userEvent from '@testing-library/user-event';
import LogsViewRunData from './LogsViewRunData.vue';
import { createTestingPinia, type TestingPinia } from '@pinia/testing';
describe('LogViewRunData', () => {
let pinia: TestingPinia;
const nodeB = createTestNode({ name: 'B' });
const runDataB = createTestTaskData({
data: {
main: [
[{ json: { p: '0' } }, { json: { p: '1' } }, { json: { p: '2' } }, { json: { p: '3' } }],
],
},
});
const workflow = createTestWorkflowObject({ nodes: [nodeB] });
const logEntry = createTestLogEntry({
node: nodeB,
runIndex: 0,
runData: runDataB,
workflow,
execution: { resultData: { runData: { B: [runDataB] } } },
});
beforeEach(() => {
pinia = createTestingPinia({ stubActions: false, fakeApp: true });
});
it('should display item count', async () => {
const rendered = render(LogsViewRunData, {
global: { plugins: [pinia] },
props: { title: '', logEntry, collapsingTableColumnName: null, paneType: 'output' },
});
expect(rendered.getByTestId('run-data-item-count')).toHaveTextContent('4 items');
});
it('should display matched and total item count unless display mode is schema', async () => {
const rendered = render(LogsViewRunData, {
global: { plugins: [pinia] },
props: { title: '', logEntry, collapsingTableColumnName: null, paneType: 'output' },
});
await fireEvent.click(await rendered.findByTestId('radio-button-table'));
await userEvent.type(await rendered.findByTestId('ndv-search'), '0');
await waitFor(() => {
expect(rendered.getByTestId('run-data-item-count')).toHaveTextContent('1 of 4 items');
});
await fireEvent.click(await rendered.findByTestId('radio-button-schema'));
await waitFor(() => {
expect(rendered.getByTestId('run-data-item-count')).toHaveTextContent('4 items');
});
});
});

5
packages/frontend/editor-ui/src/features/logs/components/LogsViewRunData.vue
View File

@ -109,7 +109,10 @@ function handleChangeDisplayMode(value: IRunDataDisplayMode) {
</template>
<template #header-end="itemCountProps">
<RunDataItemCount v-bind="itemCountProps" />
<RunDataItemCount
v-bind="itemCountProps"
:search="displayMode === 'schema' ? '' : itemCountProps.search"
/>
</template>
<template #no-output-data>