#2771 add tests for conditional hiding of the fancy field types.

cypress/forms/CF5bcb67b899a38.json

@@ -0,0 +1 @@
+{"_last_updated":"Sat, 20 Oct 2018 17:54:11 +0000","ID":"CF5bcb67b899a38","cf_version":"1.8.0-a.1","name":"Conditional Hide - Fancy Fields","scroll_top":0,"success":"Form has been successfully submitted. Thank you.\t\t\t","db_support":1,"pinned":0,"hide_form":1,"avatar_field":"","form_ajax":1,"custom_callback":"","layout_grid":{"fields":{"fld_6026662":"1:1","fld_8820637":"2:1","fld_8552574":"3:1","fld_8899889":"4:1","fld_8097741":"5:1","fld_8501163":"5:1"},"structure":"12|12|12|12|12|12"},"fields":{"fld_6026662":{"ID":"fld_6026662","type":"radio","label":"Hide All","slug":"hide_all","conditions":{"type":""},"caption":"","config":{"custom_class":"","default_option":"","auto_type":"","taxonomy":"category","post_type":"post","value_field":"name","orderby_tax":"count","orderby_post":"ID","order":"ASC","default":"","option":{"opt1077485":{"calc_value":"","value":"Yes","label":"Yes"},"opt2055262":{"calc_value":"","value":"No","label":"No"}},"email_identifier":0,"personally_identifying":0}},"fld_8820637":{"ID":"fld_8820637","type":"range_slider","label":"Range","slug":"range","conditions":{"type":"con_3922580031808809"},"caption":"Default 10, Min -5, Max 20 Red handle","config":{"custom_class":"","default":10,"trackcolor":"#e6e6e6","color":"#00ff00","handle":"#ff0000","handleborder":"#cccccc","step":1,"min":-5,"max":20,"showval":1,"prefix":"","suffix":"","email_identifier":0,"personally_identifying":0}},"fld_8552574":{"ID":"fld_8552574","type":"star_rating","label":"Star Default 5\/7 Stars are Black #000000","slug":"star_default_57","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","default":5,"number":7,"type":"star","size":13,"space":3,"color":"#000000","track_color":"#AFAFAF","email_identifier":0,"personally_identifying":0}},"fld_8899889":{"ID":"fld_8899889","type":"utm","label":"UTM Field","slug":"utm_field","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","email_identifier":0,"personally_identifying":0}},"fld_8097741":{"ID":"fld_8097741","type":"gdpr","label":"Consent Field","slug":"consent_field","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","agreement":"Agreement","linked_text":"Privacy page","title_attr":"Title for link","email_identifier":0,"personally_identifying":0}},"fld_8501163":{"ID":"fld_8501163","type":"button","label":"Submit Button","slug":"submit_button","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","type":"submit","class":"btn btn-default","target":""}}},"page_names":["Page 1"],"mailer":{"sender_name":"Caldera Forms Notification","sender_email":"[email protected]","reply_to":"","email_type":"html","recipients":"","bcc_to":"","email_subject":"Fancy Field Hide\/Show","email_message":"{summary}"},"check_honey":1,"antispam":{"sender_name":"","sender_email":""},"conditional_groups":{"conditions":{"con_3922580031808809":{"id":"con_3922580031808809","name":"Hide All","type":"hide","group":{"rw9088688076208192":{"cl6331319444783873":{"parent":"rw9088688076208192","field":"fld_6026662","compare":"is","value":"opt1077485"}}},"fields":{"cl6331319444783873":"fld_6026662"}}}},"settings":{"responsive":{"break_point":"sm"}},"privacy_exporter_enabled":false,"version":"1.8.0-a.1","db_id":"145","type":"primary"}

cypress/forms/CF5bcb71a2d27bf.json

