n8n/cypress/pages/features/node-creator.ts
OlegIvaniv 390841bbf0
feat(editor): Enhance Node Creator actions view (#5954)
* WIP

* WIP

* Extract actions into composable

* WIP: Preserve categories when searching

* WIP

* WIP: Tweak styles

* WIP: Refactor node creator

* WIP: Finish Node Creator node view/subcategories refactor

* WIP: Finished actions refactor

* Cleanup & Lintfix

* WIP: Improve memory managment

* Fix interactions

* WIP

* WIP: Keyboard navigation

* Improve keyboard navigation and memory managment

* Finished view refactor

* FIx custom api calls and activation callouts

* Fix actions tracking and cleanup

* Product review fixes

* Telemetry fixes

* Fix node creator e2es

* Set action name font size and actionsEmpty font weight

* Fix failing credentials spec

* Make sure to select first action item when switching from nodes panel to actions panel

* Add actions panel e2e tests

* Cleanup

* Fix actions generation and cleanup

* Add correct Learn More link and adjust displaying of trigger icon

* Change trigger icon condition to use nodeType group

* Cleanup nodeTypesUtils and snapshots and lintfixes

* Lint fixes

* Refine logic to show trigger icon in node creator

* Add unit tests & clean up

* Add `003_auto_insert_action` experiment, hide empty sections for opposite root view

* Lintfix

* Do not show empty category tooltips and only show activation callout in triger root view

* Fix no-results node creator view

* Spacings tweaks and root rendering logic adjustment

* Add unit tests

* Lint and e2e fixes

* Revert CLI changes, fix unit tests

* Remove useless comments

* Sync master, replace $externalHooks mixin

* Lint fix

* Focus first action when panel slides in, not category

* Address PR comments

* Lint fix

* Remove `setAddedNodeActionParameters` optional track param

* Further simplify setAddedNodeActionParameters

* Fix pnpn lock file

* Fix types imports

* Fix 13-pinning spec
2023-04-26 09:18:10 +02:00

63 lines
2.4 KiB
TypeScript

import { BasePage } from '../base';
import { INodeTypeDescription } from 'n8n-workflow';
export class NodeCreator extends BasePage {
url = '/workflow/new';
getters = {
plusButton: () => cy.getByTestId('node-creator-plus-button'),
canvasAddButton: () => cy.getByTestId('canvas-add-button'),
searchBar: () => cy.getByTestId('search-bar'),
getCategoryItem: (label: string) => cy.get(`[data-keyboard-nav-id="${label}"]`),
getCreatorItem: (label: string) =>
this.getters.creatorItem().contains(label).parents('[data-test-id="item-iterator-item"]'),
getNthCreatorItem: (n: number) => this.getters.creatorItem().eq(n),
nodeCreator: () => cy.getByTestId('node-creator'),
nodeCreatorTabs: () => cy.getByTestId('node-creator-type-selector'),
selectedTab: () => this.getters.nodeCreatorTabs().find('.is-active'),
categorizedItems: () => cy.getByTestId('categorized-items'),
creatorItem: () => cy.getByTestId('item-iterator-item'),
categoryItem: () => cy.getByTestId('node-creator-category-item'),
communityNodeTooltip: () => cy.getByTestId('node-item-community-tooltip'),
noResults: () => cy.getByTestId('node-creator-no-results'),
nodeItemName: () => cy.getByTestId('node-creator-item-name'),
activeSubcategory: () => cy.getByTestId('nodes-list-header'),
expandedCategories: () =>
this.getters.creatorItem().find('>div').filter('.active').invoke('text'),
};
actions = {
openNodeCreator: () => {
this.getters.plusButton().click();
this.getters.nodeCreator().should('be.visible');
},
selectNode: (displayName: string) => {
this.getters.getCreatorItem(displayName).click();
},
toggleCategory: (category: string) => {
this.getters.getCreatorItem(category).click();
},
categorizeNodes: (nodes: INodeTypeDescription[]) => {
const categorizedNodes = nodes.reduce((acc, node) => {
const categories = (node?.codex?.categories || []).map((category: string) =>
category.trim(),
);
categories.forEach((category: { [key: string]: INodeTypeDescription[] }) => {
// Node creator should show only the latest version of a node
const newerVersion = nodes.find(
(n: INodeTypeDescription) =>
n.name === node.name && (n.version > node.version || Array.isArray(n.version)),
);
if (acc[category] === undefined) {
acc[category] = [];
}
acc[category].push(newerVersion ?? node);
});
return acc;
}, {});
return categorizedNodes;
},
};
}