alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(examples): update custom node example, create rich example

Browse Source
This commit is contained in:
moklick
2019-10-23 20:38:36 +02:00
parent 5acfacb885
commit 6a4c43df4b
30 changed files with 569 additions and 2574 deletions
Download Patch File Download Diff File Expand all files Collapse all files
cypress/integration/flow/custom-node.js
+10
View File
@@ -0,0 +1,10 @@
describe('Custom Node Graph Rendering', () => {
it('renders a graph', () => {
cy.visit('/custom-node');
cy.get('.react-flow__renderer');
cy.get('.react-flow__node').should('have.length', 4);
cy.get('.react-flow__edge').should('have.length', 3);
});
});
cypress/integration/flow/custom-nodes.js
-55
View File
@@ -1,55 +0,0 @@
describe('Custom Nodes Graph Rendering', () => {
it('renders a flow with sone nodes', () => {
cy.visit('/');
cy.get('.react-flow__renderer');
cy.get('.react-flow__node').should('have.length', 8);
cy.get('.react-flow__edge').should('have.length', 8);
});
it('renders a grid', () => {
cy.get('.react-flow__grid');
const gridStroke = Cypress.$('.react-flow__grid path').attr('fill');
expect(gridStroke).to.equal('#888');
});
it('connects nodes', () => {
cy.get('.react-flow__node')
.contains('1 Tests')
.find('.react-flow__handle.source')
.trigger('mousedown', { which: 1 });
cy.get('.react-flow__node')
.contains('7 output')
.find('.react-flow__handle.target')
.trigger('mousemove')
.should('have.class', 'connecting')
.should('have.class', 'valid')
.trigger('mouseup', { force: true })
.should('not.have.class', 'valid')
.should('not.have.class', 'connecting');
cy.get('.react-flow__edge').should('have.length', 9);
});
it('tries to make invalid connection', () => {
cy.get('.react-flow__node')
.contains('write something')
.parents('.react-flow__node')
.find('.react-flow__handle.source')
.trigger('mousedown', { which: 1 });
cy.get('.react-flow__node')
.contains('5 Another node')
.find('.react-flow__handle.target')
.trigger('mousemove')
.should('have.class', 'connecting')
.should('not.have.class', 'valid')
.trigger('mouseup', { force: true })
.should('not.have.class', 'connecting');
cy.get('.react-flow__edge').should('have.length', 9);
});
});
cypress/integration/flow/rich.spec.js
+17
View File
@@ -0,0 +1,17 @@
describe('Rich Graph Rendering', () => {
it('renders a graph', () => {
cy.visit('/');
cy.get('.react-flow__renderer');
cy.get('.react-flow__node').should('have.length', 6);
cy.get('.react-flow__edge').should('have.length', 5);
});
it('renders a grid', () => {
cy.get('.react-flow__grid');
const gridStroke = Cypress.$('.react-flow__grid path').attr('fill');
expect(gridStroke).to.equal('#888');
});
});