[Libreoffice-commits] online.git: cypress_test/integration_tests loleaflet/.eslintrc loleaflet/src

Ashod Nakashian (via logerrit) logerrit at kemper.freedesktop.org
Tue Mar 17 21:53:29 UTC 2020


 cypress_test/integration_tests/common/helper.js                     |   75 ++++++
 cypress_test/integration_tests/common/impress.js                    |   60 +++++
 cypress_test/integration_tests/mobile/impress/impress_focus_spec.js |  115 ++++++++--
 loleaflet/.eslintrc                                                 |    8 
 loleaflet/src/map/Clipboard.js                                      |    2 
 loleaflet/src/map/Map.js                                            |    8 
 6 files changed, 250 insertions(+), 18 deletions(-)

New commits:
commit b2ec95dcfddac03c9565762d7032c3d36dd53fe6
Author:     Ashod Nakashian <ashod.nakashian at collabora.co.uk>
AuthorDate: Sun Mar 1 10:48:10 2020 -0500
Commit:     Ashod Nakashian <ashnakash at gmail.com>
CommitDate: Tue Mar 17 22:53:11 2020 +0100

    cypress: new impress editing tests
    
    Single- and double-click starts editing
    text-boxes in Impress. Single-clicking works
    only on text, not in the white-space.
    
    Merges an existing test with a new one to
    minimize redundancy where there is overlap.
    
    Improved helpers to minimize duplication
    and update a single place when there are changes
    to the common operations/checks.
    
    ESLint version set to 6 to support the inline
    closure syntax that 5 doesn't support. This is
    only used for tests, so perhaps we should have
    a different ESLint config for leaflet to avoid
    breaking IE11, which is pre-6.
    
    Change-Id: I14ee65b18e310f4ff6b93ce81580b3d6aba0fa03
    Reviewed-on: https://gerrit.libreoffice.org/c/online/+/90360
    Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
    Reviewed-by: Ashod Nakashian <ashnakash at gmail.com>

diff --git a/cypress_test/integration_tests/common/helper.js b/cypress_test/integration_tests/common/helper.js
index 8d1e6981c..01b3bbff5 100644
--- a/cypress_test/integration_tests/common/helper.js
+++ b/cypress_test/integration_tests/common/helper.js
@@ -46,6 +46,75 @@ function loadTestDoc(fileName, subFolder, mobile) {
 	cy.get('.leaflet-tile-loaded', {timeout : 10000});
 }
 
