#359 4 tests are ready

cypress.json

@@ -0,0 +1,4 @@
+{
+  "viewportWidth": 1200,
+  "viewportHeight": 1000
+}

cypress/fixtures/Visuall_User_Profile.vall

@@ -0,0 +1 @@
+{"userPref":{"isAutoIncrementalLayoutOnChange":true,"isHighlightOnHover":false,"isShowOverviewWindow":false,"isShowEdgeLabels":true,"isIgnoreCaseInText":false,"isOnlyHighlight4LatestQuery":true,"isStoreUserProfile":true,"isCollapseEdgesBasedOnType":false,"isCollapseMultiEdgesOnLoad":true,"isLimitDbQueries2range":true,"dbQueryTimeRange":{"start":-5364669352000,"end":4102434000000},"savedLists":{"numberLists":[],"stringLists":[],"enumLists":[]},"dataPageSize":15,"queryHistoryLimit":10,"dbTimeout":10,"tableColumnLimit":3,"highlightStyles":[{"wid":3,"color":"#6fccd3"},{"wid":3,"color":"#00ffff"},{"wid":3,"color":"#04f06a"},{"wid":3,"color":"#ff0138"}],"currHighlightIdx":3,"selectionColor":"#6c757d","selectionWidth":4.5,"groupingOption":0,"mergedElemIndicator":2,"nodeLabelWrap":0,"compoundPadding":"5%","edgeCollapseLimit":2,"avgNodeSize":40,"objectInclusionType":0,"timebar":{"isEnabled":false,"playingStep":50,"playingPeriod":1350,"zoomingStep":50,"statsInclusionType":0,"isHideDisconnectedNodesOnAnim":false,"isMaintainGraphRange":false,"graphRangeRatio":0.33}}}

cypress/helper.js

@@ -0,0 +1,48 @@
+export const URL = 'http://localhost:4200/';
+
+export function open() {
+  cy.visit(URL);
+}
+
+/** click to open dropdown menu and then click to the action button
+ * @param  {string} dropdownBtn text shown on UI
+ * @param  {string} actionBtn text shown on UI
+ */
+export function navbarAction(dropdownBtn, actionBtn) {
+  cy.get('button.btn.btn-light.dropdown-toggle').contains(dropdownBtn).click();
+  cy.get('button.dropdown-item').contains(actionBtn).click();
+
+  cy.wait(3000);
+
+  if (dropdownBtn == 'Data' && actionBtn == 'Sample Data') {
+    cy.window().then((win) => {
+      expect(win.cy.nodes().length > 0).to.eq(true);
+    });
+  }
+  if (dropdownBtn == 'Data' && actionBtn == 'Clear Data') {
+    cy.window().then((win) => {
+      expect(win.cy.nodes().length == 0).to.eq(true);
+    });
+  }
+}
+
+/**
+ * @param  {string} subTab text shown on UI
+ */
+export function openSubTab(subTab) {
+  cy.get('b.va-heading2').contains(subTab).click();
+}
+
+/**
+ * @param  {string} s text shown on UI
+ */
+export function openTab(s) {
+  cy.get('a.nav-link').contains(s).click();
+}
+
+/** click to "Options" subheading
+ */
+export function click2options() {
+  cy.get('span.va-heading3').contains('Options').click();
+  cy.wait(250);
+}

cypress/integration/app.spec.js

@@ -0,0 +1,26 @@
+import { open, navbarAction } from '../helper';
+
+context('Global properties about Visuall', () => {
+
+  beforeEach(open);
+
+  it('TC1: Can show object properties by selecting', () => {
+    navbarAction('Data', 'Sample Data');
+    cy.window().then((win) => {
+      win.cy.nodes()[0].select();
+    });
+
+    cy.get('div#prop-tab.collapse.show').should('be.visible');
+  });
+
+  it('TC2: Can show object properties by selecting', () => {
+    cy.get('a.nav-link').contains('Settings').click();
+    cy.get('label').contains('Emphasize on hover').siblings('input[type="checkbox"]').first().should('not.to.be.checked');
+    cy.get('label').contains('Emphasize on hover').siblings('input[type="checkbox"]').first().check();
+    open();
+    cy.get('a.nav-link').contains('Settings').click();
+    cy.get('label').contains('Emphasize on hover').siblings('input[type="checkbox"]').first().should('be.checked');
+    cy.get('label').contains('Emphasize on hover').siblings('input[type="checkbox"]').first().should('be.checked');
+  });
+
+});

