marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-22 17:56:43 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(tests): Interaction test - Security loose.

Browse Source
This commit is contained in:
Sidharth Vinod
2022-10-04 16:37:37 +08:00
parent 56add0756f
commit 2a9e56439e
2 changed files with 90 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

234
cypress/integration/other/interaction.spec.js
View File

@@ -1,266 +1,188 @@
describe('Interaction', () => { describe('Interaction', () => {
describe('Interaction - security level loose', () => { describe('Security level loose', () => {
it('Graph: should handle a click on a node with a bound function', () => { beforeEach(() => {
const url = 'http://localhost:9000/click_security_loose.html'; const url = 'http://localhost:9000/click_security_loose.html';
cy.viewport(1440, 1024); cy.viewport(1440, 1024);
cy.visit(url); cy.visit(url);
cy.get('body').find('g#flowchart-Function-4').click(); });
it('Graph: should handle a click on a node with a bound function', () => {
cy.contains('FunctionTest1').parents('.node').click();
cy.get('.created-by-click').should('have.text', 'Clicked By Flow'); cy.get('.created-by-click').should('have.text', 'Clicked By Flow');
}); });
it('Graph: should handle a click on a node with a bound function with args', () => { it('Graph: should handle a click on a node with a bound function with args', () => {
const url = 'http://localhost:9000/click_security_loose.html'; cy.contains('FunctionArgTest2').parents('.node').click();
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g#flowchart-FunctionArg-28').click();
cy.get('.created-by-click-2').should('have.text', 'Clicked By Flow: ARGUMENT'); cy.get('.created-by-click-2').should('have.text', 'Clicked By Flow: ARGUMENT');
}); });
it('Flowchart: should handle a click on a node with a bound function where the node starts with a number', () => { it('Flowchart: should handle a click on a node with a bound function where the node starts with a number', () => {
const url = 'http://localhost:9000/click_security_loose.html'; cy.contains('2FunctionArg').parents('.node').click();
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g[id="flowchart-FunctionArg-34"]').click();
cy.get('.created-by-click-2').should('have.text', 'Clicked By Flow: ARGUMENT'); cy.get('.created-by-click-2').should('have.text', 'Clicked By Flow: ARGUMENT');
}); });
it('Graph: should handle a click on a node with a bound url', () => { it('Graph: should handle a click on a node with a bound url', () => {
const url = 'http://localhost:9000/click_security_loose.html'; // When there is a URL, cy.contains selects the a tag instead of the span. The .node is a child of a, so we have to use find instead of parent.
cy.viewport(1440, 1024); cy.contains('URLTest1').find('.node').click();
cy.visit(url); cy.location().should(({ href }) => {
cy.get('body').find('#flowchart-URL-5').click(); expect(href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
it('Graph: should handle a click on a node with a bound url where the node starts with a number', () => { it('Graph: should handle a click on a node with a bound url where the node starts with a number', () => {
const url = 'http://localhost:9000/click_security_loose.html'; cy.contains('2URL').find('.node').click();
cy.viewport(1440, 1024); cy.location().should(({ href }) => {
cy.visit(url); expect(href).to.eq('http://localhost:9000/webpackUsage.html');
cy.get('body').find('g[id="flowchart-2URL-11"]').click();
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
}); });
}); });
it('Flowchart-v2: should handle a click on a node with a bound function', () => { it('Flowchart-v2: should handle a click on a node with a bound function', () => {
const url = 'http://localhost:9000/click_security_loose.html'; cy.contains('FunctionTest2').parents('.node').click();
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g#flowchart-Function-16').click();
cy.get('.created-by-click').should('have.text', 'Clicked By Flow'); cy.get('.created-by-click').should('have.text', 'Clicked By Flow');
}); });
it('Flowchart-v2: should handle a click on a node with a bound function where the node starts with a number', () => { it('Flowchart-v2: should handle a click on a node with a bound function where the node starts with a number', () => {
const url = 'http://localhost:9000/click_security_loose.html'; cy.contains('10Function').parents('.node').click();
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g[id="flowchart-1Function-22"]').click();
cy.get('.created-by-click').should('have.text', 'Clicked By Flow'); cy.get('.created-by-click').should('have.text', 'Clicked By Flow');
}); });
it('Flowchart-v2: should handle a click on a node with a bound url', () => { it('Flowchart-v2: should handle a click on a node with a bound url', () => {
const url = 'http://localhost:9000/click_security_loose.html'; cy.contains('URLTest2').find('.node').click();
cy.viewport(1440, 1024); cy.location().should(({ href }) => {
cy.visit(url); expect(href).to.eq('http://localhost:9000/webpackUsage.html');
cy.get('body').find('#flowchart-URL-17').click(); });
});
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
it('Flowchart-v2: should handle a click on a node with a bound url where the node starts with a number', () => { it('Flowchart-v2: should handle a click on a node with a bound url where the node starts with a number', () => {
const url = 'http://localhost:9000/click_security_loose.html'; // cy.contains('').click();
cy.viewport(1440, 1024); cy.contains('20URL').find('.node').click();
cy.visit(url); cy.location().should(({ href }) => {
cy.get('body').find('g[id="flowchart-2URL-23"]').click(); expect(href).to.eq('http://localhost:9000/webpackUsage.html');
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
}); });
}); });
it('should handle a click on a task with a bound URL clicking on the rect', () => { it('should handle a click on a task with a bound URL clicking on the rect', () => {
const url = 'http://localhost:9000/click_security_loose.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('rect#cl1').click({ force: true }); cy.get('body').find('rect#cl1').click({ force: true });
cy.location().should(({ href }) => {
expect(href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
it('should handle a click on a task with a bound URL clicking on the text', () => { it('should handle a click on a task with a bound URL clicking on the text', () => {
const url = 'http://localhost:9000/click_security_loose.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('text#cl1-text').click({ force: true }); cy.get('body').find('text#cl1-text').click({ force: true });
cy.location().should(({ href }) => {
expect(href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
it('should handle a click on a task with a bound function without args', () => { it('should handle a click on a task with a bound function without args', () => {
const url = 'http://localhost:9000/click_security_loose.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('rect#cl2').click({ force: true }); cy.get('body').find('rect#cl2').click({ force: true });
cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant cl2'); cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant cl2');
}); });
it('should handle a click on a task with a bound function with args', () => {
const url = 'http://localhost:9000/click_security_loose.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('rect#cl3').click({ force: true });
it('should handle a click on a task with a bound function with args', () => {
cy.get('body').find('rect#cl3').click({ force: true });
cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant test1 test2 test3'); cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant test1 test2 test3');
}); });
it('should handle a click on a task with a bound function without args', () => { it('should handle a click on a task with a bound function without args', () => {
const url = 'http://localhost:9000/click_security_loose.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('text#cl2-text').click({ force: true }); cy.get('body').find('text#cl2-text').click({ force: true });
cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant cl2'); cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant cl2');
}); });
it('should handle a click on a task with a bound function with args ', () => {
const url = 'http://localhost:9000/click_security_loose.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('text#cl3-text').click({ force: true });
it('should handle a click on a task with a bound function with args ', () => {
cy.get('body').find('text#cl3-text').click({ force: true });
cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant test1 test2 test3'); cy.get('.created-by-gant-click').should('have.text', 'Clicked By Gant test1 test2 test3');
}); });
}); });
describe('Interaction - security level tight', () => { describe('Interaction - security level tight', () => {
beforeEach(() => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
});
it('should handle a click on a node without a bound function', () => { it('should handle a click on a node without a bound function', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g#flowchart-Function-4').click(); cy.get('body').find('g#flowchart-Function-4').click();
cy.get('.created-by-click').should('not.exist'); cy.get('.created-by-click').should('not.exist');
// cy.get('.created-by-click').should('not.have.text', 'Clicked By Flow');
}); });
it('should handle a click on a node with a bound function where the node starts with a number', () => { it('should handle a click on a node with a bound function where the node starts with a number', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g[id="flowchart-1Function-10"]').click(); cy.get('body').find('g[id="flowchart-1Function-10"]').click();
// cy.get('.created-by-click').should('not.have.text', 'Clicked By Flow');
cy.get('.created-by-click').should('not.exist'); cy.get('.created-by-click').should('not.exist');
}); });
it('should handle a click on a node with a bound url', () => { it('should handle a click on a node with a bound url', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g#flowchart-URL-5').click(); cy.get('body').find('g#flowchart-URL-5').click();
cy.location().should(({ href }) => {
expect(href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
it('should handle a click on a node with a bound url where the node starts with a number', () => { it('should handle a click on a node with a bound url where the node starts with a number', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g[id="flowchart-2URL-11"]').click(); cy.get('body').find('g[id="flowchart-2URL-11"]').click();
cy.location().should(({ href }) => {
cy.location().should((location) => { expect(href).to.eq('http://localhost:9000/webpackUsage.html');
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
}); });
}); });
it('should handle a click on a task with a bound URL clicking on the rect', () => { it('should handle a click on a task with a bound URL clicking on the rect', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('rect#cl1').click({ force: true }); cy.get('body').find('rect#cl1').click({ force: true });
cy.location().should(({ href }) => {
expect(href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
it('should handle a click on a task with a bound URL clicking on the text', () => { it('should handle a click on a task with a bound URL clicking on the text', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('text#cl1-text').click({ force: true }); cy.get('body').find('text#cl1-text').click({ force: true });
cy.location().should(({ href }) => {
expect(href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
cy.location().should((location) => {
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
});
});
it('should handle a click on a task with a bound function', () => { it('should handle a click on a task with a bound function', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('rect#cl2').click({ force: true }); cy.get('body').find('rect#cl2').click({ force: true });
// cy.get('.created-by-gant-click').should('not.have.text', 'Clicked By Gant cl2');
cy.get('.created-by-gant-click').should('not.exist'); cy.get('.created-by-gant-click').should('not.exist');
}); });
it('should handle a click on a task with a bound function', () => {
const url = 'http://localhost:9000/click_security_strict.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('text#cl2-text').click({ force: true });
// cy.get('.created-by-gant-click').should('not.have.text', 'Clicked By Gant cl2'); it('should handle a click on a task with a bound function', () => {
cy.get('body').find('text#cl2-text').click({ force: true });
cy.get('.created-by-gant-click').should('not.exist'); cy.get('.created-by-gant-click').should('not.exist');
}); });
}); });
describe('Interaction - security level other, missspelling', () => { describe('Interaction - security level other, missspelling', () => {
beforeEach(() => {
const url = 'http://localhost:9000/click_security_other.html';
cy.viewport(1440, 1024);
cy.visit(url);
});
it('should handle a click on a node with a bound function', () => { it('should handle a click on a node with a bound function', () => {
const url = 'http://localhost:9000/click_security_other.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g#flowchart-Function-4').click(); cy.get('body').find('g#flowchart-Function-4').click();
// cy.get('.created-by-click').should('not.have.text', 'Clicked By Flow');
cy.get('.created-by-click').should('not.exist'); cy.get('.created-by-click').should('not.exist');
}); });
it('should handle a click on a node with a bound function where the node starts with a number', () => { it('should handle a click on a node with a bound function where the node starts with a number', () => {
const url = 'http://localhost:9000/click_security_other.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g[id="flowchart-1Function-10"]').click(); cy.get('body').find('g[id="flowchart-1Function-10"]').click();
cy.get('.created-by-click').should('not.exist'); cy.get('.created-by-click').should('not.exist');
cy.get('.created-by-click').should('not.exist'); cy.get('.created-by-click').should('not.exist');
}); });
it('should handle a click on a node with a bound url', () => { it('should handle a click on a node with a bound url', () => {
const url = 'http://localhost:9000/click_security_other.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('g#flowchart-URL-5').click(); cy.get('body').find('g#flowchart-URL-5').click();
cy.location().should(({ href }) => {
cy.location().should((location) => { expect(href).to.eq('http://localhost:9000/webpackUsage.html');
expect(location.href).to.eq('http://localhost:9000/webpackUsage.html');
}); });
}); });
it('should handle a click on a task with a bound function', () => { it('should handle a click on a task with a bound function', () => {
const url = 'http://localhost:9000/click_security_other.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('rect#cl2').click({ force: true }); cy.get('body').find('rect#cl2').click({ force: true });
cy.get('.created-by-gant-click').should('not.exist'); cy.get('.created-by-gant-click').should('not.exist');
}); });
it('should handle a click on a task with a bound function', () => { it('should handle a click on a task with a bound function', () => {
const url = 'http://localhost:9000/click_security_other.html';
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body').find('text#cl2-text').click({ force: true }); cy.get('body').find('text#cl2-text').click({ force: true });
cy.get('.created-by-gant-click').should('not.exist'); cy.get('.created-by-gant-click').should('not.exist');
}); });
}); });

26
cypress/platform/click_security_loose.html
View File

@@ -15,9 +15,9 @@
<div style="display: flex"> <div style="display: flex">
<pre id="FirstLine" class="mermaid"> <pre id="FirstLine" class="mermaid">
graph TB graph TB
Function-->URL FunctionTest1-->URLTest1
click Function clickByFlow "Add a div" click FunctionTest1 clickByFlow "Add a div"
click URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>" click URLTest1 "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>"
</pre> </pre>
<pre id="FirstLine" class="mermaid"> <pre id="FirstLine" class="mermaid">
graph TB graph TB
@@ -27,15 +27,15 @@
</pre> </pre>
<pre id="FirstLine" class="mermaid"> <pre id="FirstLine" class="mermaid">
flowchart TB flowchart TB
Function-->URL FunctionTest2-->URLTest2
click Function clickByFlow "Add a div" click FunctionTest2 clickByFlow "Add a div"
click URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>" _self click URLTest2 "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>" _self
</pre> </pre>
<pre id="FirstLine" class="mermaid"> <pre id="FirstLine" class="mermaid">
flowchart TB flowchart TB
1Function--->2URL 10Function--->20URL
click 1Function clickByFlow "Add a div" click 10Function clickByFlow "Add a div"
click 2URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>" _self click 20URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>" _self
</pre> </pre>
<pre id="FirstLine" class="mermaid"> <pre id="FirstLine" class="mermaid">
@@ -97,14 +97,14 @@
<div style="display: flex"> <div style="display: flex">
<pre id="FirstLine" class="mermaid"> <pre id="FirstLine" class="mermaid">
graph TB graph TB
FunctionArg-->URL FunctionArgTest2-->URL
click FunctionArg call clickByFlowArg(ARGUMENT) "Add a div" click FunctionArgTest2 call clickByFlowArg(ARGUMENT) "Add a div"
click URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>" click URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>"
</pre> </pre>
<pre id="FirstLine" class="mermaid"> <pre id="FirstLine" class="mermaid">
flowchart TB flowchart TB
FunctionArg-->URL 2FunctionArg-->URL
click FunctionArg call clickByFlowArg(ARGUMENT) "Add a div" click 2FunctionArg call clickByFlowArg(ARGUMENT) "Add a div"
click URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>" click URL "http://localhost:9000/webpackUsage.html" "Visit <strong>mermaid docs</strong>"
</pre> </pre>