cypress: Initial integration of cypress test framework.

Change-Id: Ibf300b33d32ce3e7f1affbaf0a59364ddb618b56

Makefile.am

@@ -14,7 +14,7 @@ endif
 
 else
 
-SUBDIRS = . test loleaflet
+SUBDIRS = . test loleaflet cypress_test
 
 export ENABLE_DEBUG
 

configure.ac

@@ -960,6 +960,7 @@ AC_CONFIG_FILES([Makefile
                  android/lib/libSettings.gradle
                  android/lib/src/main/cpp/CMakeLists.txt
                  android/Makefile
+                 cypress_test/Makefile
                  gtk/Makefile
                  ios/config.h
                  ios/Mobile/Info.plist

cypress_test/.gitignore

@@ -0,0 +1,2 @@
+node_modules
+cypress/

cypress_test/Makefile.am

@@ -0,0 +1,37 @@
+CYPRESS_BINARY = ${top_srcdir}/cypress_test/node_modules/cypress/bin/cypress
+
+DESKTOP_TEST_FOLDER = integration_tests/desktop
+MOBILE_TEST_FOLDER = integration_tests/mobile
+MOBILE_USER_AGENT = "cypress mobile test"
+
+check-local: @JAILS_PATH@
+	@npm install
+	@echo
+	@pkill loolwsd || true
+	@echo "Launching loolwsd for testing.."
+	@fc-cache "@LO_PATH@"/share/fonts/truetype
+	@cp $(top_srcdir)/test/data/hello.odt $(top_srcdir)/test/data/hello-world.odt
+	@cp $(top_srcdir)/test/data/hello.ods $(top_srcdir)/test/data/hello-world.ods
+	@cp $(top_srcdir)/test/data/hello.odp $(top_srcdir)/test/data/hello-world.odp
+	@echo
+	../loolwsd --o:sys_template_path="@SYSTEMPLATE_PATH@" \
+			--o:child_root_path="@JAILS_PATH@" --o:storage.filesystem[@allow]=true \
+			--o:ssl.cert_file_path="$(abs_top_srcdir)/etc/cert.pem" \
+			--o:ssl.key_file_path="$(abs_top_srcdir)/etc/key.pem" \
+			--o:ssl.ca_file_path="$(abs_top_srcdir)/etc/ca-chain.cert.pem" \
+			--o:admin_console.username=admin --o:admin_console.password=admin \
+			--o:logging.file[@enable]=true --o:logging.level=trace > /dev/null 2>&1 &
+	@sleep 10
+	@echo
+	@echo "Running cypress desktop tests..."
+	@echo
+	$(CYPRESS_BINARY) run --browser chrome --config integrationFolder=$(DESKTOP_TEST_FOLDER),video=false --headless
+	@echo
+	@echo "Running cypress mobile tests..."
+	@echo
+	$(CYPRESS_BINARY) run --browser chrome --config integrationFolder=$(MOBILE_TEST_FOLDER),video=false,userAgent=$(MOBILE_USER_AGENT) --headless
+	@pkill loolwsd || true
+
+clean-local:
+	rm -rf node_modules
+	rm -rf cypress

cypress_test/cypress.json

@@ -0,0 +1,3 @@
+{
+    "integrationFolder": "integration_tests"
+}

cypress_test/integration_tests/desktop/example_desktop_test_spec.js

@@ -0,0 +1,29 @@
+describe('Example test suit 1', function() {
+  it('Example test case 1', function() {
+    // Open test documnt
+    cy.visit('http://localhost:9980/loleaflet/fc04ba550/loleaflet.html?file_path=file:///home/zolnai/libreoffice/online/test/data/hello-world.odt')
+
+    // Wait for the document to fully load (TODO: find an item which we can be used to wait for instead)
+    cy.wait(1000)
+
+    // Select a text
+    cy.get('#document-container').dblclick()
+    cy.get(".leaflet-marker-icon")
+
+    // Click on bold toolbar button
+    cy.get('#tb_editbar_item_bold').click()
+
+    // Remove selection and do a reselection
+    cy.get('#document-container').click()
+    cy.get('.leaflet-marker-icon').should('not.be.visible');
+
+    cy.get('#document-container').dblclick()
+    cy.get(".leaflet-marker-icon")
+
+    // Bold toolbar button is checked
+    cy.get('#tb_editbar_item_bold table.w2ui-button.checked')
+
+    // Click on bold toolbar button
+    cy.get('#tb_editbar_item_bold').click()
+  })
+})

cypress_test/integration_tests/desktop/example_desktop_test_spec2.js

@@ -0,0 +1,29 @@
+describe('Example test suit 2', function() {
+  it('Example test case 1', function() {
+    // Open test documnt
+    cy.visit('http://localhost:9980/loleaflet/fc04ba550/loleaflet.html?file_path=file:///home/zolnai/libreoffice/online/test/data/hello-world.odt')
+
+    // Wait for the document to fully load (TODO: find an item which we can be used to wait for instead)
+    cy.wait(1000)
+
+    // Select a text
+    cy.get('#document-container').dblclick()
+    cy.get(".leaflet-marker-icon")
+
+    // Click on bold toolbar button
+    cy.get('#tb_editbar_item_italic').click()
+
+    // Remove selection and do a reselection
+    cy.get('#document-container').click()
+    cy.get('.leaflet-marker-icon').should('not.be.visible');
+
+    cy.get('#document-container').dblclick()
+    cy.get(".leaflet-marker-icon")
+
+    // Bold toolbar button is checked
+    cy.get('#tb_editbar_item_italic table.w2ui-button.checked')
+
+    // Click on bold toolbar button
+    cy.get('#tb_editbar_item_italic').click()
+  })
+})

cypress_test/integration_tests/mobile/example_mobile_test_spec.js

@@ -0,0 +1,21 @@
+describe('Example test suit 1', function() {
+  it('Example test case 1', function() {
+    // Open test documnt
+    cy.viewport('iphone-3')
+    cy.visit('http://localhost:9980/loleaflet/fc04ba550/loleaflet.html?file_path=file:///home/zolnai/libreoffice/online/test/data/hello-world.odt')
+
+    // Wait for the document to fully load (TODO: find an item which we can be used to wait for instead)
+    cy.wait(1000)
+
+    // Mobile wizard toolbar button is disabled by default
+    cy.get('#tb_actionbar_item_mobile_wizard')
+      .should('have.class', 'disabled')
+
+    // Click on edit button
+    cy.get('#mobile-edit-button').click()
+
+    // Mobile wizard should be enabled now
+    cy.get('#tb_actionbar_item_mobile_wizard')
+      .should('not.have.class', 'disabled')
+  })
+})

cypress_test/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "cypress_test",
+  "version": "1.0.0",
+  "description": "Cypress integration test suit",
+  "license": "MPL-2.0",
+  "dependencies": {
+    "cypress": "3.8.1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git://gerrit.libreoffice.org/online.git"
+  },
+  "scripts": {
+    "cy_run": "node_modules/cypress/bin/cypress run",
+    "cy_open": "node_modules/cypress/bin/cypress open"
+  }
+}

loleaflet/src/control/Control.Toolbar.js

@@ -11,6 +11,10 @@ var map;
 
 // has to match small screen size requirement
 function _inMobileMode() {
+	if (L.Browser.cypressMobileTest) {
+		return true;
+	}
+
 	return L.Browser.mobile && screen.width < 768;
 }
 

loleaflet/src/core/Browser.js

@@ -32,6 +32,7 @@
 	    win = navigator.platform.indexOf('Win') === 0,
 
 	    mobile = typeof orientation !== 'undefined' || ua.indexOf('mobile') !== -1,
+	    cypressMobileTest = ua.indexOf('cypress mobile test') !== -1,
 	    msPointer = !window.PointerEvent && window.MSPointerEvent,
 	    pointer = (window.PointerEvent && navigator.pointerEnabled && navigator.maxTouchPoints) || msPointer,
 
@@ -136,6 +137,9 @@
 		// `true` for gecko-based browsers running in a mobile device.
 		mobileGecko: mobile && gecko,
 
+		// @property cypressMobileTest: Boolean
+		// `true` when running cypress in mobile mode
+		cypressMobileTest: cypressMobileTest,
 
 		// @property touch: Boolean
 		// `true` for all browsers supporting [touch events](https://developer.mozilla.org/docs/Web/API/Touch_events).