cypress/integration/filterByType.spec.js

@@ -0,0 +1,35 @@
+import { open, navbarAction, openSubTab } from '../helper';
+
+context('Global properties about Visuall', () => {
+
+  beforeEach(open);
+
+  it('TC1: Filter by node/edge type should show or hide based on type', () => {
+    navbarAction('Data', 'Sample Data');
+    // hide 'Person' node type
+    cy.get('a.filter-node-class').contains('Person').click();
+    cy.window().then((win) => {
+      expect(win.cy.$('node:visible').filter('.Person').length == 0).to.eq(true);
+    });
+
+    // show 'Person' node type
+    cy.get('a.filter-node-class').contains('Person').click();
+    cy.window().then((win) => {
+      expect(win.cy.$('node:visible').filter('.Person').length > 0).to.eq(true);
+    });
+
+    // hide 'ACTOR' edge type
+    cy.get('a.filter-edge-class').contains('ACTOR').click();
+    cy.window().then((win) => {
+      expect(win.cy.$('edge:visible').filter('.ACTOR').length == 0).to.eq(true);
+    });
+
+    // show 'ACTOR' edge type
+    cy.get('a.filter-edge-class').contains('ACTOR').click();
+    cy.window().then((win) => {
+      expect(win.cy.$('edge:visible').filter('.ACTOR').length > 0).to.eq(true);
+    });
+  });
+
+
+});

cypress/integration/generalQueries.spec.js

@@ -0,0 +1,110 @@
+import { open, navbarAction, openSubTab, openTab, click2options } from '../helper';
+
+context('General Queries implemented in the backend side', () => {
+
+  beforeEach(open);
+
+  it('TC1: "Get Neigborhood" query should bring some nodes and edges', () => {
+    navbarAction('Data', 'Sample Data');
+    openTab('Database');
+
+    cy.get('select.custom-select:visible').select('Get neighborhood');
+
+    cy.get('img[title="Select nodes to add"]').click();
+
+    cy.window().then((win) => {
+      win.cy.nodes()[0].select();
+    });
+
+    cy.get('img[title="Complete selection"]').click();
+
+    navbarAction('Data', 'Clear Data');
+    cy.wait(1000);
+
+    cy.get('input.form-check-input:visible').eq(0).check();
+    cy.get('input[value="Execute"]:visible').click();
+
+    cy.wait(3000);
+
+    cy.window().then((win) => {
+      expect(win.cy.nodes().length > 3).to.eq(true);
+      expect(win.cy.edges().length > 3).to.eq(true);
+    });
+  });
+
+
+  it('TC2: "Get graph of interest" query should bring some nodes and edges', () => {
+    navbarAction('Data', 'Sample Data');
+    openTab('Database');
+
+    cy.get('select.custom-select:visible').select('Get graph of interest');
+
+    cy.get('img[title="Select nodes to add"]').click();
+
+    cy.window().then((win) => {
+      win.cy.$id('n1').select();
+      win.cy.$id('n4').select();
+    });
+
+    cy.get('img[title="Complete selection"]').click();
+
+    navbarAction('Data', 'Clear Data');
+    cy.wait(1000);
+
+    click2options();
+    cy.get('input.form-control.inp-3-char:visible').clear();
+    cy.get('input.form-control.inp-3-char:visible').type(4);
+    // uncheck directed
+    cy.get('input[type="checkbox"].form-check-input:visible').uncheck();
+    click2options();
+
+    // check graph
+    cy.get('input[type="checkbox"].form-check-input:visible').eq(0).check();
+    cy.get('input[value="Execute"]:visible').click();
+
+    cy.wait(3000);
+
+    cy.window().then((win) => {
+      expect(win.cy.nodes().length > 2).to.eq(true);
+      expect(win.cy.edges().length > 2).to.eq(true);
+    });
+  });
+
+
+  it('TC3: "Get common targets/regulators" query should bring some nodes and edges', () => {
+    navbarAction('Data', 'Sample Data');
+    openTab('Database');
+
+    cy.get('select.custom-select:visible').select('Get common targets/regulators');
+
+    cy.get('img[title="Select nodes to add"]').click();
+
+    cy.window().then((win) => {
+      win.cy.$id('n1').select();
+      win.cy.$id('n4').select();
+    });
+
+    cy.get('img[title="Complete selection"]').click();
+
+    navbarAction('Data', 'Clear Data');
+    cy.wait(1000);
+
+    click2options();
+
+    // uncheck directed
+    cy.get('input[type="checkbox"].form-check-input:visible').uncheck();
+    click2options();
+
+    // check graph
+    cy.get('input[type="checkbox"].form-check-input:visible').eq(0).check();
+    cy.get('input[value="Execute"]:visible').click();
+
+    cy.wait(3000);
+
+    cy.window().then((win) => {
+      expect(win.cy.nodes().length > 2).to.eq(true);
+      expect(win.cy.edges().length > 2).to.eq(true);
+    });
+  });
+
+});

