mirror of
https://github.com/n8n-io/n8n.git
synced 2024-09-19 22:37:31 -07:00
Merge branch 'master' of https://github.com/n8n-io/n8n into node-1714-show-result-of-waiting-execution-on-canvas-after-execution
This commit is contained in:
commit
4e6e035e5d
|
@ -3,8 +3,9 @@ import { check } from 'k6';
|
|||
|
||||
const apiBaseUrl = __ENV.API_BASE_URL;
|
||||
|
||||
const file = open(__ENV.SCRIPT_FILE_PATH, 'b');
|
||||
const filename = String(__ENV.SCRIPT_FILE_PATH).split('/').pop();
|
||||
// This creates a 2MB file (16 * 128 * 1024 = 2 * 1024 * 1024 = 2MB)
|
||||
const file = Array.from({ length: 128 * 1024 }, () => Math.random().toString().slice(2)).join('');
|
||||
const filename = 'test.bin';
|
||||
|
||||
export default function () {
|
||||
const data = {
|
||||
|
|
|
@ -77,7 +77,6 @@ export function handleSummary(data) {
|
|||
env: {
|
||||
API_BASE_URL: this.opts.n8nApiBaseUrl,
|
||||
K6_CLOUD_TOKEN: this.opts.k6ApiToken,
|
||||
SCRIPT_FILE_PATH: augmentedTestScriptPath,
|
||||
},
|
||||
stdio: 'inherit',
|
||||
})`${k6ExecutablePath} run ${flattedFlags} ${augmentedTestScriptPath}`;
|
||||
|
|
|
@ -14,6 +14,7 @@ import { nonExistingJsonPath } from '@/constants';
|
|||
import { useExternalHooks } from '@/composables/useExternalHooks';
|
||||
import TextWithHighlights from './TextWithHighlights.vue';
|
||||
import { useTelemetry } from '@/composables/useTelemetry';
|
||||
import { useElementSize } from '@vueuse/core';
|
||||
|
||||
const LazyRunDataJsonActions = defineAsyncComponent(
|
||||
async () => await import('@/components/RunDataJsonActions.vue'),
|
||||
|
@ -45,6 +46,9 @@ const telemetry = useTelemetry();
|
|||
const selectedJsonPath = ref(nonExistingJsonPath);
|
||||
const draggingPath = ref<null | string>(null);
|
||||
const displayMode = ref('json');
|
||||
const jsonDataContainer = ref(null);
|
||||
|
||||
const { height } = useElementSize(jsonDataContainer);
|
||||
|
||||
const jsonData = computed(() => executionDataToJson(props.inputData));
|
||||
|
||||
|
@ -110,7 +114,7 @@ const getListItemName = (path: string) => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div :class="[$style.jsonDisplay, { [$style.highlight]: highlight }]">
|
||||
<div ref="jsonDataContainer" :class="[$style.jsonDisplay, { [$style.highlight]: highlight }]">
|
||||
<Suspense>
|
||||
<LazyRunDataJsonActions
|
||||
v-if="!editMode.enabled"
|
||||
|
@ -141,6 +145,8 @@ const getListItemName = (path: string) => {
|
|||
root-path=""
|
||||
selectable-type="single"
|
||||
class="json-data"
|
||||
:virtual="true"
|
||||
:height="height"
|
||||
@update:selected-value="selectedJsonPath = $event"
|
||||
>
|
||||
<template #renderNodeKey="{ node }">
|
||||
|
@ -192,11 +198,10 @@ const getListItemName = (path: string) => {
|
|||
left: 0;
|
||||
padding-left: var(--spacing-s);
|
||||
right: 0;
|
||||
overflow-y: auto;
|
||||
overflow-y: hidden;
|
||||
line-height: 1.5;
|
||||
word-break: normal;
|
||||
height: 100%;
|
||||
padding-bottom: var(--spacing-3xl);
|
||||
|
||||
&:hover {
|
||||
/* Shows .actionsGroup element from <run-data-json-actions /> child component */
|
||||
|
@ -299,4 +304,8 @@ const getListItemName = (path: string) => {
|
|||
.vjs-tree .vjs-tree__content.has-line {
|
||||
border-left: 1px dotted var(--color-json-line);
|
||||
}
|
||||
|
||||
.vjs-tree .vjs-tree-list-holder-inner {
|
||||
padding-bottom: var(--spacing-3xl);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -2,6 +2,22 @@ import { createTestingPinia } from '@pinia/testing';
|
|||
import { screen, cleanup } from '@testing-library/vue';
|
||||
import RunDataJson from '@/components/RunDataJson.vue';
|
||||
import { createComponentRenderer } from '@/__tests__/render';
|
||||
import { useElementSize } from '@vueuse/core'; // Import the composable to mock
|
||||
|
||||
vi.mock('@vueuse/core', async () => {
|
||||
// eslint-disable-next-line @typescript-eslint/consistent-type-imports
|
||||
const originalModule = await vi.importActual<typeof import('@vueuse/core')>('@vueuse/core');
|
||||
|
||||
return {
|
||||
...originalModule, // Keep all original exports
|
||||
useElementSize: vi.fn(), // Mock useElementSize
|
||||
};
|
||||
});
|
||||
|
||||
(useElementSize as jest.Mock).mockReturnValue({
|
||||
height: 500, // Mocked height value
|
||||
width: 300, // Mocked width value
|
||||
});
|
||||
|
||||
const renderComponent = createComponentRenderer(RunDataJson, {
|
||||
props: {
|
||||
|
@ -34,18 +50,6 @@ const renderComponent = createComponentRenderer(RunDataJson, {
|
|||
disabled: false,
|
||||
},
|
||||
},
|
||||
global: {
|
||||
mocks: {
|
||||
$locale: {
|
||||
baseText() {
|
||||
return '';
|
||||
},
|
||||
},
|
||||
$store: {
|
||||
getters: {},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
describe('RunDataJson.vue', () => {
|
||||
|
|
|
@ -11,7 +11,19 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
|
|||
>
|
||||
|
||||
<div
|
||||
class="vjs-tree json-data"
|
||||
class="vjs-tree is-virtual json-data"
|
||||
>
|
||||
<div
|
||||
class="vjs-tree-list"
|
||||
style="height: 500px;"
|
||||
>
|
||||
<div
|
||||
class="vjs-tree-list-holder"
|
||||
style="height: 340px;"
|
||||
>
|
||||
<div
|
||||
class="vjs-tree-list-holder-inner"
|
||||
style="transform: translateY(0px);"
|
||||
>
|
||||
|
||||
<div
|
||||
|
@ -828,6 +840,9 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
|
|||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--teleport start-->
|
||||
<!--teleport end-->
|
||||
|
|
|
@ -7,8 +7,9 @@ import {
|
|||
hasDestinationId,
|
||||
saveDestinationToDb,
|
||||
sendTestMessageToDestination,
|
||||
} from '../api/eventbus.ee';
|
||||
} from '@/api/eventbus.ee';
|
||||
import { useRootStore } from './root.store';
|
||||
import { ref } from 'vue';
|
||||
|
||||
export interface EventSelectionItem {
|
||||
selected: boolean;
|
||||
|
@ -32,80 +33,142 @@ export interface DestinationSettingsStore {
|
|||
[key: string]: DestinationStoreItem;
|
||||
}
|
||||
|
||||
export const useLogStreamingStore = defineStore('logStreaming', {
|
||||
state: () => ({
|
||||
items: {} as DestinationSettingsStore,
|
||||
eventNames: new Set<string>(),
|
||||
}),
|
||||
getters: {},
|
||||
actions: {
|
||||
addDestination(destination: MessageEventBusDestinationOptions) {
|
||||
if (destination.id && this.items[destination.id]) {
|
||||
this.items[destination.id].destination = destination;
|
||||
export const useLogStreamingStore = defineStore('logStreaming', () => {
|
||||
const items = ref<DestinationSettingsStore>({});
|
||||
const eventNames = ref(new Set<string>());
|
||||
|
||||
const rootStore = useRootStore();
|
||||
|
||||
const addDestination = (destination: MessageEventBusDestinationOptions) => {
|
||||
if (destination.id && items.value[destination.id]) {
|
||||
items.value[destination.id].destination = destination;
|
||||
} else {
|
||||
this.setSelectionAndBuildItems(destination);
|
||||
setSelectionAndBuildItems(destination);
|
||||
}
|
||||
},
|
||||
getDestination(destinationId: string): MessageEventBusDestinationOptions | undefined {
|
||||
if (this.items[destinationId]) {
|
||||
return this.items[destinationId].destination;
|
||||
};
|
||||
|
||||
const setSelectionAndBuildItems = (destination: MessageEventBusDestinationOptions) => {
|
||||
if (destination.id) {
|
||||
if (!items.value[destination.id]) {
|
||||
items.value[destination.id] = {
|
||||
destination,
|
||||
selectedEvents: new Set<string>(),
|
||||
eventGroups: [],
|
||||
isNew: false,
|
||||
} as DestinationStoreItem;
|
||||
}
|
||||
items.value[destination.id]?.selectedEvents?.clear();
|
||||
if (destination.subscribedEvents) {
|
||||
for (const eventName of destination.subscribedEvents) {
|
||||
items.value[destination.id]?.selectedEvents?.add(eventName);
|
||||
}
|
||||
}
|
||||
items.value[destination.id].eventGroups = eventGroupsFromStringList(
|
||||
eventNames.value,
|
||||
items.value[destination.id]?.selectedEvents,
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const getDestination = (destinationId: string) => {
|
||||
if (items.value[destinationId]) {
|
||||
return items.value[destinationId].destination;
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
},
|
||||
getAllDestinations(): MessageEventBusDestinationOptions[] {
|
||||
};
|
||||
|
||||
const getAllDestinations = () => {
|
||||
const destinations: MessageEventBusDestinationOptions[] = [];
|
||||
for (const key of Object.keys(this.items)) {
|
||||
destinations.push(this.items[key].destination);
|
||||
for (const key of Object.keys(items)) {
|
||||
destinations.push(items.value[key].destination);
|
||||
}
|
||||
return destinations;
|
||||
},
|
||||
updateDestination(destination: MessageEventBusDestinationOptions) {
|
||||
if (destination.id && this.items[destination.id]) {
|
||||
this.$patch((state) => {
|
||||
if (destination.id && this.items[destination.id]) {
|
||||
state.items[destination.id].destination = destination;
|
||||
};
|
||||
|
||||
const clearDestinations = () => {
|
||||
items.value = {};
|
||||
};
|
||||
|
||||
const addEventName = (name: string) => {
|
||||
eventNames.value.add(name);
|
||||
};
|
||||
|
||||
const removeEventName = (name: string) => {
|
||||
eventNames.value.delete(name);
|
||||
};
|
||||
|
||||
const clearEventNames = () => {
|
||||
eventNames.value.clear();
|
||||
};
|
||||
|
||||
const addSelectedEvent = (id: string, name: string) => {
|
||||
items.value[id]?.selectedEvents?.add(name);
|
||||
setSelectedInGroup(id, name, true);
|
||||
};
|
||||
|
||||
const removeSelectedEvent = (id: string, name: string) => {
|
||||
items.value[id]?.selectedEvents?.delete(name);
|
||||
setSelectedInGroup(id, name, false);
|
||||
};
|
||||
|
||||
const setSelectedInGroup = (destinationId: string, name: string, isSelected: boolean) => {
|
||||
if (items.value[destinationId]) {
|
||||
const groupName = eventGroupFromEventName(name);
|
||||
const groupIndex = items.value[destinationId].eventGroups.findIndex(
|
||||
(e) => e.name === groupName,
|
||||
);
|
||||
|
||||
if (groupIndex > -1) {
|
||||
if (groupName === name) {
|
||||
items.value[destinationId].eventGroups[groupIndex].selected = isSelected;
|
||||
} else {
|
||||
const eventIndex = items.value[destinationId].eventGroups[groupIndex].children.findIndex(
|
||||
(e) => e.name === name,
|
||||
);
|
||||
if (eventIndex > -1) {
|
||||
items.value[destinationId].eventGroups[groupIndex].children[eventIndex].selected =
|
||||
isSelected;
|
||||
if (isSelected) {
|
||||
items.value[destinationId].eventGroups[groupIndex].indeterminate = isSelected;
|
||||
} else {
|
||||
let anySelected = false;
|
||||
for (
|
||||
let i = 0;
|
||||
i < items.value[destinationId].eventGroups[groupIndex].children.length;
|
||||
i++
|
||||
) {
|
||||
anySelected =
|
||||
anySelected ||
|
||||
items.value[destinationId].eventGroups[groupIndex].children[i].selected;
|
||||
}
|
||||
// to trigger refresh
|
||||
state.items = { ...state.items };
|
||||
});
|
||||
items.value[destinationId].eventGroups[groupIndex].indeterminate = anySelected;
|
||||
}
|
||||
},
|
||||
removeDestination(destinationId: string) {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const removeDestinationItemTree = (id: string) => {
|
||||
delete items.value[id];
|
||||
};
|
||||
|
||||
const updateDestination = (destination: MessageEventBusDestinationOptions) => {
|
||||
if (destination.id && items.value[destination.id]) {
|
||||
items.value[destination.id].destination = destination;
|
||||
}
|
||||
};
|
||||
|
||||
const removeDestination = (destinationId: string) => {
|
||||
if (!destinationId) return;
|
||||
delete this.items[destinationId];
|
||||
if (this.items[destinationId]) {
|
||||
this.$patch({
|
||||
items: {
|
||||
...this.items,
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
clearDestinations() {
|
||||
this.items = {};
|
||||
},
|
||||
addEventName(name: string) {
|
||||
this.eventNames.add(name);
|
||||
},
|
||||
removeEventName(name: string) {
|
||||
this.eventNames.delete(name);
|
||||
},
|
||||
clearEventNames() {
|
||||
this.eventNames.clear();
|
||||
},
|
||||
addSelectedEvent(id: string, name: string) {
|
||||
this.items[id]?.selectedEvents?.add(name);
|
||||
this.setSelectedInGroup(id, name, true);
|
||||
},
|
||||
removeSelectedEvent(id: string, name: string) {
|
||||
this.items[id]?.selectedEvents?.delete(name);
|
||||
this.setSelectedInGroup(id, name, false);
|
||||
},
|
||||
getSelectedEvents(destinationId: string): string[] {
|
||||
delete items.value[destinationId];
|
||||
};
|
||||
|
||||
const getSelectedEvents = (destinationId: string): string[] => {
|
||||
const selectedEvents: string[] = [];
|
||||
if (this.items[destinationId]) {
|
||||
for (const group of this.items[destinationId].eventGroups) {
|
||||
if (items.value[destinationId]) {
|
||||
for (const group of items.value[destinationId].eventGroups) {
|
||||
if (group.selected) {
|
||||
selectedEvents.push(group.name);
|
||||
}
|
||||
|
@ -117,136 +180,95 @@ export const useLogStreamingStore = defineStore('logStreaming', {
|
|||
}
|
||||
}
|
||||
return selectedEvents;
|
||||
},
|
||||
setSelectedInGroup(destinationId: string, name: string, isSelected: boolean) {
|
||||
if (this.items[destinationId]) {
|
||||
const groupName = eventGroupFromEventName(name);
|
||||
const groupIndex = this.items[destinationId].eventGroups.findIndex(
|
||||
(e) => e.name === groupName,
|
||||
);
|
||||
if (groupIndex > -1) {
|
||||
if (groupName === name) {
|
||||
this.$patch((state) => {
|
||||
state.items[destinationId].eventGroups[groupIndex].selected = isSelected;
|
||||
});
|
||||
} else {
|
||||
const eventIndex = this.items[destinationId].eventGroups[groupIndex].children.findIndex(
|
||||
(e) => e.name === name,
|
||||
);
|
||||
if (eventIndex > -1) {
|
||||
this.$patch((state) => {
|
||||
state.items[destinationId].eventGroups[groupIndex].children[eventIndex].selected =
|
||||
isSelected;
|
||||
if (isSelected) {
|
||||
state.items[destinationId].eventGroups[groupIndex].indeterminate = isSelected;
|
||||
} else {
|
||||
let anySelected = false;
|
||||
for (
|
||||
let i = 0;
|
||||
i < state.items[destinationId].eventGroups[groupIndex].children.length;
|
||||
i++
|
||||
) {
|
||||
anySelected =
|
||||
anySelected ||
|
||||
state.items[destinationId].eventGroups[groupIndex].children[i].selected;
|
||||
}
|
||||
state.items[destinationId].eventGroups[groupIndex].indeterminate = anySelected;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
removeDestinationItemTree(id: string) {
|
||||
delete this.items[id];
|
||||
},
|
||||
clearDestinationItemTrees() {
|
||||
this.items = {} as DestinationSettingsStore;
|
||||
},
|
||||
setSelectionAndBuildItems(destination: MessageEventBusDestinationOptions) {
|
||||
if (destination.id) {
|
||||
if (!this.items[destination.id]) {
|
||||
this.items[destination.id] = {
|
||||
destination,
|
||||
selectedEvents: new Set<string>(),
|
||||
eventGroups: [],
|
||||
isNew: false,
|
||||
} as DestinationStoreItem;
|
||||
}
|
||||
this.items[destination.id]?.selectedEvents?.clear();
|
||||
if (destination.subscribedEvents) {
|
||||
for (const eventName of destination.subscribedEvents) {
|
||||
this.items[destination.id]?.selectedEvents?.add(eventName);
|
||||
}
|
||||
}
|
||||
this.items[destination.id].eventGroups = eventGroupsFromStringList(
|
||||
this.eventNames,
|
||||
this.items[destination.id]?.selectedEvents,
|
||||
);
|
||||
}
|
||||
},
|
||||
async saveDestination(destination: MessageEventBusDestinationOptions): Promise<boolean> {
|
||||
};
|
||||
|
||||
const saveDestination = async (
|
||||
destination: MessageEventBusDestinationOptions,
|
||||
): Promise<boolean> => {
|
||||
if (!hasDestinationId(destination)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const rootStore = useRootStore();
|
||||
const selectedEvents = this.getSelectedEvents(destination.id);
|
||||
const selectedEvents = getSelectedEvents(destination.id);
|
||||
try {
|
||||
await saveDestinationToDb(rootStore.restApiContext, destination, selectedEvents);
|
||||
this.updateDestination(destination);
|
||||
updateDestination(destination);
|
||||
return true;
|
||||
} catch (e) {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
async sendTestMessage(destination: MessageEventBusDestinationOptions): Promise<boolean> {
|
||||
};
|
||||
|
||||
const sendTestMessage = async (
|
||||
destination: MessageEventBusDestinationOptions,
|
||||
): Promise<boolean> => {
|
||||
if (!hasDestinationId(destination)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const rootStore = useRootStore();
|
||||
const testResult = await sendTestMessageToDestination(rootStore.restApiContext, destination);
|
||||
return testResult;
|
||||
},
|
||||
async fetchEventNames(): Promise<string[]> {
|
||||
const rootStore = useRootStore();
|
||||
};
|
||||
|
||||
const fetchEventNames = async () => {
|
||||
return await getEventNamesFromBackend(rootStore.restApiContext);
|
||||
},
|
||||
async fetchDestinations(): Promise<MessageEventBusDestinationOptions[]> {
|
||||
const rootStore = useRootStore();
|
||||
};
|
||||
|
||||
const fetchDestinations = async (): Promise<MessageEventBusDestinationOptions[]> => {
|
||||
return await getDestinationsFromBackend(rootStore.restApiContext);
|
||||
},
|
||||
async deleteDestination(destinationId: string) {
|
||||
const rootStore = useRootStore();
|
||||
};
|
||||
|
||||
const deleteDestination = async (destinationId: string) => {
|
||||
await deleteDestinationFromDb(rootStore.restApiContext, destinationId);
|
||||
this.removeDestination(destinationId);
|
||||
},
|
||||
},
|
||||
removeDestination(destinationId);
|
||||
};
|
||||
|
||||
return {
|
||||
addDestination,
|
||||
setSelectionAndBuildItems,
|
||||
getDestination,
|
||||
getAllDestinations,
|
||||
clearDestinations,
|
||||
addEventName,
|
||||
removeEventName,
|
||||
clearEventNames,
|
||||
addSelectedEvent,
|
||||
removeSelectedEvent,
|
||||
setSelectedInGroup,
|
||||
removeDestinationItemTree,
|
||||
updateDestination,
|
||||
removeDestination,
|
||||
getSelectedEvents,
|
||||
saveDestination,
|
||||
sendTestMessage,
|
||||
fetchEventNames,
|
||||
fetchDestinations,
|
||||
deleteDestination,
|
||||
items,
|
||||
};
|
||||
});
|
||||
|
||||
export function eventGroupFromEventName(eventName: string): string | undefined {
|
||||
export const eventGroupFromEventName = (eventName: string): string | undefined => {
|
||||
const matches = eventName.match(/^[\w\s]+\.[\w\s]+/);
|
||||
if (matches && matches?.length > 0) {
|
||||
return matches[0];
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
};
|
||||
|
||||
function prettifyEventName(label: string, group = ''): string {
|
||||
const prettifyEventName = (label: string, group = ''): string => {
|
||||
label = label.replace(group + '.', '');
|
||||
if (label.length > 0) {
|
||||
label = label[0].toUpperCase() + label.substring(1);
|
||||
label = label.replaceAll('.', ' ');
|
||||
}
|
||||
return label;
|
||||
}
|
||||
};
|
||||
|
||||
export function eventGroupsFromStringList(
|
||||
export const eventGroupsFromStringList = (
|
||||
dottedList: Set<string>,
|
||||
selectionList: Set<string> = new Set(),
|
||||
) {
|
||||
) => {
|
||||
const result = [] as EventSelectionGroup[];
|
||||
const eventNameArray = Array.from(dottedList.values());
|
||||
|
||||
|
@ -287,4 +309,4 @@ export function eventGroupsFromStringList(
|
|||
result.push(collection);
|
||||
}
|
||||
return result;
|
||||
}
|
||||
};
|
||||
|
|
|
@ -95,7 +95,7 @@ export default defineComponent({
|
|||
},
|
||||
async getDestinationDataFromBackend(): Promise<void> {
|
||||
this.logStreamingStore.clearEventNames();
|
||||
this.logStreamingStore.clearDestinationItemTrees();
|
||||
this.logStreamingStore.clearDestinations();
|
||||
this.allDestinations = [];
|
||||
const eventNamesData = await this.logStreamingStore.fetchEventNames();
|
||||
if (eventNamesData) {
|
||||
|
|
Loading…
Reference in a new issue