mirror of
https://github.com/Abdulazizzn/n8n-enterprise-unlocked.git
synced 2025-12-17 10:02:05 +00:00
feat: HTML node (#5107)
* ✨ Create HTML templating node PoC * ♻️ Apply feedback * 🐛 Scope CSS selectors * ✏️ Adjust description * ✏️ Adjust placeholder * ⚡ Replace two custom files with package output * ➕ Add `codemirror-lang-html-n8n` * 👕 Appease linter * 🧪 Skip event bus tests * ⏪ Revert "Skip event bus tests" This reverts commit 5702585d0de3b8465660567132e9003e78f1104c. * ✏️ Update codex * 🧹 Cleanup * 🐛 Restore original for `continueOnFail` * ⚡ Improve `getResolvables`
This commit is contained in:
@@ -316,6 +316,11 @@
|
||||
:totalRuns="maxRunIndex"
|
||||
/>
|
||||
|
||||
<run-data-html
|
||||
v-else-if="hasNodeRun && isPaneTypeOutput && displayMode === 'html'"
|
||||
:inputData="inputData"
|
||||
/>
|
||||
|
||||
<run-data-schema
|
||||
v-else-if="hasNodeRun && displayMode === 'schema'"
|
||||
:data="jsonData"
|
||||
@@ -475,6 +480,7 @@ import {
|
||||
MAX_DISPLAY_DATA_SIZE,
|
||||
MAX_DISPLAY_ITEMS_AUTO_ALL,
|
||||
TEST_PIN_DATA,
|
||||
HTML_NODE_TYPE,
|
||||
} from '@/constants';
|
||||
|
||||
import BinaryDataDisplay from '@/components/BinaryDataDisplay.vue';
|
||||
@@ -497,6 +503,7 @@ import { useNodeTypesStore } from '@/stores/nodeTypes';
|
||||
const RunDataTable = () => import('@/components/RunDataTable.vue');
|
||||
const RunDataJson = () => import('@/components/RunDataJson.vue');
|
||||
const RunDataSchema = () => import('@/components/RunDataSchema.vue');
|
||||
const RunDataHtml = () => import('@/components/RunDataHtml.vue');
|
||||
|
||||
export type EnterEditModeArgs = {
|
||||
origin: 'editIconButton' | 'insertTestDataLink';
|
||||
@@ -512,6 +519,7 @@ export default mixins(externalHooks, genericHelpers, nodeHelpers, pinData).exten
|
||||
RunDataTable,
|
||||
RunDataJson,
|
||||
RunDataSchema,
|
||||
RunDataHtml,
|
||||
},
|
||||
props: {
|
||||
nodeUi: {
|
||||
@@ -598,6 +606,8 @@ export default mixins(externalHooks, genericHelpers, nodeHelpers, pinData).exten
|
||||
pane: this.paneType as 'input' | 'output',
|
||||
branchIndex: this.currentOutputIndex,
|
||||
});
|
||||
|
||||
if (this.paneType === 'output') this.setDisplayMode();
|
||||
},
|
||||
destroyed() {
|
||||
this.hidePinDataDiscoveryTooltip();
|
||||
@@ -651,6 +661,14 @@ export default mixins(externalHooks, genericHelpers, nodeHelpers, pinData).exten
|
||||
defaults.unshift({ label: this.$locale.baseText('runData.schema'), value: 'schema' });
|
||||
}
|
||||
|
||||
if (
|
||||
this.isPaneTypeOutput &&
|
||||
this.activeNode?.type === HTML_NODE_TYPE &&
|
||||
this.activeNode.parameters.operation === 'generateHtmlTemplate'
|
||||
) {
|
||||
defaults.unshift({ label: 'HTML', value: 'html' });
|
||||
}
|
||||
|
||||
return defaults;
|
||||
},
|
||||
hasNodeRun(): boolean {
|
||||
@@ -833,6 +851,9 @@ export default mixins(externalHooks, genericHelpers, nodeHelpers, pinData).exten
|
||||
isPaneTypeInput(): boolean {
|
||||
return this.paneType === 'input';
|
||||
},
|
||||
isPaneTypeOutput(): boolean {
|
||||
return this.paneType === 'output';
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onItemHover(itemIndex: number | null) {
|
||||
@@ -1275,11 +1296,26 @@ export default mixins(externalHooks, genericHelpers, nodeHelpers, pinData).exten
|
||||
this.ndvStore.activeNodeName = this.node.name;
|
||||
}
|
||||
},
|
||||
setDisplayMode() {
|
||||
if (!this.activeNode) return;
|
||||
|
||||
const shouldDisplayHtml =
|
||||
this.activeNode.type === HTML_NODE_TYPE &&
|
||||
this.activeNode.parameters.operation === 'generateHtmlTemplate';
|
||||
|
||||
this.ndvStore.setPanelDisplayMode({
|
||||
pane: 'output',
|
||||
mode: shouldDisplayHtml ? 'html' : 'table',
|
||||
});
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
node() {
|
||||
this.init();
|
||||
},
|
||||
hasNodeRun() {
|
||||
if (this.paneType === 'output') this.setDisplayMode();
|
||||
},
|
||||
inputData: {
|
||||
handler(data: INodeExecutionData[]) {
|
||||
if (this.paneType && data) {
|
||||
|
||||
Reference in New Issue
Block a user