guillotinaweb / ngx-schema-form

HTML form generation based on JSON Schema
MIT License
485 stars 174 forks source link

Incorrect generated code in UMD for ver. 2.6.x #395

Closed iperevozchikov closed 3 years ago

iperevozchikov commented 3 years ago

Hello guys! Faced with next problem after updated dependency of your library to version 2.6.x - started to receive error in the storybook (ver. 6.2):

ERROR TypeError: ZSchema__namespace is not a constructor
    at ZSchemaValidatorFactory.push../node_modules/ngx-schema-form/bundles/ngx-schema-form.umd.js.ZSchemaValidatorFactory.createSchemaValidator (vendors~main.e3c7218fc6d502da4e64.bundle.js:227927)
    at new ZSchemaValidatorFactory (vendors~main.e3c7218fc6d502da4e64.bundle.js:227923)
    at _createClass (vendors~main.e3c7218fc6d502da4e64.bundle.js:86720)
    at _createProviderInstance (vendors~main.e3c7218fc6d502da4e64.bundle.js:86694)
    at resolveNgModuleDep (vendors~main.e3c7218fc6d502da4e64.bundle.js:86655)
    at NgModuleRef_.push../node_modules/@angular/core/bundles/core.umd.js.NgModuleRef_.get (vendors~main.e3c7218fc6d502da4e64.bundle.js:87269)
    at resolveDep (vendors~main.e3c7218fc6d502da4e64.bundle.js:87641)
    at callFactory (vendors~main.e3c7218fc6d502da4e64.bundle.js:87544)
    at _createProviderInstance$1 (vendors~main.e3c7218fc6d502da4e64.bundle.js:87504)
    at createProviderInstance (vendors~main.e3c7218fc6d502da4e64.bundle.js:87379)

After a small researching found that generated code in UMD is incorrect:

function _interopNamespace(e) {
    if (e && e.__esModule) return e;
    var n = Object.create(null);
    if (e) {
        Object.keys(e).forEach(function (k) {
            if (k !== 'default') {
                var d = Object.getOwnPropertyDescriptor(e, k);
                Object.defineProperty(n, k, d.get ? d : {
                    enumerable: true,
                    get: function () {
                        return e[k];
                    }
                });
            }
        });
    }
    n['default'] = e;
    return Object.freeze(n);
}

// Here is added "default" property as constructor to ZSchema__namespace
var ZSchema__namespace = /*#__PURE__*/_interopNamespace(ZSchema);
...
ZSchemaValidatorFactory.prototype.createSchemaValidator = function () {
    // But here called without it
    this.zschema = new ZSchema__namespace({
        breakOnFirstError: false
    });
};

Propose next solution to solve this:

  1. Enable esModuleInterop compile option (https://www.typescriptlang.org/tsconfig/#esModuleInterop)
  2. Fix importing of ZSchema in schemavalidatorfactory.ts: import ZSchema from 'z-schema';
  3. Profit! After that we would recieve correct generated bundle code:
    
    function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var ZSchemadefault = /*#PURE__*/_interopDefaultLegacy(ZSchema);

ZSchemaValidatorFactory.prototype.createSchemaValidator = function () { this.zschema = new ZSchema__default['default']({ breakOnFirstError: false }); };

ebrehault commented 3 years ago

Hi @iperevozchikov! It sounds good! Do you think you would have time you make a small pull request with these changes? I'll be happy to review it :)

iperevozchikov commented 3 years ago

PR: https://github.com/guillotinaweb/ngx-schema-form/pull/396 Also checked tests: :heavy_check_mark: all tests passed

ebrehault commented 3 years ago

Great! Thanks! It is merged and published on NPM (version 2.6.4)