Suggestion: ValidationRules.satisfies(...) should accept 'config' parameter as a function.

[senal]

We have a valid use case for the ValidationRules.satisfies() to take 'config' parameter as a function to be evaluated when validation get triggered.

Use case:
In our application "Business Registration Number" is an input filed which changes it's accepted character length depend on the selected country.
e.g
Australia -> accepted length: 11
China -> accepted length: 15

We validate this control on blur and display a message if the expected length is not met.

e.g
Australia :
"Business registration number must be 11 characters in length"
China :
"Business registration number must be 15 characters in length"

Implementation:
Our current implementation is look like as follows:

ValidationRules
.ensure((m: Registration) => m.businessNumber)
.displayName(() => this._i18N.tr(this.businessNumberPlaceholderKey))
.required().withMessageKey("validationMessages_FieldIsRequired_Client")
.then()
.satisfies(() => this.businessNumber.length === this.businessNumberLimit, 
              {exact: this.businessNumberLimit})
.withMessageKey("validationMessages_FieldHasInvalidLengthExact_Client")

validationMessages_FieldHasInvalidLengthExact_Client has been parametrized as follows:
${$displayName} must be ${$config.exact} characters in length.

Current behaviour:
we noticed that the { exact: this.businessNumberLimit} does not provide the value as expected. It always prints the default value.
The reason could be, it couldn't read the latest value stored on this.businessNumberLimit.

Expectation:
We are expecting satisfies(...) function to accept the configuration values as a function which could be evaluated and return an object at the time of validation.

e.g:

.satisfies(condition: (value: TValue, object: TObject) => boolean | Promise<boolean>, 
              config?: () => object): FluentRuleCustomizer<TObject, TValue>;

So then we could set the configure as follows:

.satisfies(() => this.businessNumber.length === this.businessNumberLimit, 
              () => {exact: this.businessNumberLimit})
   .withMessageKey("validationMessages_FieldHasInvalidLengthExact_Client")

Feel free to shoot at me if require further clarifications.

[sam-piper]

Hi guys,

Could we please get an acknowledgement for this issue? It's blocking us in several areas now, and we've been waiting for feedback for over 2 weeks now.

Thanks,

Sam

[jdanyow]

Hey @sam-piper - not 100% I follow the use-case- are you saying the validation message uses the exact property in the config?

If yes, here's a workaround you could try:

.satisfies(
  () => this.businessNumber.length === this.businessNumberLimit, 
  { get exact() { return this.businessNumberLimit; } }
)

This uses a property getter to ensure any access of the exact property gets the latest businessNumberLimit value.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/get

[sam-piper]

Thanks, using a property getter function works as well - the sample code needs to be modified to work though:

const self = this;  // view model scope
.satisfies(
  () => this.businessNumber.length === this.businessNumberLimit, 
  { get exact() { return self.businessNumberLimit; } }
)

Happy to use this workaround, you can close the issue. I think this really needs to be mentioned in the official documentation, as otherwise it will cause people some issues, and this workaround will save them a lot of time.

I still think the cleanest solution for rule configs is to accept an object or a function that returns an object, it allows for a cleaner coding style - this workaround is not as elegant, in my opinion.