jsdialog: correctly setup & test value for spinfields

Adding attribute by jQuery and testing in cypress was
not working: visible value was correct after change but
in DOM we had original value which was tested by cypress.

Use val() to setup value and have.value for cypress to test.

Unify inputs so we don't use attributes but always props.

Signed-off-by: Szymon Kłos <szymon.klos@collabora.com>
Change-Id: I1b3acccbd6d4ba493f867044b9b3c1f17b16873e

browser/src/control/Control.JSDialogBuilder.js

@@ -1345,7 +1345,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 			else if (data.children && data.children.length)
 				value = data.children[0].text;
 
-			$(controls.spinfield).attr('value', builder._cleanValueFromUnits(value));
+			$(controls.spinfield).val(builder._cleanValueFromUnits(value));
 		};
 
 		controls.spinfield.addEventListener('change', function() {
@@ -1379,7 +1379,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 		builder.listenNumericChanges(data, builder, controls, customCallback);
 
 		value = parseFloat(data.value);
-		$(controls.spinfield).attr('value', value);
+		$(controls.spinfield).val(value);
 
 		return false;
 	},
@@ -1391,7 +1391,7 @@ L.Control.JSDialogBuilder = L.Control.extend({
 		builder.listenNumericChanges(data, builder, controls, customCallback);
 
 		value = parseFloat(data.value);
-		$(controls.spinfield).attr('value', value);
+		$(controls.spinfield).val(value);
 
 		return false;
 	},

cypress_test/integration_tests/common/helper.js

@@ -1220,8 +1220,7 @@ function overlayItemHasDifferentBoundsThan(itemDivId, bounds) {
 // selector - selector to find the correct input item in the DOM.
 // text - string to type in (can contain cypress command strings).
 // clearBefore - whether clear the existing content or not.
-// prop - whether the value is set as property or attribute (depends on implementation).
-function typeIntoInputField(selector, text, clearBefore = true, prop = true)
+function typeIntoInputField(selector, text, clearBefore = true)
 {
 	cy.log('Typing into input field - start.');
 
@@ -1235,13 +1234,8 @@ function typeIntoInputField(selector, text, clearBefore = true, prop = true)
 			.type(text + '{enter}');
 	}
 
-	if (prop) {
-		cy.get(selector)
-			.should('have.prop', 'value', text);
-	} else {
-		cy.get(selector)
-			.should('have.attr', 'value', text);
-	}
+	cy.get(selector)
+		.should('have.value', text);
 
 	cy.log('Typing into input field - end.');
 }

cypress_test/integration_tests/desktop/writer/table_operation_spec.js

@@ -180,7 +180,7 @@ describe('Table operations', function() {
 	it('Change row height.', function() {
 		if (mode === 'classic') {
 			cy.get('#rowheight .spinfield')
-				.should('have.attr', 'value', '0');
+				.should('have.value', '0');
 
 			helper.typeIntoInputField('#rowheight .spinfield', '1.4', true, false);
 

cypress_test/integration_tests/mobile/calc/number_format_spec.js

@@ -41,10 +41,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '2');
+			.should('have.value', '2');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		calcHelper.selectEntireSheet();
 
@@ -68,10 +68,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '2');
+			.should('have.value', '2');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		calcHelper.selectEntireSheet();
 
@@ -92,10 +92,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '2');
+			.should('have.value', '2');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		calcHelper.selectEntireSheet();
 
@@ -119,10 +119,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '2');
+			.should('have.value', '2');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		calcHelper.selectEntireSheet();
 
@@ -144,10 +144,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '2');
+			.should('have.value', '2');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		calcHelper.selectEntireSheet();
 
@@ -194,10 +194,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		calcHelper.selectEntireSheet();
 
@@ -218,10 +218,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		calcHelper.selectEntireSheet();
 
@@ -242,10 +242,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '2');
+			.should('have.value', '2');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		calcHelper.selectEntireSheet();
 
@@ -263,10 +263,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		calcHelper.selectEntireSheet();
 
@@ -284,10 +284,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		calcHelper.selectEntireSheet();
 
@@ -305,10 +305,10 @@ describe('Apply number formatting.', function() {
 
 		// Decimal and leading zeros are changed.
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		calcHelper.selectEntireSheet();
 
@@ -324,7 +324,7 @@ describe('Apply number formatting.', function() {
 	it('Change decimal places.', function() {
 		// Check default value
 		cy.get('#decimalplaces input')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		// Type in a new value
 		helper.typeIntoInputField('#decimalplaces input', '2', true, false);
@@ -343,7 +343,7 @@ describe('Apply number formatting.', function() {
 	it('Change leading zeros.', function() {
 		// Check default value
 		cy.get('#leadingzeroes input')
-			.should('have.attr', 'value', '1');
+			.should('have.value', '1');
 
 		// Type in a new value
 		helper.typeIntoInputField('#leadingzeroes input', '6', true, false);

cypress_test/integration_tests/mobile/writer/apply_paragraph_properties_spec.js

@@ -180,34 +180,34 @@ describe.skip('Apply paragraph properties.', function() {
 	it('Change para spacing via combobox.', function() {
 		// Check para spacing current value
 		cy.get('#aboveparaspacing .spinfield')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 		cy.get('#belowparaspacing .spinfield')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		// Change spacing
 		helper.clickOnIdle('#aboveparaspacing .plus');
 		cy.get('#aboveparaspacing .spinfield')
-			.should('have.attr', 'value', '0.01');
+			.should('have.value', '0.01');
 
 		helper.clickOnIdle('#aboveparaspacing .plus');
 		cy.get('#aboveparaspacing .spinfield')
-			.should('have.attr', 'value', '0.02');
+			.should('have.value', '0.02');
 
 		helper.clickOnIdle('#aboveparaspacing .plus');
 		cy.get('#aboveparaspacing .spinfield')
-			.should('have.attr', 'value', '0.03');
+			.should('have.value', '0.03');
 
 		helper.clickOnIdle('#aboveparaspacing .plus');
 		cy.get('#aboveparaspacing .spinfield')
-			.should('have.attr', 'value', '0.04');
+			.should('have.value', '0.04');
 
 		helper.clickOnIdle('#aboveparaspacing .minus');
 		cy.get('#aboveparaspacing .spinfield')
-			.should('have.attr', 'value', '0.03');
+			.should('have.value', '0.03');
 
 		helper.clickOnIdle('#belowparaspacing .plus');
 		cy.get('#belowparaspacing .spinfield')
-			.should('have.attr', 'value', '0.01');
+			.should('have.value', '0.01');
 
 		writerHelper.selectAllTextOfDoc();
 
@@ -254,11 +254,11 @@ describe.skip('Apply paragraph properties.', function() {
 		// Change indent
 		helper.clickOnIdle('#beforetextindent .plus');
 		cy.get('#beforetextindent .spinfield')
-			.should('have.attr', 'value', '0.01');
+			.should('have.value', '0.01');
 
 		helper.clickOnIdle('#beforetextindent .plus');
 		cy.get('#beforetextindent .spinfield')
-			.should('have.attr', 'value', '0.02');
+			.should('have.value', '0.02');
 
 		writerHelper.selectAllTextOfDoc();
 
@@ -271,11 +271,11 @@ describe.skip('Apply paragraph properties.', function() {
 		// Change indent
 		helper.clickOnIdle('#aftertextindent .plus');
 		cy.get('#aftertextindent .spinfield')
-			.should('have.attr', 'value', '0.01');
+			.should('have.value', '0.01');
 
 		helper.clickOnIdle('#aftertextindent .plus');
 		cy.get('#aftertextindent .spinfield')
-			.should('have.attr', 'value', '0.02');
+			.should('have.value', '0.02');
 
 		writerHelper.selectAllTextOfDoc();
 
@@ -288,11 +288,11 @@ describe.skip('Apply paragraph properties.', function() {
 		// Increase firstline indent
 		helper.clickOnIdle('#firstlineindent .plus');
 		cy.get('#firstlineindent .spinfield')
-			.should('have.attr', 'value', '0.01');
+			.should('have.value', '0.01');
 
 		helper.clickOnIdle('#firstlineindent .plus');
 		cy.get('#firstlineindent .spinfield')
-			.should('have.attr', 'value', '0.02');
+			.should('have.value', '0.02');
 
 		writerHelper.selectAllTextOfDoc();
 

cypress_test/integration_tests/mobile/writer/focus_spec.js

@@ -54,7 +54,7 @@ describe('Focus tests', function() {
 		helper.clickOnIdle('#Paragraph');
 
 		cy.get('#aboveparaspacing .spinfield')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		helper.clickOnIdle('#aboveparaspacing .spinfield');
 

cypress_test/integration_tests/mobile/writer/hamburger_menu_spec.js

@@ -473,7 +473,7 @@ describe('Trigger hamburger menu options.', function() {
 			.should('have.text', 'User');
 
 		cy.get('#paperwidth .spinfield')
-			.should('have.attr', 'value', '12');
+			.should('have.value', '12');
 	});
 
 	it('Page setup: change paper height.', function() {
@@ -493,7 +493,7 @@ describe('Trigger hamburger menu options.', function() {
 			.should('have.text', 'User');
 
 		cy.get('#paperheight .spinfield')
-			.should('have.attr', 'value', '3');
+			.should('have.value', '3');
 	});
 
 	it('Page setup: change orientation.', function() {

cypress_test/integration_tests/mobile/writer/shape_properties_spec.js

@@ -326,7 +326,7 @@ describe('Change shape properties via mobile wizard.', function() {
 		helper.inputOnIdle('#gradangle .spinfield', '100');
 
 		cy.get('#gradangle .spinfield')
-			.should('have.attr', 'value', '100');
+			.should('have.value', '100');
 
 		// Select To color
 		helper.clickOnIdle('#fillgrad2');
@@ -460,7 +460,7 @@ describe('Change shape properties via mobile wizard.', function() {
 		helper.inputOnIdle('#settransparency .spinfield', '50');
 
 		cy.get('#settransparency .spinfield')
-			.should('have.attr', 'value', '50');
+			.should('have.value', '50');
 
 		cy.get('#transtype .ui-header-left')
 			.should('have.text', 'Solid');

cypress_test/integration_tests/mobile/writer/table_properties_spec.js

@@ -231,7 +231,7 @@ describe('Change table properties / layout via mobile wizard.', function() {
 		openTablePanel();
 
 		cy.get('#rowheight .spinfield')
-			.should('have.attr', 'value', '0');
+			.should('have.value', '0');
 
 		helper.typeIntoInputField('#rowheight .spinfield', '1.4', true, false);