@@ -0,0 +1 @@
+{"_last_updated":"Sat, 20 Oct 2018 18:24:18 +0000","ID":"CF5bcb71a2d27bf","cf_version":"1.8.0-a.1","name":"Conditionals Fancy Multi-Page","scroll_top":0,"success":"Form has been successfully submitted. Thank you.\t\t\t\t\t\t","db_support":1,"pinned":0,"hide_form":1,"avatar_field":null,"form_ajax":1,"custom_callback":"","layout_grid":{"fields":{"fld_6026662":"1:1","fld_2586230":"2:1","fld_8899889":"3:1","fld_8552574":"3:1","fld_8820637":"3:1","fld_8097741":"3:1","fld_7066233":"4:1","fld_8501163":"4:2"},"structure":"12|12#12|6:6"},"fields":{"fld_6026662":{"ID":"fld_6026662","type":"radio","label":"Hide All","slug":"hide_all","conditions":{"type":""},"caption":"","config":{"custom_class":"","default_option":"","auto_type":"","taxonomy":"category","post_type":"post","value_field":"name","orderby_tax":"name","orderby_post":"name","order":"ASC","default":"","option":{"opt1077485":{"calc_value":"Yes","value":"Yes","label":"Yes"},"opt2055262":{"calc_value":"No","value":"No","label":"No"}},"email_identifier":0,"personally_identifying":0}},"fld_8820637":{"ID":"fld_8820637","type":"range_slider","label":"Range","slug":"range","conditions":{"type":"con_3922580031808809"},"caption":"Default 10, Min -5, Max 20 Red handle","config":{"custom_class":"","default":10,"trackcolor":"#e6e6e6","color":"#00ff00","handle":"#ff0000","handleborder":"#cccccc","step":1,"min":-5,"max":20,"showval":1,"prefix":"","suffix":"","email_identifier":0,"personally_identifying":0}},"fld_8552574":{"ID":"fld_8552574","type":"star_rating","label":"Star Default 5\/7 Stars are Black #000000","slug":"star_default_57","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","default":5,"number":7,"type":"star","size":13,"space":3,"color":"#000000","track_color":"#AFAFAF","email_identifier":0,"personally_identifying":0}},"fld_8899889":{"ID":"fld_8899889","type":"utm","label":"UTM Field","slug":"utm_field","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","email_identifier":0,"personally_identifying":0}},"fld_8097741":{"ID":"fld_8097741","type":"gdpr","label":"Consent Field","slug":"consent_field","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","agreement":"Agreement","linked_text":"Privacy page","title_attr":"Title for link","email_identifier":0,"personally_identifying":0}},"fld_8501163":{"ID":"fld_8501163","type":"button","label":"Submit Button","slug":"submit_button","conditions":{"type":"con_3922580031808809"},"caption":"","config":{"custom_class":"","type":"submit","class":"btn btn-default","target":""}},"fld_2586230":{"ID":"fld_2586230","type":"button","label":"Next page","slug":"next_page","conditions":{"type":""},"caption":"","config":{"custom_class":"","type":"next","class":"btn btn-default","target":""}},"fld_7066233":{"ID":"fld_7066233","type":"button","label":"Back Button","slug":"back_button","conditions":{"type":""},"caption":"","config":{"custom_class":"","type":"prev","class":"btn btn-default","target":""}}},"page_names":["Page 1","Page 2"],"mailer":{"sender_name":"Caldera Forms Notification","sender_email":"[email protected]","reply_to":"","email_type":"html","recipients":"","bcc_to":"","email_subject":"Fancy Field Hide\/Show","email_message":"{summary}"},"check_honey":1,"antispam":{"sender_name":"","sender_email":""},"conditional_groups":{"conditions":{"con_3922580031808809":{"id":"con_3922580031808809","name":"Hide All","type":"hide","fields":{"cl6331319444783873":"fld_6026662"},"group":{"rw9088688076208192":{"cl6331319444783873":{"parent":"rw9088688076208192","field":"fld_6026662","compare":"is","value":"opt1077485"}}}}}},"settings":{"responsive":{"break_point":"sm"}},"privacy_exporter_enabled":false,"version":"1.8.0-a.1","db_id":"149","type":"primary"}

cypress/integration/conditionals-fancy-multi-page.js