cypress/integration/graphTheoreticProperty.spec.js

@@ -0,0 +1,20 @@
+import { open, navbarAction, openSubTab } from '../helper';
+
+context('Global properties about Visuall', () => {
+
+  beforeEach(open);
+
+  it('TC1: Can calculate degree centrality and set widths', () => {
+    navbarAction('Data', 'Sample Data');
+    openSubTab('Calculate Theoretic Property');
+
+    cy.get('select.custom-select.std-inp-hei.tight-select:visible').select('Degree Centrality');
+    cy.get('input[value="Execute"]:visible').click();
+
+    cy.window().then((win) => {
+      expect(win.cy.$id('n0').width() == 60).to.eq(true);
+      expect(win.cy.$id('n4').width() > 45).to.eq(true);
+    });
+  });
+
+});

cypress/plugins/index.js

@@ -0,0 +1,22 @@
+/// <reference types="cypress" />
+// ***********************************************************
+// This example plugins/index.js can be used to load plugins
+//
+// You can change the location of this file or turn off loading
+// the plugins file with the 'pluginsFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/plugins-guide
+// ***********************************************************
+
+// This function is called when a project is opened or re-opened (e.g. due to
+// the project's config changing)
+
+/**
+ * @type {Cypress.PluginConfig}
+ */
+// eslint-disable-next-line no-unused-vars
+module.exports = (on, config) => {
+  // `on` is used to hook into various events Cypress emits
+  // `config` is the resolved Cypress config
+}

cypress/support/commands.js

@@ -0,0 +1,25 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })

cypress/support/index.js

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/index.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

package.json

@@ -14,7 +14,8 @@
     "heroku-postbuild": "ng build --configuration=heroku && node time-stamper.js",
     "prod": "ng build --prod && node server.js",
     "serve-public": "ng serve --host 0.0.0.0",
-    "build-prod": "ng build --prod && node time-stamper.js"
+    "build-prod": "ng build --prod && node time-stamper.js",
+    "cy": "cypress open"
   },
   "private": true,
   "dependencies": {
@@ -62,6 +63,7 @@
     "@types/node": "^14.14.36",
     "codelyzer": "^6.0.1",
     "css": "^3.0.0",
+    "cypress": "^7.3.0",
     "enhanced-resolve": "^5.7.0",
     "jasmine-core": "~3.7.1",
     "jasmine-spec-reporter": "~6.0.0",
@@ -75,6 +77,13 @@
     "tslint": "^6.1.3",
     "typescript": "~4.1.3"
   },
+  "browserslist": [
+    "> 0.5%",
+    "last 2 versions",
+    "Firefox ESR",
+    "not dead",
+    "not IE 9-11"
+  ],
   "author": "i-Vis Research Lab",
   "license": "iVis",
   "bugs": {