n8n/cypress/e2e/4-node-creator.cy.ts
कारतोफ्फेलस्क्रिप्ट™ 845f0f9d20
refactor(core): Switch over all user-management routes to use decorators (#5115)
2023-01-27 11:19:47 +01:00

207 lines
7.7 KiB
TypeScript

import { NodeCreator } from '../pages/features/node-creator';
import { INodeTypeDescription } from 'n8n-workflow';
import CustomNodeFixture from '../fixtures/Custom_node.json';
import { DEFAULT_USER_EMAIL, DEFAULT_USER_PASSWORD } from '../constants';
import { randFirstName, randLastName } from '@ngneat/falso';
const email = DEFAULT_USER_EMAIL;
const password = DEFAULT_USER_PASSWORD;
const firstName = randFirstName();
const lastName = randLastName();
const nodeCreatorFeature = new NodeCreator();
describe('Node Creator', () => {
before(() => {
cy.resetAll();
cy.setup({ email, firstName, lastName, password });
});
beforeEach(() => {
cy.signin({ email, password });
cy.intercept('GET', '/types/nodes.json', (req) => {
// Delete caching headers so that we can intercept the request
['etag', 'if-none-match', 'if-modified-since'].forEach((header) => {
delete req.headers[header];
});
req.continue((res) => {
const nodes = res.body as INodeTypeDescription[];
nodes.push(CustomNodeFixture as INodeTypeDescription);
res.send(nodes);
});
}).as('nodesIntercept');
cy.visit(nodeCreatorFeature.url);
cy.waitForLoad();
});
it('should open node creator on trigger tab if no trigger is on canvas', () => {
nodeCreatorFeature.getters.canvasAddButton().click();
nodeCreatorFeature.getters
.nodeCreator()
.contains('When should this workflow run?')
.should('be.visible');
nodeCreatorFeature.getters.nodeCreatorTabs().should('not.exist');
});
it('should see all tabs when opening via plus button', () => {
nodeCreatorFeature.actions.openNodeCreator();
nodeCreatorFeature.getters.nodeCreatorTabs().should('exist');
nodeCreatorFeature.getters.selectedTab().should('have.text', 'Trigger');
});
it('should navigate subcategory', () => {
nodeCreatorFeature.actions.openNodeCreator();
nodeCreatorFeature.getters.getCreatorItem('On App Event').click();
nodeCreatorFeature.getters.activeSubcategory().should('have.text', 'On App Event');
// Go back
nodeCreatorFeature.getters.activeSubcategory().find('button').click();
nodeCreatorFeature.getters.activeSubcategory().should('not.exist');
});
it('should search for nodes', () => {
nodeCreatorFeature.actions.openNodeCreator();
nodeCreatorFeature.getters.selectedTab().should('have.text', 'Trigger');
nodeCreatorFeature.getters.searchBar().find('input').type('manual');
nodeCreatorFeature.getters.creatorItem().should('have.length', 1);
nodeCreatorFeature.getters.searchBar().find('input').clear().type('manual123');
nodeCreatorFeature.getters.creatorItem().should('have.length', 0);
nodeCreatorFeature.getters
.noResults()
.should('exist')
.should('contain.text', "We didn't make that... yet");
nodeCreatorFeature.getters.searchBar().find('input').clear().type('edit image');
nodeCreatorFeature.getters.creatorItem().should('have.length', 1);
nodeCreatorFeature.getters
.searchBar()
.find('input')
.clear()
.type('this node totally does not exist');
nodeCreatorFeature.getters.creatorItem().should('have.length', 0);
nodeCreatorFeature.getters.searchBar().find('input').clear();
nodeCreatorFeature.getters.getCreatorItem('On App Event').click();
nodeCreatorFeature.getters.searchBar().find('input').clear().type('edit image');
nodeCreatorFeature.getters.creatorItem().should('have.length', 0);
nodeCreatorFeature.getters
.noResults()
.should('exist')
.should('contain.text', 'To see all results, click here');
nodeCreatorFeature.getters.noResults().contains('click here').click();
nodeCreatorFeature.getters.nodeCreatorTabs().should('exist');
nodeCreatorFeature.getters.getCreatorItem('Edit Image').should('exist');
nodeCreatorFeature.getters.selectedTab().should('have.text', 'All');
nodeCreatorFeature.getters.searchBar().find('button').click();
nodeCreatorFeature.getters.searchBar().find('input').should('be.empty');
});
it('should add manual trigger node', () => {
nodeCreatorFeature.getters.canvasAddButton().click();
nodeCreatorFeature.getters.getCreatorItem('Manually').click();
// TODO: Replace once we have canvas feature utils
cy.get('span').contains('Back to canvas').click();
nodeCreatorFeature.getters.canvasAddButton().should('not.be.visible');
nodeCreatorFeature.getters.nodeCreator().should('not.exist');
// TODO: Replace once we have canvas feature utils
cy.get('div').contains('Add first step').should('exist');
});
it('check if non-core nodes are rendered', () => {
cy.wait('@nodesIntercept').then((interception) => {
const nodes = interception.response?.body as INodeTypeDescription[];
const categorizedNodes = nodeCreatorFeature.actions.categorizeNodes(nodes);
nodeCreatorFeature.actions.openNodeCreator();
nodeCreatorFeature.actions.selectTab('All');
const categories = Object.keys(categorizedNodes);
categories.forEach((category: string) => {
// Core Nodes contains subcategories which we'll test separately
if (category === 'Core Nodes') return;
nodeCreatorFeature.actions.toggleCategory(category);
// Check if all nodes are present
nodeCreatorFeature.getters.nodeItemName().then(($elements) => {
const visibleNodes: string[] = [];
$elements.each((_, element) => {
visibleNodes.push(element.textContent?.trim() || '');
});
const visibleCategoryNodes = (categorizedNodes[category] as INodeTypeDescription[])
.filter((node) => !node.hidden)
.map((node) => node.displayName?.trim());
cy.wrap(visibleCategoryNodes).each((categoryNode: string) => {
expect(visibleNodes).to.include(categoryNode);
});
});
nodeCreatorFeature.actions.toggleCategory(category);
});
});
});
it('should render and select community node', () => {
cy.wait('@nodesIntercept').then(() => {
const customCategory = 'Custom Category';
const customNode = 'E2E Node';
const customNodeDescription = 'Demonstrate rendering of node';
nodeCreatorFeature.actions.openNodeCreator();
nodeCreatorFeature.actions.selectTab('All');
nodeCreatorFeature.getters.getCreatorItem(customCategory).should('exist');
nodeCreatorFeature.actions.toggleCategory(customCategory);
nodeCreatorFeature.getters
.getCreatorItem(customNode)
.findChildByTestId('node-creator-item-tooltip')
.should('exist');
nodeCreatorFeature.getters
.getCreatorItem(customNode)
.contains(customNodeDescription)
.should('exist');
nodeCreatorFeature.actions.selectNode(customNode);
// TODO: Replace once we have canvas feature utils
cy.get('.data-display .node-name').contains(customNode).should('exist');
const nodeParameters = () => cy.getByTestId('node-parameters');
const firstParameter = () => nodeParameters().find('.parameter-item').eq(0);
const secondParameter = () => nodeParameters().find('.parameter-item').eq(1);
// Check correct fields are rendered
nodeParameters().should('exist');
// Test property text input
firstParameter().contains('Test property').should('exist');
firstParameter().find('input.el-input__inner').should('have.value', 'Some default');
// Resource select input
secondParameter().find('label').contains('Resource').should('exist');
secondParameter().find('input.el-input__inner').should('have.value', 'option2');
secondParameter().find('.el-select').click();
secondParameter().find('.el-select-dropdown__list').should('exist');
// Check if all options are rendered and select the fourth one
secondParameter().find('.el-select-dropdown__list').children().should('have.length', 4);
secondParameter()
.find('.el-select-dropdown__list')
.children()
.eq(3)
.contains('option4')
.should('exist')
.click();
secondParameter().find('input.el-input__inner').should('have.value', 'option4');
});
});
});