@@ -0,0 +1,88 @@
+import {
+	visitPage,
+	getCfField,
+	clearCfField,
+	cfFieldIsVisible,
+	cfFieldDoesNotExist,
+	cfFieldHasValue,
+	cfFieldSelectValue,
+	cfFieldSetValue,
+	cfFieldCheckValue,
+	cfFieldIsDisabled,
+	cfFieldUnCheckValue,
+	cfFieldIsNotDisabled,
+	cfFieldCheckAllValues,
+	cfFieldCalcFieldValueIs,
+	cfFieldWrapperHasRangeSliderInIt,
+	cfStarFieldValueIs,
+	cfSetStar,
+	cfFieldGetWrapper,
+	cfFieldClickButton
+} from '../support/util';
+import { addQueryArgs } from '@wordpress/url';
+
+
+
+describe('Conditionals test hide conditionals of fancy fields on page 2', () => {
+	const utmTerms = {
+		term:'t1',
+		campaign: 'c21',
+		medium: 'm22',
+		content: 'cc34'
+	};
+	let queryArgs = {};
+	Object.keys(utmTerms).forEach( term => queryArgs[`utm_${term}`] = utmTerms[term]);
+	beforeEach(() => {
+		visitPage(addQueryArgs('conditionals-fancy-multi-page',queryArgs));
+	});
+
+	const formId = 'CF5bcb67b899a38';
+
+	const hideAllCheckbox ='fld_6026662';
+	const range = 'fld_8820637';
+	const star = 'fld_8552574';
+	const utm = 'fld_8899889';
+	const consent = 'fld_8097741';
+
+	const nextPageButton = 'fld_2586230';
+	const prevPageButton = 'fld_7066233';
+
+	const testUtmTerms = (fieldId) => {
+		Object.keys(utmTerms).forEach(term => {
+			cy.get(`#${fieldId}_utm_${term}_1`).should('have.value', utmTerms[term]);
+		});
+	};
+
+	function testAllValues() {
+		testUtmTerms(utm);
+		cfFieldHasValue(range, '10');
+		cfFieldWrapperHasRangeSliderInIt(range);
+		cfStarFieldValueIs(star, '5', '7');
+		cfFieldGetWrapper(consent).find('a.caldera-forms-consent-field-linked_text').contains('Privacy page');
+		cfFieldGetWrapper(consent).find('p.caldera-forms-consent-field-agreement').contains('Agreement');
+	}
+
+
+
+	it( 'Has the correct initial load', () => {
+
+		cfFieldClickButton(nextPageButton);
+		testAllValues();
+	});
+
+	it( 'After hide and unhide, looks the same', () => {
+
+		cfFieldCheckValue(hideAllCheckbox,'Yes' );
+		cfFieldCheckValue(hideAllCheckbox,'No' );
+		cfFieldClickButton(nextPageButton);
+		testAllValues();
+
+		cfFieldClickButton(prevPageButton);
+		cfFieldCheckValue(hideAllCheckbox,'Yes' );
+		cfFieldCheckValue(hideAllCheckbox,'No' );
+		cfFieldClickButton(nextPageButton);
+		testAllValues();
+
+	});
+
+});

cypress/integration/conditionals-fancy.js

