@luomus/laji-form 15.1.5 → 15.1.7

package/lib/validation.d.ts

@@ -0,0 +1,7 @@
+export function initializeValidation(apiClient: any): void;
+export function transformErrors(translations: any, errors: any): any;
+declare function _default({ errors: error, warnings: warning }: {
+    errors: any;
+    warnings: any;
+}, data: any): Promise<any>;
+export default _default;

package/lib/validation.js

@@ -0,0 +1,141 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.transformErrors = exports.initializeValidation = void 0;
+const lajiValidate = require("@luomus/laji-validate");
+function initializeValidation(apiClient) {
+    lajiValidate.extend(lajiValidate.validators.remote, {
+        fetch: (...params) => apiClient.fetchRaw(...params)
+    });
+}
+exports.initializeValidation = initializeValidation;
+exports.default = ({ errors: error, warnings: warning }, data) => {
+    const promises = [];
+    const getPromiseForValidator = (type, validator) => {
+        return lajiValidate.async(data, validator)
+            .then(() => { })
+            .catch(res => res)
+            .then(err => { return { type, err }; });
+    };
+    const _validators = { error, warning };
+    Object.keys(_validators).forEach(type => {
+        const validator = _validators[type];
+        promises.push(getPromiseForValidator(type, validator));
+    });
+    return Promise.all(promises).then((res) => {
+        const messages = res.reduce((arr, { type, err }) => {
+            arr = arr.concat(getMessages(err, type));
+            return arr;
+        }, []);
+        return Promise.resolve(toErrorSchema(messages));
+    });
+};
+function transformErrors(translations, errors) {
+    return errors.map(error => {
+        if (error.name === "type") {
+            error.message = translations.TypeError + translations[error.params.type] + ".";
+        }
+        else if (error.name === "required") {
+            error.message = translations.FieldIsRequired + ".";
+        }
+        return error;
+    });
+}
+exports.transformErrors = transformErrors;
+function getMessages(result, type) {
+    const messages = [];
+    for (let k in result) {
+        for (let l in result[k]) {
+            const message = (type !== "validators") ? `[${type}]` + result[k][l] : result[k][l];
+            messages.push({
+                property: "instance." + k,
+                message: message
+            });
+        }
+    }
+    return messages;
+}
+// these are taken from @rjsf/core to convert error messages to wanted form
+// see https://github.com/mozilla-services/@rjsf/core/blob/master/src/validate.js
+function toErrorSchema(errors) {
+    // Transforms a jsonschema validation errors list:
+    // [
+    //   {property: "instance.level1.level2[2].level3", message: "err a"},
+    //   {property: "instance.level1.level2[2].level3", message: "err b"},
+    //   {property: "instance.level1.level2[4].level3", message: "err b"},
+    // ]
+    // Into an error tree:
+    // {
+    //   level1: {
+    //     level2: {
+    //       2: {level3: {errors: ["err a", "err b"]}},
+    //       4: {level3: {errors: ["err b"]}},
+    //     }
+    //   }
+    // };
+    if (!errors.length) {
+        return {};
+    }
+    return errors.reduce(function (errorSchema, error) {
+        var property = error.property;
+        var message = error.message;
+        var path = errorPropertyToPath(property);
+        var parent = errorSchema;
+        var _iteratorNormalCompletion = true;
+        var _didIteratorError = false;
+        var _iteratorError = undefined;
+        try {
+            for (var _iterator = path.slice(1)[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
+                var segment = _step.value;
+                if (!(segment in parent)) {
+                    parent[segment] = {};
+                }
+                parent = parent[segment];
+            }
+        }
+        catch (err) {
+            _didIteratorError = true;
+            _iteratorError = err;
+        }
+        finally {
+            try {
+                if (!_iteratorNormalCompletion && _iterator.return) {
+                    _iterator.return();
+                }
+            }
+            finally {
+                if (_didIteratorError) {
+                    throw _iteratorError;
+                }
+            }
+        }
+        if (Array.isArray(parent.__errors)) {
+            // We store the list of errors for this node in a property named __errors
+            // to avoid name collision with a possible sub schema field named
+            // "errors" (see `validate.createErrorHandler`).
+            parent.__errors = parent.__errors.concat(message);
+        }
+        else {
+            parent.__errors = [message];
+        }
+        return errorSchema;
+    }, {});
+}
+const RE_ERROR_ARRAY_PATH = /\[\d+]/g;
+function errorPropertyToPath(property) {
+    // Parse array indices, eg. "instance.level1.level2[2].level3"
+    // => ["instance", "level1", "level2", 2, "level3"]
+    return property.split(".").reduce(function (path, node) {
+        var match = node.match(RE_ERROR_ARRAY_PATH);
+        if (match) {
+            var nodeName = node.slice(0, node.indexOf("["));
+            var indices = match.map(function (str) {
+                return parseInt(str.slice(1, -1), 10);
+            });
+            path = path.concat(nodeName, indices);
+        }
+        else {
+            path.push(node);
+        }
+        return path;
+    }, []);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luomus/laji-form",
-  "version": "15.1.5",
+  "version": "15.1.7",
   "description": "React module capable of building dynamic forms from Laji form json schemas",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
@@ -14,7 +14,7 @@
     "preversion": "npm run lint && npm test",
     "version": "bin/update-changelog.sh",
     "postversion": "npm publish",
-    "prepublishOnly": "npm run build && git push & git push --tags",
+    "prepublishOnly": "npm run build && git push && git push --tags",
     "lint": "eslint -c .eslintrc.prod.json src playground",
     "test": "npx playwright test"
   },

package/test-export/test-utils.d.ts

@@ -57,8 +57,8 @@ interface DemoPageProps {
 }
 export declare class Form {
     protected page: Page;
-    protected locator: Locator;
-    constructor(page: Page, locator?: Locator);
+    protected $locator: Locator;
+    constructor(page: Page, $locator?: Locator);
     $form: Locator;
     $locate(path: string): Locator;
     $locateButton(path: string, selector: string, locateFromBody?: boolean): Locator;
@@ -252,6 +252,7 @@ export declare const mockImageMetadata: {
 };
 export declare const filterUUIDs: (any: any) => any;
 export declare const maybeJSONPointerToLocator: (pointer: string) => string;
+/** Fills value into given input and presses tab to unfocus it. Useful for inputs with debounce */
 export declare const updateValue: ($input: Locator, value: string) => Promise<void>;
 export declare const getRemoveUnit: (page: Page) => (gatheringIdx: number, unitIdx: number) => Promise<void>;
 export {};

package/test-export/test-utils.js

@@ -45,25 +45,25 @@ function getEnumWidgetForContainer($container) {
     };
 }
 class Form {
-    constructor(page, locator = page.locator(".laji-form")) {
+    constructor(page, $locator = page.locator(".laji-form")) {
         this.page = page;
-        this.locator = locator;
-        this.$form = this.page.locator(".laji-form .rjsf");
+        this.$locator = $locator;
+        this.$form = this.$locator.locator(".rjsf");
         this.getMockStr = (path, query) => `window.mockResponses[window.getMockQueryKey(${JSON.stringify(path)}, ${JSON.stringify(query)})]`;
         this.createValidatorPO = (type) => ({
-            $$all: this.page.locator(`.laji-form-error-list:not(.laji-form-failed-jobs-list) .${type}-panel .list-group button`),
-            $panel: this.page.locator(`.laji-form-error-list:not(.laji-form-failed-jobs-list) .${type}-panel`)
+            $$all: this.$locator.locator(`.laji-form-error-list:not(.laji-form-failed-jobs-list) .${type}-panel .list-group button`),
+            $panel: this.$locator.locator(`.laji-form-error-list:not(.laji-form-failed-jobs-list) .${type}-panel`)
         });
         this.errors = this.createValidatorPO("error");
         this.warnings = this.createValidatorPO("warning");
         this.failedJobs = {
-            $container: this.page.locator(".laji-form-failed-jobs-list"),
-            $$errors: this.page.locator(".laji-form-failed-jobs-list .list-group-item")
+            $container: this.$locator.locator(".laji-form-failed-jobs-list"),
+            $$errors: this.$locator.locator(".laji-form-failed-jobs-list .list-group-item")
         };
-        this.$runningJobs = this.page.locator(".running-jobs");
-        this.$acknowledgeWarnings = this.page.locator(".laji-form-warning-list .panel-footer button");
+        this.$runningJobs = this.$locator.locator(".running-jobs");
+        this.$acknowledgeWarnings = this.$locator.locator(".laji-form-warning-list .panel-footer button");
         this.$blocker = this.page.locator(".laji-form.blocking-loader");
-        this.$mapFieldFullscreenMap = this.page.locator(".laji-form.fullscreen .laji-form-map");
+        this.$mapFieldFullscreenMap = this.$locator.locator(".laji-form.fullscreen .laji-form-map");
         this.getImageArrayField = (lajiFormLocator) => {
             const $container = this.$locate(lajiFormLocator).locator(".laji-form-medias");
             const $imgContainers = this.$locate(lajiFormLocator).locator(".media-container");
@@ -92,7 +92,7 @@ class Form {
         };
         this.getTaxonAutosuggestWidget = (lajiFormLocator) => {
             const autosuggest = this.getAutosuggestWidget(lajiFormLocator);
-            return Object.assign(Object.assign({}, autosuggest), { $powerUserButton: this.page.locator(".power-user-addon"), $suggestedGlyph: this.$locate(lajiFormLocator).locator(".glyphicon-ok"), $nonsuggestedGlyph: this.$locate(lajiFormLocator).locator(".glyphicon-warning-sign") });
+            return Object.assign(Object.assign({}, autosuggest), { $powerUserButton: this.$locator.locator(".power-user-addon"), $suggestedGlyph: this.$locate(lajiFormLocator).locator(".glyphicon-ok"), $nonsuggestedGlyph: this.$locate(lajiFormLocator).locator(".glyphicon-warning-sign") });
         };
         this.getPersonAutosuggestWidget = (lajiFormLocator) => {
             const autosuggest = this.getAutosuggestWidget(lajiFormLocator);
@@ -151,10 +151,10 @@ class Form {
         };
     }
     $locate(path) {
-        return this.page.locator(exports.lajiFormLocator(path));
+        return this.$locator.locator(exports.lajiFormLocator(path));
     }
     $locateButton(path, selector, locateFromBody = false) {
-        return (locateFromBody ? this.page : this.locator).locator(`#root${typeof path === "string" && path.length > 0 ? `_${path.replace(/\./g, "_")}` : ""}-${selector}`);
+        return (locateFromBody ? this.page : this.$locator).locator(`#root${typeof path === "string" && path.length > 0 ? `_${path.replace(/\./g, "_")}` : ""}-${selector}`);
     }
     $locateAddition(path, selector, locateFromBody = false) {
         return this.$locateButton(path, selector, locateFromBody);
@@ -356,6 +356,7 @@ const filterUUIDs = (any) => {
 exports.filterUUIDs = filterUUIDs;
 const maybeJSONPointerToLocator = (pointer) => pointer[0] === "/" ? pointer.slice(1).replace(/\//g, "_") : pointer;
 exports.maybeJSONPointerToLocator = maybeJSONPointerToLocator;
+/** Fills value into given input and presses tab to unfocus it. Useful for inputs with debounce */
 const updateValue = ($input, value) => __awaiter(void 0, void 0, void 0, function* () {
     yield $input.fill(value);
     yield $input.press("Tab");