From 1d9772176933f3283ccf7ceaafcf217cfca72f02 Mon Sep 17 00:00:00 2001 From: Joren Broekema Date: Mon, 15 Mar 2021 10:46:08 +0100 Subject: [PATCH] chore: revert prevValidation result, make prevShown Validator[] --- .eslintignore | 1 + .../form-core/src/validate/ResultValidator.js | 14 ++++++++--- .../form-core/src/validate/ValidateMixin.js | 12 ++++++--- .../resultValidators/DefaultSuccess.js | 11 ++++---- .../test-suites/ValidateMixin.suite.js | 17 ++++++------- .../test/validate/ResultValidator.test.js | 25 ++++++++++++++----- .../types/validate/ValidateMixinTypes.d.ts | 3 ++- 7 files changed, 54 insertions(+), 29 deletions(-) diff --git a/.eslintignore b/.eslintignore index 9a1a5c81d..83876c388 100644 --- a/.eslintignore +++ b/.eslintignore @@ -2,6 +2,7 @@ node_modules coverage/ bundlesize/ .history/ +storybook-static/ *.d.ts _site-dev _site diff --git a/packages/form-core/src/validate/ResultValidator.js b/packages/form-core/src/validate/ResultValidator.js index 5b4362339..4588e771b 100644 --- a/packages/form-core/src/validate/ResultValidator.js +++ b/packages/form-core/src/validate/ResultValidator.js @@ -10,12 +10,20 @@ export class ResultValidator extends Validator { /** * @param {Object} context * @param {Validator[]} context.regularValidationResult - * @param {string} context.prevShownValidationFeedback + * @param {Validator[]} context.prevValidationResult + * @param {Validator[]} context.prevShownValidationResult * @param {Validator[]} [context.validators] * @returns {boolean} */ - // eslint-disable-next-line no-unused-vars, class-methods-use-this - executeOnResults({ regularValidationResult, prevShownValidationFeedback, validators }) { + /* eslint-disable no-unused-vars */ + // eslint-disable-next-line class-methods-use-this + executeOnResults({ + regularValidationResult, + prevValidationResult, + prevShownValidationResult, + validators, + }) { + /* eslint-enable no-unused-vars */ return true; } } diff --git a/packages/form-core/src/validate/ValidateMixin.js b/packages/form-core/src/validate/ValidateMixin.js index 66ba3f5d4..8bb300ce6 100644 --- a/packages/form-core/src/validate/ValidateMixin.js +++ b/packages/form-core/src/validate/ValidateMixin.js @@ -161,8 +161,10 @@ export const ValidateMixinImplementation = superclass => * @type {Validator[]} */ this.__validationResult = []; - /** @type {string} */ - this.__prevShownValidationFeedback = ''; + /** @type {Validator[]} */ + this.__prevValidationResult = []; + /** @type {Validator[]} */ + this.__prevShownValidationResult = []; this.__onValidatorUpdated = this.__onValidatorUpdated.bind(this); this._updateFeedbackComponent = this._updateFeedbackComponent.bind(this); @@ -279,6 +281,7 @@ export const ValidateMixinImplementation = superclass => return; } + this.__prevValidationResult = this.__validationResult; if (clearCurrentResult) { // Clear ('invalidate') all pending and existing validation results. // This is needed because we have async (pending) validators whose results @@ -396,7 +399,8 @@ export const ValidateMixinImplementation = superclass => return resultValidators.filter(v => v.executeOnResults({ regularValidationResult, - prevShownValidationFeedback: this.__prevShownValidationFeedback, + prevValidationResult: this.__prevValidationResult, + prevShownValidationResult: this.__prevShownValidationResult, }), ); } @@ -579,7 +583,7 @@ export const ValidateMixinImplementation = superclass => }); if (this.__prioritizedResult.length > 0) { - this.__prevShownValidationFeedback = this.__prioritizedResult[0].type; + this.__prevShownValidationResult = this.__prioritizedResult; } const messageMap = await this.__getFeedbackMessages(this.__prioritizedResult); diff --git a/packages/form-core/src/validate/resultValidators/DefaultSuccess.js b/packages/form-core/src/validate/resultValidators/DefaultSuccess.js index ad3a9c7dc..b2b9e35c3 100644 --- a/packages/form-core/src/validate/resultValidators/DefaultSuccess.js +++ b/packages/form-core/src/validate/resultValidators/DefaultSuccess.js @@ -17,18 +17,17 @@ export class DefaultSuccess extends ResultValidator { * * @param {Object} context * @param {Validator[]} context.regularValidationResult - * @param {string} context.prevShownValidationFeedback + * @param {Validator[]} context.prevValidationResult + * @param {Validator[]} context.prevShownValidationResult * @returns {boolean} */ // eslint-disable-next-line class-methods-use-this - executeOnResults({ regularValidationResult, prevShownValidationFeedback }) { + executeOnResults({ regularValidationResult, prevShownValidationResult }) { const errorOrWarning = /** @param {Validator} v */ v => v.type === 'error' || v.type === 'warning'; const hasErrorOrWarning = !!regularValidationResult.filter(errorOrWarning).length; + const hasShownErrorOrWarning = !!prevShownValidationResult.filter(errorOrWarning).length; - return ( - !hasErrorOrWarning && - (prevShownValidationFeedback === 'error' || prevShownValidationFeedback === 'warning') - ); + return !hasErrorOrWarning && hasShownErrorOrWarning; } } diff --git a/packages/form-core/test-suites/ValidateMixin.suite.js b/packages/form-core/test-suites/ValidateMixin.suite.js index d27795931..73e044f0e 100644 --- a/packages/form-core/test-suites/ValidateMixin.suite.js +++ b/packages/form-core/test-suites/ValidateMixin.suite.js @@ -550,19 +550,16 @@ export function runValidateMixinSuite(customConfig) { * * @param {Object} context * @param {Validator[]} context.regularValidationResult - * @param {string} context.prevShownValidationFeedback + * @param {Validator[]} context.prevShownValidationResult * @returns {boolean} */ // eslint-disable-next-line class-methods-use-this - executeOnResults({ regularValidationResult, prevShownValidationFeedback }) { + executeOnResults({ regularValidationResult, prevShownValidationResult }) { const errorOrWarning = /** @param {Validator} v */ v => v.type === 'error' || v.type === 'warning'; const hasErrorOrWarning = !!regularValidationResult.filter(errorOrWarning).length; - - return ( - !hasErrorOrWarning && - (prevShownValidationFeedback === 'error' || prevShownValidationFeedback === 'warning') - ); + const hasShownErrorOrWarning = !!prevShownValidationResult.filter(errorOrWarning).length; + return !hasErrorOrWarning && hasShownErrorOrWarning; } }; @@ -613,7 +610,8 @@ export function runValidateMixinSuite(customConfig) { .modelValue=${'myValue'} >${lightDom} `)); - const prevShownValidationFeedback = el.__prevShownValidationFeedback; + const prevValidationResult = el.__prevValidationResult; + const prevShownValidationResult = el.__prevShownValidationResult; const regularValidationResult = [ ...el.__syncValidationResult, ...el.__asyncValidationResult, @@ -621,7 +619,8 @@ export function runValidateMixinSuite(customConfig) { expect(resultValidateSpy.args[0][0]).to.eql({ regularValidationResult, - prevShownValidationFeedback, + prevValidationResult, + prevShownValidationResult, }); }); diff --git a/packages/form-core/test/validate/ResultValidator.test.js b/packages/form-core/test/validate/ResultValidator.test.js index db98f7f54..a933eac27 100644 --- a/packages/form-core/test/validate/ResultValidator.test.js +++ b/packages/form-core/test/validate/ResultValidator.test.js @@ -1,5 +1,6 @@ import { expect } from '@open-wc/testing'; import { ResultValidator } from '../../src/validate/ResultValidator.js'; +import { DefaultSuccess } from '../../src/validate/resultValidators/DefaultSuccess.js'; import { Required } from '../../src/validate/validators/Required.js'; import { MinLength } from '../../src/validate/validators/StringValidators.js'; @@ -15,19 +16,31 @@ describe('ResultValidator', () => { * * @param {Object} context * @param {Validator[]} context.regularValidationResult - * @param {string} context.prevShownValidationFeedback + * @param {Validator[]} context.prevValidationResult + * @param {Validator[]} context.prevShownValidationResult * @returns {boolean} */ - executeOnResults({ regularValidationResult, prevShownValidationFeedback }) { - const hasSuccess = - regularValidationResult.length && prevShownValidationFeedback === 'error'; - return !!hasSuccess; + executeOnResults({ regularValidationResult, prevShownValidationResult }) { + const errorOrWarning = /** @param {Validator} v */ v => + v.type === 'error' || v.type === 'warning'; + const hasErrorOrWarning = !!regularValidationResult.filter(errorOrWarning).length; + const hasShownErrorOrWarning = !!prevShownValidationResult.filter(errorOrWarning).length; + + return !hasErrorOrWarning && hasShownErrorOrWarning; } } expect( new MyResultValidator().executeOnResults({ regularValidationResult: [new Required(), new MinLength(3)], - prevShownValidationFeedback: 'error', + prevValidationResult: [], + prevShownValidationResult: [], + }), + ).to.be.false; + expect( + new MyResultValidator().executeOnResults({ + regularValidationResult: [new DefaultSuccess()], + prevValidationResult: [new Required()], + prevShownValidationResult: [new Required()], }), ).to.be.true; }); diff --git a/packages/form-core/types/validate/ValidateMixinTypes.d.ts b/packages/form-core/types/validate/ValidateMixinTypes.d.ts index 7b6a93788..56a567b72 100644 --- a/packages/form-core/types/validate/ValidateMixinTypes.d.ts +++ b/packages/form-core/types/validate/ValidateMixinTypes.d.ts @@ -37,7 +37,8 @@ export declare class ValidateHost { __syncValidationResult: Validator[]; __asyncValidationResult: Validator[]; __validationResult: Validator[]; - __prevShownValidationFeedback: string; + __prevValidationResult: Validator[]; + __prevShownValidationResult: Validator[]; connectedCallback(): void; disconnectedCallback(): void;