@@ -0,0 +1,72 @@
+import {
+	visitPage,
+	getCfField,
+	clearCfField,
+	cfFieldIsVisible,
+	cfFieldDoesNotExist,
+	cfFieldHasValue,
+	cfFieldSelectValue,
+	cfFieldSetValue,
+	cfFieldCheckValue,
+	cfFieldIsDisabled,
+	cfFieldUnCheckValue,
+	cfFieldIsNotDisabled,
+	cfFieldCheckAllValues,
+	cfFieldCalcFieldValueIs, cfFieldWrapperHasRangeSliderInIt, cfStarFieldValueIs, cfSetStar, cfFieldGetWrapper
+} from '../support/util';
+import { addQueryArgs } from '@wordpress/url';
+
+
+
+describe('Conditionals test hide conditionals of fancy fields', () => {
+	const utmTerms = {
+		term:'t1',
+		campaign: 'c21',
+		medium: 'm22',
+		content: 'cc34'
+	};
+	let queryArgs = {};
+	Object.keys(utmTerms).forEach( term => queryArgs[`utm_${term}`] = utmTerms[term]);
+	beforeEach(() => {
+		visitPage(addQueryArgs('conditionals-fancy',queryArgs));
+	});
+
+	const formId = 'CF5bcb67b899a38';
+
+	const hideAllCheckbox ='fld_6026662';
+	const range = 'fld_8820637';
+	const star = 'fld_8552574';
+	const utm = 'fld_8899889';
+	const consent = 'fld_8097741';
+
+	const testUtmTerms = (fieldId) => {
+		Object.keys(utmTerms).forEach(term => {
+			cy.get(`#${fieldId}_utm_${term}_1`).should('have.value', utmTerms[term]);
+		});
+	};
+	function testAllValues() {
+		testUtmTerms(utm);
+		cfFieldHasValue(range, '10');
+		cfFieldWrapperHasRangeSliderInIt(range);
+		cfStarFieldValueIs(star, '5', '7');
+		cfFieldGetWrapper(consent).find('a.caldera-forms-consent-field-linked_text').contains('Privacy page');
+		cfFieldGetWrapper(consent).find('p.caldera-forms-consent-field-agreement').contains('Agreement');
+	}
+
+
+
+	it( 'Has the correct initial load', () => {
+		testAllValues();
+
+	});
+
+	it( 'After hide and unhide, looks the same', () => {
+
+		cfFieldCheckValue(hideAllCheckbox,'Yes' );
+		cfFieldCheckValue(hideAllCheckbox,'No' );
+		testAllValues();
+
+
+	});
+
+});

cypress/support/util.js

@@ -358,4 +358,33 @@ export const cfAddProcessor = (processorType) =>{
 
 export const cfGoToProcessorsTab=() => {
 	cy.get('#tab_processors a').click();
+};
+
+/**
+ * Check that a range slider field exists and has the extra stuff the jQuery plugin adds
+ * @param fieldId
+ */
+export const cfFieldWrapperHasRangeSliderInIt = (fieldId) => {
+
+	 cfFieldGetWrapper(fieldId).children().find( '.rangeslider__fill' );
+	 cfFieldGetWrapper(fieldId).children().find( '.rangeslider__handle' );
+
+};
+
+/**
+ *
+ * @param fieldId
+ * @param {Number}starValue Which star to click on
+ */
+export const cfSetStar = (fieldId,starValue) =>{
+	cfFieldGetWrapper(fieldId).find( `f.raty-star-on[title="${starValue}"]` ).trigger( 'click' );
+};
+
+
+export const cfStarFieldValueIs = (fieldId, starValue,maxStars)=> {
+	cfFieldHasValue(fieldId,starValue);
+	for(let i=1; i <= maxStars; i++ ){
+		const className = i <= starValue ? 'raty-star-on' : 'raty-star-off';
+		cfFieldGetWrapper(fieldId).find( `f.${className}[title="${i}"]` ).should( 'have.class',className );
+	};
 }

cypress/tests.json

@@ -128,6 +128,14 @@
     {
       "formId" : "CF5a1163356fe7c",
       "pageSlug": "2090-select-created1-5-7-1-dev1-5-8"
+    },
+    {
+      "formId" : "CF5bcb67b899a38",
+      "pageSlug": "conditionals-fancy"
+    },
+    {
+      "formId" : "CF5bcb71a2d27bf",
+      "pageSlug": "conditionals-fancy-multi-page"
     }
   ]
 }

package.json

@@ -47,6 +47,7 @@
   },
   "dependencies": {
     "@wordpress/dom-ready": "^1.2.0",
+    "@wordpress/url": "^2.1.0",
     "css-loader": "^0.28.11",
     "dangerously-set-inner-html": "^2.0.1",
     "exports-loader": "^0.7.0",