From 0f51ee43f667a4a5261e805393af891b9526e447 Mon Sep 17 00:00:00 2001 From: Tishasoumya-02 Date: Mon, 29 Jul 2024 16:49:50 +0530 Subject: [PATCH] example-content field validation cypress test --- .../tests/coresandbox/fieldTypeValidation.js | 160 ++++++++++++++++++ .../FormValidation/FormValidation.test.js | 6 +- .../src/helpers/FormValidation/validators.ts | 6 +- 3 files changed, 166 insertions(+), 6 deletions(-) create mode 100644 packages/volto/cypress/tests/coresandbox/fieldTypeValidation.js diff --git a/packages/volto/cypress/tests/coresandbox/fieldTypeValidation.js b/packages/volto/cypress/tests/coresandbox/fieldTypeValidation.js new file mode 100644 index 0000000000..3bf59ef3db --- /dev/null +++ b/packages/volto/cypress/tests/coresandbox/fieldTypeValidation.js @@ -0,0 +1,160 @@ +context('Select widgets family Acceptance Tests', () => { + describe('Select', () => { + beforeEach(() => { + cy.intercept('GET', `/**/*?expand*`).as('content'); + cy.intercept('GET', '/**/@types/example').as('schema'); + cy.intercept('POST', '/**/').as('create'); + + // given a logged in editor and a page in edit mode + cy.autologin(); + cy.visit('/'); + cy.wait('@content'); + + // We always add a new example content type, fill the required + cy.navigate('/add?type=example'); + cy.wait('@schema'); + + cy.get('#field-title').type('An Example'); + }); + + it('Test Email field by entering email address without a domain', function () { + cy.get('#field-email_field').type('abc'); + cy.findAllByText('Email field').click(); + + cy.get('.form-error-label') + .contains('Input must be valid email (something@domain.com)') + .should('be.visible'); + cy.get('#toolbar-save').click(); + cy.wait(100); + cy.get('.toast-inner-content') + .contains('Input must be valid email (something@domain.com)') + .should('be.visible'); + }); + + it('Test Text Field', function () { + cy.get('#field-description').type('Volto Coresandbox fixture'); + cy.findAllByText('Description (Textline)').click(); + cy.get('.form-error-label').should('not.exist'); + cy.get('#toolbar-save').click(); + cy.wait(100); + cy.get('.toast-inner-content').should('not.exist'); + }); + + it('Test Integer & Float Field', function () { + cy.findByText('Number fields').click(); + cy.wait(500); + cy.get('#field-int_field').type('121'); + cy.get('#field-float_field').type('121.121'); + cy.findAllByText('Integer Field (e.g. 12)').click(); + cy.get('.form-error-label').should('not.exist'); + cy.get('#toolbar-save').click(); + cy.wait(100); + cy.get('.toast-inner-content').should('not.exist'); + }); + + it('Test Date & Time Field', function () { + const date = new Date(); + const year = date.getFullYear(); + const month = date.getMonth() + 1; + const day = date.getDate(); + + const currentTime = date.toLocaleTimeString([], { + hour: 'numeric', + minute: 'numeric', + hour12: true, + }); + + cy.findByText('Date and time fields').click(); + cy.wait(100); + //Date + cy.get('#datetime_field-date').type(`${month}/${day}/${year}`); + cy.get('#datetime_field-date').should( + 'have.value', + `${month}/${day}/${year}`, + ); + + //Time + cy.get('#datetime_field-time').type(`${currentTime} `); + cy.get('#datetime_field-time').should('have.value', `${currentTime}`); + + cy.get('.form-error-label').should('not.exist'); + cy.get('#toolbar-save').click(); + cy.wait(100); + cy.get('.toast-inner-content').should('not.exist'); + }); + + it('Test List Field', function () { + cy.findAllByText('Choice and Multiple Choice fields').click(); + cy.wait(500); // We allow the Select component to lazy load + + cy.get('.react-select__placeholder') + .should('be.visible') + .contains('Select'); + + // We select the choice 'Beginner' of the field and remove it + cy.get('#field-list_field').click(); + cy.findAllByText('Beginner').click(); + cy.get( + '#field-list_field > .react-select__control > .react-select__value-container > .react-select__multi-value', + ) + .first('Beginner') + .get('.react-select__multi-value__remove') + .click(); + + // We select the choice 'Advanced' of the field + cy.get('#field-list_field').click(); + cy.findAllByText('Advanced').click(); + cy.get( + '#field-list_field > .react-select__control > .react-select__value-container > .react-select__multi-value', + ).should('have.text', 'Advanced'); + + cy.get('.form-error-label').should('not.exist'); + cy.get('#toolbar-save').click(); + cy.wait(100); + cy.get('.toast-inner-content').should('not.exist'); + }); + + it('Test Relationship Field', function () { + cy.findAllByText('Relation fields').click(); + cy.wait(500); // We allow the Select component to lazy load + cy.get('.react-select__placeholder') + .should('be.visible') + .contains('Select'); + + // We select the choice 'Beginner' of the field and remove it + + cy.get('#field-relationchoice_field > .react-select__control ') + .click() + .get('.react-select__menu-list > #react-select-6-option-4') + .click(); + + cy.wait(100); + cy.get('.form-error-label').should('not.exist'); + cy.get('#toolbar-save').click(); + cy.wait(100); + cy.get('.toast-inner-content').should('not.exist'); + cy.wait('@create'); + cy.wait('@content'); + cy.get('.relation').should('have.attr', 'href'); + }); + + it('Test URI Field by entering invalid URI', function () { + cy.findAllByText('Other fields').click(); + cy.get('#field-uri_field').type('plone'); + cy.findAllByText('URI field').click(); + + cy.get('.form-error-label') + .contains( + 'Input must be valid url (www.something.com or http(s)://www.something.com)', + ) + .should('be.visible'); + cy.get('#toolbar-save').click(); + cy.wait(100); + cy.get('.toast-inner-content') + .contains( + 'Input must be valid url (www.something.com or http(s)://www.something.com)', + ) + .should('be.visible'); + }); + }); +}); diff --git a/packages/volto/src/helpers/FormValidation/FormValidation.test.js b/packages/volto/src/helpers/FormValidation/FormValidation.test.js index cc59661bfe..f8cda72828 100644 --- a/packages/volto/src/helpers/FormValidation/FormValidation.test.js +++ b/packages/volto/src/helpers/FormValidation/FormValidation.test.js @@ -376,7 +376,7 @@ describe('FormValidation', () => { schema: newSchema, formData: { username: 'test username', - customField: '1', + customField: 1.8, }, formatMessage, }), @@ -403,7 +403,7 @@ describe('FormValidation', () => { schema: newSchema, formData: { username: 'test username', - customField: 1, + customField: '1', }, formatMessage, }), @@ -430,7 +430,7 @@ describe('FormValidation', () => { schema: newSchema, formData: { username: 'test username', - customField: 10, + customField: '10', }, formatMessage, }), diff --git a/packages/volto/src/helpers/FormValidation/validators.ts b/packages/volto/src/helpers/FormValidation/validators.ts index 0771b77978..2f9c2187ed 100644 --- a/packages/volto/src/helpers/FormValidation/validators.ts +++ b/packages/volto/src/helpers/FormValidation/validators.ts @@ -86,7 +86,7 @@ export const emailValidator = ({ value, formatMessage }: Validator): string => { export const isNumberValidator = ({ value, formatMessage }: Validator) => { const floatRegex = /^[+-]?\d+(\.\d+)?$/; const isValid = - typeof value === 'number' && !isNaN(value) && floatRegex.test(value); + typeof value === 'string' && !isNaN(+value) && floatRegex.test(value); return !isValid ? formatMessage(messages.isNumber) : null; }; @@ -107,9 +107,9 @@ export const maximumValidator = ({ value, field, formatMessage }: Validator) => }); export const isIntegerValidator = ({ value, formatMessage }: Validator) => { + const isNumeric = (string: string | number) => Number.isFinite(+string); const intRegex = /^-?[0-9]+$/; - const isValid = - typeof value === 'number' && !isNaN(value) && intRegex.test(value); + const isValid = isNumeric(value) && intRegex.test(value); return !isValid ? formatMessage(messages.isInteger) : null; };