Auto Form is not working after meteor update

Hello, I’m currently trying to update the meteor version of my project from 1.0.12 to 2.12 and I’m facing an issue related to auto form from aldeed.

This is the error:

These are my packages:

And this is the code of the template where I’m using the auto form. What is weard is that it used to work before the update and I tried updating all the packages with meteor update so I really don’t know what is going on

<template name="adminTenantId">
  <h2>Empresas</h2>
  {{#if editMode}}

  <div class="container">
    {{> tenantLogo}}
    <div class="form-group col-sm-7">
      <form id="updateTenantForm">
        <div class="form-group" data-required="true">
          <label for="tenantName" class="control-label">Nome</label>
          <input
            type="text"
            name="name"
            id="tenantName"
            required=""
            class="form-control"
            value="{{tenant.name}}"
          />
          <span class="help-block"></span>
        </div>

        <div class="form-group">
          <label for="api_checkbox" class="control-label">Integração via API</label>
          <input
            id="api_checkbox"
            class="bootstrap-toggle"
            {{apiIntegrationChecked}}
            type="checkbox"
          />
          <span class="help-block"></span>
          <div style="margin: 0px 0px 30px 20px; {{apiIntegrationStyle}}">
            <div class="form-group" data-required="true">
              <label for="" class="control-label">API KEY</label>
              <input
                type="text"
                id="apiKeyInput"
                required=""
                readonly=""
                class="form-control"
                value="{{token}}"
              />
              <span class="help-block"></span>
              <button
                class="btn btn-default btn-sm btn-primary js-edit"
                id="api_regenerate_key_button"
              >
                Regerar
              </button>
            </div>

            <div class="form-group" data-required="true">
              <label for="" class="control-label">Usuário criador via API</label>
              <select
                class="form-control"
                id="tenantUser"
                title="Selecione o usuário para criador de exames"
              >
                {{#each tenantUsers}}
                <option>{{this.profile.fullName}}</option>
                {{/each}}
              </select>
              <span id="tenantUser" class="help-block"></span>
            </div>

            <!--
                        <label for="ftp_checkbox" class="control-label">Integração via FTP</label>
                        <input id="ftp_checkbox" class="bootstrap-toggle" {{ftpIntegrationChecked}} type="checkbox">
                        <span class="help-block"></span>
                        <div style="margin: 0px 0px 30px 20px; {{ftpIntegrationStyle}}">
                            <div class="form-group" data-required="true">
                                <label for="" class="control-label">Usuário</label>
                                <input type="text" name="name" id="" required="" data-schema-key="name" class="form-control" value="teste">
                                <span class="help-block"></span>
                            </div>
                            <div class="form-group" data-required="true">
                                <label for="" class="control-label">Senha</label>
                                <input type="password" name="name" id="" required="" data-schema-key="name" class="form-control" value="teste">
                                <span class="help-block"></span>
                            </div>
                            <div class="form-group" data-required="true">
                                <label for="" class="control-label">Confirmação</label>
                                <input type="password" name="name" id="" required="" data-schema-key="name" class="form-control" value="teste">
                                <span class="help-block"></span>
                            </div>
                        </div>
                        -->
          </div>
        </div>

        <div class="form-group">
          <label for="ubs_checkbox" class="control-label">Unidade Básica de Saúde</label>
          <input id="ubs_checkbox" class="bootstrap-toggle" {{ubsChecked}} type="checkbox" />
          <div style="margin: 0px 0px 30px 20px; {{ubsStyle}}">
            <div class="form-group" data-required="true">
              <label for="" class="control-label">CNES</label>
              <input type="text" id="cnesInput" required="" class="form-control" value="{{cnes}}" />
              <span class="help-block"></span>
            </div>
          </div>
        </div>

        <div class="form-group">
          <label for="isCustomTenant_checkbox" class="control-label">Pagina Customizada</label>
          <input
            id="isCustomTenant_checkbox"
            class="bootstrap-toggle"
            {{isCustomTenantChecked}}
            type="checkbox"
          />
          <div style="margin: 0px 0px 30px 20px; {{isCustomTenantStyle}}">
            <div class="form-group" data-required="true">
              <div class="form-group" data-required="true">
                <label for="primaryColor" class="control-label">Cor primária</label>
                <input
                  type="text"
                  name="primaryColor"
                  id="primaryColor"
                  required=""
                  class="form-control"
                  value="{{tenant.colorPalette.primary}}"
                />
                <span class="help-block"></span>
              </div>
            </div>
            <div class="form-group" data-required="true">
              <label for="secondaryColor" class="control-label">Cor secundária</label>
              <input
                type="text"
                name="secondaryColor"
                id="secondaryColor"
                required=""
                class="form-control"
                value="{{tenant.colorPalette.secondary}}"
              />
              <span class="help-block"></span>
            </div>
          </div>
        </div>

        <div>
          <button type="submit" id="button-submit" class="btn btn-primary submit">Salvar</button>
          <button type="button" class="btn btn-default cancel">Cancelar</button>
        </div>
      </form>
    </div>
  </div>

  {{else}}

  <div class="container">
    {{> tenantLogo}}
    <div class="form-group col-sm-7">
      {{#autoForm collection="Tenant" doc=tenant id="updateTenantForm" type="readonly"}} {{>
      afQuickField name="name" disabled="true"}}
      <div class="form-group">
        <label for="api_checkbox" class="control-label">Integração via API</label>
        <input
          id="api_checkbox"
          class="bootstrap-toggle"
          {{apiIntegrationChecked}}
          disabled
          type="checkbox"
        />
        <div style="margin: 0px 0px 30px 20px; {{apiIntegrationStyle}}">
          <div class="form-group" data-required="true">
            <label for="" class="control-label">API KEY</label>
            <input
              type="text"
              name="name"
              disabled=""
              id=""
              required=""
              data-schema-key="name"
              readonly=""
              class="form-control"
              value="{{token}}"
            />
          </div>

          <div class="form-group" data-required="true">
            <label for="" class="control-label">Usuário criador via API</label>
            <select
              class="form-control"
              id="tenantUser"
              title="Nenhum usuário selecionado"
              disabled
            >
              {{#each tenantUsers}}
              <option>{{this.profile.fullName}}</option>
              {{/each}}
            </select>
          </div>

          <!--
                        <label for="ftp_checkbox" class="control-label">Integração via FTP</label>
                        <input id="ftp_checkbox" class="bootstrap-toggle" disabled {{ftpIntegrationChecked}} type="checkbox">
                        <div style="margin: 0px 0px 30px 20px; ; {{ftpIntegrationStyle}}">
                            <div class="form-group" data-required="true">
                                <label for="" class="control-label">Usuário</label>
                                <input type="text" name="name" disabled id="" required="" data-schema-key="name" readonly="" class="form-control" value="teste">
                                <span class="help-block"></span>
                            </div>
                        </div>
                        -->
        </div>

        <div class="form-group">
          <label for="ubs_checkbox" class="control-label">Unidade Básica de Saúde</label>
          <input
            id="ubs_checkbox"
            class="bootstrap-toggle"
            disabled
            {{ubsChecked}}
            type="checkbox"
          />
          <div style="margin: 0px 0px 30px 20px; {{ubsStyle}}">
            <div class="form-group" data-required="true">
              <label for="" class="control-label">CNES</label>
              <input
                type="text"
                id="cnesInput"
                required=""
                disabled
                class="form-control"
                value="{{cnes}}"
              />
            </div>
          </div>
        </div>
      </div>

      <div>
        <button class="btn btn-primary js-edit" id="enableEditMode">Editar</button>
        <button class="btn btn-default js-return">Voltar</button>
      </div>
      {{/autoForm}}
    </div>
  </div>

  {{/if}}
</template>

These are the versions of my packages…

accounts-base@2.2.8
accounts-password@2.3.4
accounts-ui@1.4.2
accounts-ui-unstyled@1.7.0
aldeed:autoform@5.8.1
aldeed:autoform-bs-datepicker@1.2.0
aldeed:collection2@2.10.0
aldeed:collection2-core@1.2.0
aldeed:schema-deny@1.1.0
aldeed:schema-index@1.1.1
aldeed:simple-schema@1.5.4
allow-deny@1.1.1
autoupdate@1.8.0
babel-compiler@7.10.4
babel-runtime@1.5.1
base64@1.0.12
binary-heap@1.0.11
blaze@2.5.0
blaze-html-templates@1.1.2
blaze-tools@1.1.1
boilerplate-generator@1.7.1
caching-compiler@1.2.2
caching-html-compiler@1.2.0
callback-hook@1.5.1
check@1.3.2
coffeescript@1.0.17
ddp@1.4.1
ddp-client@2.6.1
ddp-common@1.4.0
ddp-rate-limiter@1.2.0
ddp-server@2.6.1
deps@1.0.12
diff-sequence@1.1.2
dynamic-import@0.7.3
ecmascript@0.16.7
ecmascript-runtime@0.8.1
ecmascript-runtime-client@0.12.1
ecmascript-runtime-server@0.11.0
edgee:slingshot@0.7.1
ejson@1.1.3
email@2.2.5
es5-shim@4.8.0
fetch@0.1.3
geojson-utils@1.0.11
handlebars@1.0.7
hot-code-push@1.0.4
html-tools@1.1.1
htmljs@1.1.0
http@2.0.0
id-map@1.1.1
inter-process-messaging@0.1.1
iron:controller@1.1.0
iron:core@1.0.11
iron:dynamic-template@1.1.0
iron:layout@1.0.12
iron:location@1.1.0
iron:middleware-stack@1.1.0
iron:router@1.1.2
iron:url@1.1.0
joshowens:accounts-entry@1.0.4
joshowens:simple-form@0.2.2
jquery@1.11.11
launch-screen@1.3.0
less@4.0.0
livedata@1.0.18
localstorage@1.2.0
logging@1.3.2
matb33:collection-hooks@1.2.2
mdg:validation-error@0.5.1
meteor@1.11.2
meteor-base@1.5.1
meteorhacks:inject-initial@1.0.4
meteorhacks:ssr@2.2.0
meteorhacks:zones@1.6.0
meteortoys:toykit@4.0.2
minifier-css@1.6.4
minifier-js@2.7.5
minimongo@1.9.3
mobile-experience@1.1.0
mobile-status-bar@1.1.0
modern-browsers@0.1.9
modules@0.19.0
modules-runtime@0.13.1
momentjs:moment@2.24.0
mongo@1.16.6
mongo-decimal@0.1.3
mongo-dev-server@1.1.0
mongo-id@1.0.8
mongo-livedata@1.0.12
montiapm:agent@2.45.0
montiapm:meteorx@2.2.0
mrt:underscore-string-latest@2.3.3
msavin:jetsetter@4.0.0
msavin:mongol@7.0.0
npm-mongo@4.16.0
observe-sequence@1.0.16
ordered-dict@1.1.0
percolate:synced-cron@1.3.2
promise@0.12.2
raix:eventemitter@0.1.3
rajit:bootstrap3-datepicker@1.7.1_1
random@1.2.1
rate-limit@1.1.1
react-fast-refresh@0.2.7
reactive-dict@1.3.1
reactive-var@1.0.12
reload@1.3.1
retry@1.1.0
routepolicy@1.1.1
schnie:uploader@0.0.2
service-configuration@1.3.1
session@1.2.1
sha@1.0.9
shell-server@0.5.0
simple:json-routes@2.1.0
socket-stream-client@0.5.1
softwarerero:accounts-t9n@1.3.11
spacebars@1.2.0
spacebars-compiler@1.2.1
standard-minifier-css@1.9.2
standard-minifier-js@2.8.1
templating@1.4.1
templating-compiler@1.4.1
templating-runtime@1.5.0
templating-tools@1.2.0
test-helpers@1.3.1
tinytest@1.2.2
tmeasday:publish-counts@0.8.0
tracker@1.3.2
ui@1.0.13
underscore@1.0.13
url@1.3.2
webapp@1.13.5
webapp-hashing@1.1.1
zodern:meteor-package-versions@0.2.1
zodern:types@1.0.9
1 Like

Oh, that is quite a big jump. You should try a few successive updates, because there are breaking changes in many versions. Try at least updating to 1.6 first. Also, keep an eye on Changelog | Meteor API Docs

I actually did it, I updated 1 by 1 and the other things are already solved but there are still some little things to solve… but the application itself does run already

autoform also updated and requires some modifications. I think you should update and follow its migration guide Meteor-Community-Packages/meteor-autoform: AutoForm is a Meteor package that adds UI components and helpers to easily create basic forms with automatic insert and update events, and automatic reactive validation. (github.com)

Well, I updated autoform to 6.0.0 because I couldn’t update to 7.0.0 because of the aldeed:autoform-bs-datepicker. I was trying to use the 7.0.0 but then this other package was broking so in the end I removed both and run meteor add aldeed:autoform-bs-datepicker@2.0.0 that is the latest version and then it automatically downloaded the 6.0.0 version of the autoform.

In the AutoForm 6+ versions I need to install simple schema with npm as the docs say.

npm i --save simpl-schema

But then when I run the project now, it shows me this:

So what I’ve tried was to import simple schema from the npm package but apparently I need to do more than that

This is the code that shows the error:

/* eslint-disable no-undef */
import _ from 'lodash'
import SimpleSchema from 'simpl-schema';

Schema = {}

SimpleSchema.messages({
  passwordMismatch: 'Senhas digitadas não são iguais',
  invalidCpf: 'Digite um CPF válido',
  required: '[label] é um campo obrigatório',
  'errorType birthdate': 'Digite uma data válida',
  nameRestrictions: 'O nome foi digitado incorretamente',
  regEx: [
    {exp: SimpleSchema.RegEx.Email, msg: 'Digite um endereço de email válido'}
  ]
})


Diseases = [
  'HAS (Hipertensão Arterial Sistêmica)',
  'DM (Diabetes Mellitus)',
  'Alergia',
  'Cirurgia Oftálmica prévia',
  'Glaucoma'
]

examFilterTypesi18 = function(input = '') {
  switch (input.toLowerCase()) {
    case 'all': case 'todos': return 'All'
    case 'mine': case 'meus': return 'Mine'
    case 'todo': case 'afazer': return 'Todo'
    case 'express': case 'expresso': case 'Exames 24h': return 'Express'
  }
}

stringCapitalization = function(input, connectors) {
  let fixed = []
  _.each(String(input).split(/ /), function(token) {
    if (connectors && connectors.indexOf(token.toLowerCase()) > -1) fixed.push(token.toLowerCase())
    else fixed.push(token.charAt(0).toUpperCase() + token.substr(1).toLowerCase())
  })
  return String(fixed.join(' '))
}

fixName = (input) => {
  return stringCapitalization(
    input, ['da', 'de', 'do', 'das', 'dos', 'e']
  ).replace(/\s+/g, ' ').trim() // remove unwanted spaces
}

Thanks in advance for any help. I confess I’m kinda lost at this point. Any documentation would help too.

@joao-bermal is the BS date picker this one: GitHub - Meteor-Community-Packages/meteor-autoform-bs-datepicker: Custom "bootstrap-datepicker" input type for AutoForm

If so please leave an issue there, it needs to be updated to work with Autoform 7 (I’m maintainer)

Ping me @jkuester if you have trouble with Autoform

I think the issue you’re having is because simpl-schema dropped some meteor features with the last big update - v3 I think - in this case the pre-defined Regex’s. So you’d need to pin your version to v1 (he skipped a version IIRC). We forked and also fixed an issue with the nested schema validation here. I think there was a plan to create a MCP version but @jkuester will know more about that.

I will try to update the datepicker this week but the simple schema community package will time some more time. If someone wants to help please ping me

1 Like

I think that this is a good sugestion but how can I use this v1 in my project? Can I install it through npm or should I install the repo and add manually to my project?

You’ll want to set your npm version of simpl-schema to ^1.0.0 (here are the versions: simpl-schema - npm)

You’ve removed the meteor simple-schema (with the e) package right?

Okay, yes I removed the meteor package. I got confused because I didn’t understand if that repo you mencioned had something different because of the fork, but now I see, I just have to specificate the version in the package.json.

@marklynch I deleted my node_modules and run npm install again but I got this error.


I don’t know if I there was a problem installing this package but I would say it is unlikely because in the package-lock.json it shows that the 1.13.1 is installed so probably I’m doing something wrong in the code.

"simpl-schema": {
      "version": "1.13.1",
      "resolved": "https://registry.npmjs.org/simpl-schema/-/simpl-schema-1.13.1.tgz",
      "integrity": "sha512-20Qc2X13TvLJYY37eapvJ5CWyYYSScX2BJV5RcP4A15efA4k8c0XEsp9F/RofQi/IMrp7PzyxTXyjwlG7EFhCQ==",
      "requires": {
        "clone": "^2.1.2",
        "message-box": "^0.2.7",
        "mongo-object": "^0.1.4"
      }
    },

There’s a migration guide here for updating to the npm package. It’s a painful process I’m afraid. Depending on the size of your project & how much time you want to spend it might be better for you just to stick with the original meteor package and not update to the npm package. If you’re a heavy Autoform user it probably makes sense as v7 fixes a lot of bugs.

Also, 1.13.1 is the expected result from specifying ^1.0.0 in your package.json

Yes, by yesterday I’ve had to change a tone of code. I believe that it is near to the end but I’ll see if this takes me much more time… But how would I stick with the original meteor package in this case? Because before all of this I tried to use the meteor package but I was forced to install the npm package…

I don’t think anything should force you. If you stay on AF 5 you could avoid using the npm package and stick with the meteor one. AF 6 I don’t think adds much but AF7 which had a lot of community work is definitely a big improvement.

Yes, turns out that upgrading autoform to 6.3.0 didn’t solve the problem, I had to change a tone of code and in the end when it did run, the problems were the same… I honestly don’t know what to do.

You have to stay on v5 to avoid the upgrade. 5.8.1 was the last version you can use to avoid the npm package. See here