+// Enable editing if we are in read-only mode.
+function enableEditingMobile() {
+	cy.get('#mobile-edit-button')
+		.then(function(button) {
+			if (button.css('display') !== 'none') {
+				cy.get('#mobile-edit-button')
+					.click();
+			}
+		});
+}
+
+// Assert that we have cursor and focus.
+function assertCursorAndFocus() {
+	cy.log('Verifying Cursor and Focus.');
+
+	// In edit mode, we should have the blinking cursor.
+	cy.get('.leaflet-cursor.blinking-cursor')
+		.should('exist');
+	cy.get('.leaflet-cursor-container')
+		.should('exist');
+
+	cy.log('Cursor and Focus verified.');
+}
+
+// Select all text via CTRL+A shortcut.
+function selectAllText() {
+	assertCursorAndFocus();
+
+	cy.log('Select all text');
+
+	cy.get('textarea.clipboard')
+		.type('{ctrl}a').wait(300);
+}
+
+// Clear all text by selecting all and deleting.
+function clearAllText() {
+	assertCursorAndFocus();
+
+	cy.log('Clear all text');
+
+	cy.get('textarea.clipboard')
+		.type('{ctrl}a{del}').wait(300);
+}
+
+// Returns the text that should go to the
+// clipboard on Ctrl+C.
+// So this isn't equivalent to reading the
+// clipboard (which Cypress doesn't support).
+// Takes a closure f that takes the text
+// string as argument. Use as follows:
+// helper.getTextForClipboard((htmlText, plainText) => {
+// 	expect(plainText, 'Selection Text').to.equal(testText);
+// });
+function getTextForClipboard(f) {
+	cy.window().then(win => {
+		var htmlText = win.map._clip._getHtmlForClipboard();
+		var plainText = win.map._clip.stripHTML(htmlText);
+		f(htmlText, plainText);
+	});
+}
+
+// Expects getTextForClipboard return the given
+// plain-text, and asserts equality.
+function expectTextForClipboard(expectedPlainText) {
+	getTextForClipboard((htmlText, plainText) => {
+		expect(plainText, 'Selection Text').to.equal(expectedPlainText);
+	});
+}
+
 function beforeAllMobile(fileName, subFolder) {
 	loadTestDoc(fileName, subFolder, true);
 
@@ -124,6 +193,12 @@ function longPressOnDocument(posX, posY) {
 }
 
 module.exports.loadTestDoc = loadTestDoc;
+module.exports.enableEditingMobile = enableEditingMobile;
+module.exports.assertCursorAndFocus = assertCursorAndFocus;
+module.exports.selectAllText = selectAllText;
+module.exports.clearAllText = clearAllText;
+module.exports.getTextForClipboard = getTextForClipboard;
+module.exports.expectTextForClipboard = expectTextForClipboard;
 module.exports.afterAll = afterAll;
 module.exports.beforeAllMobile = beforeAllMobile;
 module.exports.longPressOnDocument = longPressOnDocument;
diff --git a/cypress_test/integration_tests/common/impress.js b/cypress_test/integration_tests/common/impress.js
new file mode 100644
index 000000000..db06ea9ef
--- /dev/null
+++ b/cypress_test/integration_tests/common/impress.js
@@ -0,0 +1,60 @@
+/* global cy require */
+
+var helper = require('./helper');
+
+// Assert that Impress is *not* in Text Edit Mode.
+function assertNotInTextEditMode() {
+	cy.log('Verifying NO Text-Edit context.');
+
+	// In edit mode, we should have the blinking cursor.
+	cy.get('.leaflet-cursor.blinking-cursor')
+		.should('not.exist');
+	cy.get('.leaflet-cursor-container')
+		.should('not.exist');
+
+	cy.log('NO Text-Edit context verified.');
+}
+
+// Assert that Impress is in Text Edit Mode.
+function assertInTextEditMode() {
+	cy.log('Verifying Impress in Text-Edit context.');
+
+	// In edit mode, we should have the edit container.
+	cy.get('#doc-clipboard-container')
+		.should('exist');
+
+	cy.get('.leaflet-zoom-animated')
+		.should('exist');
+	cy.get('.leaflet-interactive')
+		.should('exist');
+
+	cy.get('.leaflet-pane.leaflet-overlay-pane svg g')
+		.should('exist');
+
+	helper.assertCursorAndFocus();
+
+	cy.log('Impress Text-Edit context verified.');
+}
+
+// Enter some text and confirm we get it back.
+function typeTextAndVerify(text, expected) {
+	if (!expected)
+		expected = text;
+
+	assertInTextEditMode();
+
+	// Type some text.
+	cy.get('#document-container')
+		.type(text);
+
+	// Still in edit mode.
+	assertInTextEditMode();
+
+	helper.selectAllText();
+
+	helper.expectTextForClipboard(expected);
+}
+
+module.exports.assertNotInTextEditMode = assertNotInTextEditMode;
+module.exports.assertInTextEditMode = assertInTextEditMode;
+module.exports.typeTextAndVerify = typeTextAndVerify;
diff --git a/cypress_test/integration_tests/mobile/impress/impress_focus_spec.js b/cypress_test/integration_tests/mobile/impress/impress_focus_spec.js
index 46dbc7a9f..a33bede16 100644
--- a/cypress_test/integration_tests/mobile/impress/impress_focus_spec.js
+++ b/cypress_test/integration_tests/mobile/impress/impress_focus_spec.js
@@ -1,6 +1,7 @@
-/* global describe it cy beforeEach require afterEach*/
+/* global describe it cy beforeEach require afterEach expect */
 
 var helper = require('../../common/helper');
+var impress = require('../../common/impress');
 
 describe('Impress focus tests', function() {
 	beforeEach(function() {
@@ -11,9 +12,11 @@ describe('Impress focus tests', function() {
 		helper.afterAll('focus.odp');
 	});
 
-	it.skip('Basic document focus.', function() {
-		// Click on edit button
-		cy.get('#mobile-edit-button').click();
+	it('Select text box, no editing', function() {
+
+		helper.enableEditingMobile();
+
+		impress.assertNotInTextEditMode();
 
 		cy.get('#tb_actionbar_item_mobile_wizard')
 			.should('not.have.class', 'disabled');
@@ -22,25 +25,109 @@ describe('Impress focus tests', function() {
 		cy.document().its('activeElement.tagName')
 			.should('be.eq', 'BODY');
 
-		// One tap on a text shape does not grab the focus to the document
+		// One tap on a text shape, on the whitespace area,
+		// does not start editing.
 		cy.get('#document-container')
-			.click();
+			.then(function(items) {
+				expect(items).have.length(1);
 
-		// Shape selection
-		cy.get('.leaflet-pane.leaflet-overlay-pane svg g')
-			.should('exist');
+				// Click in the left-bottom corner where there is no text.
+				let posX = items[0].getBoundingClientRect().left + items[0].getBoundingClientRect().width / 4;
+				let posY = items[0].getBoundingClientRect().top + items[0].getBoundingClientRect().height / 2;
+				cy.log('Got left-bottom quantile at (' + posX + ', ' + posY + ')');
+
+				cy.get('#document-container')
+					.click(posX, posY);
+			});
 
 		// No focus
 		cy.document().its('activeElement.tagName')
 			.should('be.eq', 'BODY');
 
-		// Double tap on a text shape gives the focus to the document
+		// Shape selection.
+		cy.get('.leaflet-pane.leaflet-overlay-pane svg g')
+			.should('exist');
+
+		// But no editing.
+		impress.assertNotInTextEditMode();
+	});
+
+	it('Double-click to edit', function() {
+
+		helper.enableEditingMobile();
+
+		impress.assertNotInTextEditMode();
+
+		// Enter edit mode by double-clicking.
+		cy.get('#document-container')
+			.dblclick();
+
+		impress.typeTextAndVerify('Hello Impress');
+
+		// End editing.
+		cy.get('#document-container')
+			.type('{esc}').wait(500);
+
+		impress.assertNotInTextEditMode();
+
+		// Enter edit mode by double-clicking again.
 		cy.get('#document-container')
 			.dblclick();
 
-		// Document has the focus
-		// TODO: Focus is inconsistent here.
-		//cy.document().its('activeElement.className')
-		//	.should('be.eq', 'clipboard');
+		// Clear the text.
+		helper.clearAllText();
+
+		impress.typeTextAndVerify('Bazinga Impress');
+	});
+
+	it('Single-click to edit', function() {
+
+		helper.enableEditingMobile();
+
+		impress.assertNotInTextEditMode();
+
+		cy.get('#document-container')
+			.then(function(items) {
+				expect(items).have.length(1);
+
+				// Click in the top left corner where there is no text.
+				let posX = items[0].getBoundingClientRect().width / 2;
+				let posY = items[0].getBoundingClientRect().height / 2;
+				cy.log('Got center coordinates at (' + posX + ', ' + posY + ')');
+
+				// Start editing; click on the text.
+				cy.get('#document-container')
+					.click(posX, posY);
+
+				impress.typeTextAndVerify('Hello Impress');
+
+				// End editing.
+				cy.get('#document-container')
+					.type('{esc}').wait(500);
+
+				impress.assertNotInTextEditMode();
+
+				// Single-click to re-edit.
+				cy.get('#document-container')
+					.then(function(items) {
+						expect(items).have.length(1);
+
+						cy.get('#document-container')
+							.click(posX, posY).wait(500);
+
+						impress.assertInTextEditMode();
+
+						// Clear the text.
+						helper.clearAllText();
+
+						impress.typeTextAndVerify('Bazinga Impress');
+
+						// End editing.
+						cy.get('#document-container')
+							.type('{esc}').wait(500);
+
+						impress.assertNotInTextEditMode();
+					});
+			});
 	});
 });
diff --git a/loleaflet/.eslintrc b/loleaflet/.eslintrc
index a5a054eef..7a0d4747f 100644
--- a/loleaflet/.eslintrc
+++ b/loleaflet/.eslintrc
@@ -26,5 +26,11 @@
   },
   "env": {
     "browser": true
-  }
+  },
+  "parserOptions": {
+      "ecmaVersion": 6,
+      "sourceType": "module",
+      "ecmaFeatures": {
+      }
+  },
 }
diff --git a/loleaflet/src/map/Clipboard.js b/loleaflet/src/map/Clipboard.js
index 2a5056824..890c67fd5 100644
--- a/loleaflet/src/map/Clipboard.js
+++ b/loleaflet/src/map/Clipboard.js
@@ -610,7 +610,7 @@ L.Clipboard = L.Class.extend({
 			}
 			else
 			{
-				console.log('help did not arive for ' + operation);
+				console.log('help did not arrive for ' + operation);
 				that._warnCopyPaste();
 			}
 		}, 150 /* ms */);
diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js
index 97a8eb6b6..4826cee18 100644
--- a/loleaflet/src/map/Map.js
+++ b/loleaflet/src/map/Map.js
@@ -97,6 +97,11 @@ L.Map = L.Evented.extend({
 		// lead to URL's of the form <webserver>//insertfile/...
 		options.webserver = options.webserver.replace(/\/*$/, '');
 
+		if (L.Browser.cypressTest) {
+			// Expose us in test mode.
+			window.map = this;
+		}
+
 		this._handlers = [];
 		this._layers = {};
 		this._zoomBoundLayers = {};
@@ -188,8 +193,7 @@ L.Map = L.Evented.extend({
 				L.DomUtil.addClass(L.DomUtil.get('main-menu'), 'readonly');
 				L.DomUtil.addClass(L.DomUtil.get('presentation-controls-wrapper'), 'readonly');
 				L.DomUtil.addClass(L.DomUtil.get('spreadsheet-row-column-frame'), 'readonly');
-			}
-			else {
+			} else {
 				L.DomUtil.removeClass(this._container.parentElement, 'readonly');
 				if (!L.Browser.mobile) {
 					L.DomUtil.removeClass(L.DomUtil.get('toolbar-wrapper'), 'readonly');


More information about the Libreoffice-commits mailing list