@projectcaluma/ember-form 11.0.0-beta.6 → 11.0.0-beta.7

package/CHANGELOG.md

@@ -1,3 +1,18 @@
+# [@projectcaluma/ember-form-v11.0.0-beta.7](https://github.com/projectcaluma/ember-caluma/compare/@projectcaluma/ember-form-v11.0.0-beta.6...@projectcaluma/ember-form-v11.0.0-beta.7) (2022-02-03)
+
+
+### Bug Fixes
+
+* **validation:** sync format validator validation with backend ([ee66968](https://github.com/projectcaluma/ember-caluma/commit/ee66968230b9f0e4c5a4df8bdb3f8e58b44b5b82))
+
+
+### BREAKING CHANGES
+
+* **validation:** Use the `formatValidators` property of the backend to store and read
+format validators instead of the `meta.formatValidators` so the backend
+validates as well. For more information on how to migrate check the
+migration guide to v11.
+
 # [@projectcaluma/ember-form-v11.0.0-beta.6](https://github.com/projectcaluma/ember-caluma/compare/@projectcaluma/ember-form-v11.0.0-beta.5...@projectcaluma/ember-form-v11.0.0-beta.6) (2022-02-02)
 
 

package/addon/gql/fragments/field.graphql

@@ -19,6 +19,15 @@ fragment SimpleQuestion on Question {
       value
     }
     placeholder
+    formatValidators {
+      edges {
+        node {
+          slug
+          regex
+          errorMsg
+        }
+      }
+    }
   }
   ... on TextareaQuestion {
     textareaMinLength: minLength
@@ -28,6 +37,15 @@ fragment SimpleQuestion on Question {
       value
     }
     placeholder
+    formatValidators {
+      edges {
+        node {
+          slug
+          regex
+          errorMsg
+        }
+      }
+    }
   }
   ... on IntegerQuestion {
     integerMinValue: minValue

package/addon/lib/field.js

@@ -3,6 +3,7 @@ import { assert } from "@ember/debug";
 import { associateDestroyableChild } from "@ember/destroyable";
 import { inject as service } from "@ember/service";
 import { camelize } from "@ember/string";
+import { isEmpty } from "@ember/utils";
 import { tracked } from "@glimmer/tracking";
 import { queryManager } from "ember-apollo-client";
 import { restartableTask, lastValue, dropTask } from "ember-concurrency";
@@ -63,7 +64,6 @@ const fieldIsHiddenOrEmpty = (field) => {
  */
 export default class Field extends Base {
   @service intl;
-  @service validator;
 
   @queryManager apollo;
 
@@ -628,6 +628,35 @@ export default class Field extends Base {
     this._errors = errors;
   }
 
+  /**
+   * Validate the value against the regexes of the given format validators.
+   *
+   * @method _validateFormatValidators
+   * @return {Array<Boolean|Object>} An array of error objects or `true`
+   * @private
+   */
+  _validateFormatValidators() {
+    const validators =
+      this.question.raw.formatValidators?.edges.map((edge) => edge.node) ?? [];
+    const value = this.answer.value;
+
+    if (isEmpty(value)) {
+      // empty values should not be validated since they are handled by the
+      // requiredness validation
+      return validators.map(() => true);
+    }
+
+    return validators.map((validator) => {
+      return (
+        new RegExp(validator.regex).test(value) || {
+          type: "format",
+          context: { errorMsg: validator.errorMsg },
+          value,
+        }
+      );
+    });
+  }
+
   /**
    * Method to validate if a question is required or not.
    *
@@ -647,15 +676,12 @@ export default class Field extends Base {
    * predefined by the question.
    *
    * @method _validateTextQuestion
-   * @return {Promise<Boolean|Object>} A promise which resolves into an object if invalid or true if valid
+   * @return {Array<Boolean|Object>} An array of error objects or `true`
    * @private
    */
-  async _validateTextQuestion() {
+  _validateTextQuestion() {
     return [
-      ...(await this.validator.validate(
-        this.answer.value,
-        this.question.raw.meta.formatValidators ?? []
-      )),
+      ...this._validateFormatValidators(),
       validate("length", this.answer.value, {
         min: this.question.raw.textMinLength || 0,
         max: this.question.raw.textMaxLength || Number.POSITIVE_INFINITY,
@@ -668,15 +694,12 @@ export default class Field extends Base {
    * than predefined by the question.
    *
    * @method _validateTextareaQuestion
-   * @return {Promise<Boolean|Object>} A promise which resolves into an object if invalid or true if valid
+   * @return {Array<Boolean|Object>} An array of error objects or `true`
    * @private
    */
-  async _validateTextareaQuestion() {
+  _validateTextareaQuestion() {
     return [
-      ...(await this.validator.validate(
-        this.answer.value,
-        this.question.raw.meta.formatValidators ?? []
-      )),
+      ...this._validateFormatValidators(),
       validate("length", this.answer.value, {
         min: this.question.raw.textareaMinLength || 0,
         max: this.question.raw.textareaMaxLength || Number.POSITIVE_INFINITY,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@projectcaluma/ember-form",
-  "version": "11.0.0-beta.6",
+  "version": "11.0.0-beta.7",
   "description": "Ember addon for rendering Caluma forms.",
   "keywords": [
     "ember-addon"
@@ -16,7 +16,7 @@
   "dependencies": {
     "@glimmer/component": "^1.0.4",
     "@glimmer/tracking": "^1.0.4",
-    "@projectcaluma/ember-core": "^11.0.0-beta.2",
+    "@projectcaluma/ember-core": "^11.0.0-beta.3",
     "ember-apollo-client": "^3.2.0",
     "ember-auto-import": "^2.4.0",
     "ember-autoresize-modifier": "^0.5.0",
@@ -45,7 +45,7 @@
     "@ember/test-helpers": "2.6.0",
     "@embroider/test-setup": "1.0.0",
     "@faker-js/faker": "6.0.0-alpha.5",
-    "@projectcaluma/ember-testing": "10.2.0-beta.2",
+    "@projectcaluma/ember-testing": "11.0.0-beta.1",
     "@projectcaluma/ember-workflow": "11.0.0-beta.3",
     "broccoli-asset-rev": "3.0.0",
     "ember-cli": "3.28.5",