diff --git a/.gitignore b/.gitignore
index 1eb3e5a5..e2574576 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,9 @@
.gitk*
.idea/*
.DS_Store
+yarn-error.log
+yarn.lock
node_modules/*
SlickgridRelease*
-nuget*
\ No newline at end of file
+nuget*
+testresult.xml
\ No newline at end of file
diff --git a/.npmignore b/.npmignore
index da76d0e8..04c502da 100644
--- a/.npmignore
+++ b/.npmignore
@@ -5,3 +5,4 @@ examples
nuget*
SlickgridRelease*
tests
+testresult.xml
\ No newline at end of file
diff --git a/.vscode/tasks.json b/.vscode/tasks.json
new file mode 100644
index 00000000..dc1b9ac0
--- /dev/null
+++ b/.vscode/tasks.json
@@ -0,0 +1,17 @@
+{
+ "version": "2.0.0",
+ "tasks": [
+ {
+ "label": "Cypress Open GUI",
+ "type": "shell",
+ "command": "yarn run cypress:open",
+ "problemMatcher": []
+ },
+ {
+ "label": "Cypress CI",
+ "type": "shell",
+ "command": "yarn run cypress:ci",
+ "problemMatcher": []
+ }
+ ]
+}
diff --git a/cypress.json b/cypress.json
new file mode 100644
index 00000000..bd04c125
--- /dev/null
+++ b/cypress.json
@@ -0,0 +1,7 @@
+{
+ "baseUrl": "https://6pac.github.io/SlickGrid",
+ "baseExampleUrl": "https://6pac.github.io/SlickGrid/examples",
+ "video": false,
+ "viewportWidth": 1200,
+ "viewportHeight": 800
+ }
diff --git a/cypress/integration/exampleGridMenu.spec.js b/cypress/integration/exampleGridMenu.spec.js
new file mode 100644
index 00000000..739db7bd
--- /dev/null
+++ b/cypress/integration/exampleGridMenu.spec.js
@@ -0,0 +1,70 @@
+///
+
+describe('Example - Grid Menu', () => {
+ const fullTitles = ['#', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
+ const titlesWithoutId = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
+
+
+ it('should display Example Grid Menu', () => {
+ cy.visit(`${Cypress.config('baseExampleUrl')}/example-grid-menu.html`);
+ cy.get('h2').should('contain', 'Demonstrates:');
+ cy.contains('This example demonstrates using the Slick.Controls.GridMenu ');
+ });
+
+ it('should have exact Column Titles in the grid', () => {
+ cy.get('#myGrid')
+ .find('.slick-header-columns')
+ .children()
+ .each(($child, index) => expect($child.text()).to.eq(fullTitles[index]));
+ });
+
+ it('should click on the Grid Menu to hide the column A from being displayed', () => {
+ cy.get('#myGrid')
+ .find('button.slick-gridmenu-button')
+ .trigger('click')
+ .click();
+
+ cy.get('#myGrid')
+ .get('.slick-gridmenu:visible')
+ .find('.slick-gridmenu-list')
+ .children('li:nth-child(1)')
+ .children('label')
+ .should('contain', 'A')
+ .click();
+
+ cy.get('#myGrid')
+ .get('.slick-gridmenu:visible')
+ .find('span.close')
+ .trigger('click')
+ .click();
+
+ const smallerTitleList = titlesWithoutId.slice(1);
+ cy.get('#myGrid')
+ .find('.slick-header-columns')
+ .children()
+ .each(($child, index) => expect($child.text()).to.eq(smallerTitleList[index]));
+ });
+
+ it('should click on the External Grid Menu to show the column A as 1st column again', () => {
+ cy.get('button')
+ .contains('Grid Menu')
+ .trigger('click')
+ .click();
+
+ cy.get('#myGrid')
+ .get('.slick-gridmenu:visible')
+ .find('.slick-gridmenu-list')
+ .children('li:nth-child(1)')
+ .children('label')
+ .should('contain', 'A')
+ .click();
+
+ cy.get('[data-dismiss=slick-gridmenu]')
+ .click({ force: true });
+
+ cy.get('#myGrid')
+ .find('.slick-header-columns')
+ .children()
+ .each(($child, index) => expect($child.text()).to.eq(titlesWithoutId[index]));
+ });
+});
diff --git a/cypress/plugins/index.js b/cypress/plugins/index.js
new file mode 100644
index 00000000..fd170fba
--- /dev/null
+++ b/cypress/plugins/index.js
@@ -0,0 +1,17 @@
+// ***********************************************************
+// 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)
+
+module.exports = (on, config) => {
+ // `on` is used to hook into various events Cypress emits
+ // `config` is the resolved Cypress config
+}
diff --git a/cypress/support/commands.js b/cypress/support/commands.js
new file mode 100644
index 00000000..c1f5a772
--- /dev/null
+++ b/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 is will overwrite an existing command --
+// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
diff --git a/cypress/support/index.js b/cypress/support/index.js
new file mode 100644
index 00000000..d68db96d
--- /dev/null
+++ b/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')
diff --git a/examples/example-grid-menu.html b/examples/example-grid-menu.html
index 382f89a7..21a34406 100644
--- a/examples/example-grid-menu.html
+++ b/examples/example-grid-menu.html
@@ -46,7 +46,7 @@
Demonstrates:
Possibility to attach the Grid Menu to an external button (try clicking on the button below).
You can also use some events like "onMenuClose()" and to trigger a resize of the columns with "autosizeColumns()" when "forceFitColumns: false"
-
+
Always show vertical scroll (with "alwaysShowVerticalScroll" flag), so that it works with small and large dataset.
diff --git a/package.json b/package.json
index b0eaacaa..abf9f27d 100644
--- a/package.json
+++ b/package.json
@@ -16,8 +16,8 @@
"grid"
],
"author": "Michael Leibman ",
- "contributors": [
- "Ben McIntyre "
+ "contributors": [
+ "Ben McIntyre "
],
"license": "MIT",
"bugs": {
@@ -25,10 +25,14 @@
},
"homepage": "https://github.com/6pac/SlickGrid#readme",
"scripts": {
- "test": "echo \"Error: no test specified\" && exit 1"
+ "cypress:ci": "node node_modules/cypress/bin/cypress run --reporter xunit --reporter-options output=testresult.xml",
+ "cypress:open": "node node_modules/cypress/bin/cypress open"
},
"dependencies": {
"jquery": ">=1.8.0",
"jquery-ui": ">=1.8.0"
+ },
+ "devDependencies": {
+ "cypress": "^3.3.1"
}
}