Uncaught TypeError: (void 0) is not a function

[AshDevFr]

Hi,

I am trying to add ReForrm to my project using ReScript 10. I think this is probably why I'm getting errors but still wanted to share that.

I used the example frm the website to test and I get the same result.

It happens when I start typing in the input fiield.

Full Stacktrace

Uncaught TypeError: (void 0) is not a function
    at ReSchema.bs.js:328:35
    at keepU (belt_Array.js:360:9)
    at keep2 (belt_Array.js:371:10)
    at getFieldValidators (ReSchema.bs.js:327:23)
    at validateOne (ReSchema.bs.js:335:44)
    at _4 (curry.js:183:12)
    at _0 (ReForm.bs.js:146:56)
    at _1 (curry.js:32:12)
    at ReactUpdate.bs.js:53:32
    at keepMapU (belt_Array.js:400:15)
(anonymous) @ ReSchema.bs.js:328
keepU @ belt_Array.js:360
keep2 @ belt_Array.js:371
getFieldValidators @ ReSchema.bs.js:327
validateOne @ ReSchema.bs.js:335
_4 @ curry.js:183
_0 @ ReForm.bs.js:146
_1 @ curry.js:32
(anonymous) @ ReactUpdate.bs.js:53
keepMapU @ belt_Array.js:400
keepMap @ belt_Array.js:412
(anonymous) @ ReactUpdate.bs.js:52
commitHookEffectListMount @ react-dom.development.js:23150
commitPassiveMountOnFiber @ react-dom.development.js:24926
commitPassiveMountEffects_complete @ react-dom.development.js:24891
commitPassiveMountEffects_begin @ react-dom.development.js:24878
commitPassiveMountEffects @ react-dom.development.js:24866
flushPassiveEffectsImpl @ react-dom.development.js:27039
flushPassiveEffects @ react-dom.development.js:26984
flushSync @ react-dom.development.js:26176
finishEventHandler @ react-dom.development.js:3976
batchedUpdates @ react-dom.development.js:3994
dispatchEventForPluginEventSystem @ react-dom.development.js:9287
dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay @ react-dom.development.js:6465
dispatchEvent @ react-dom.development.js:6457
dispatchDiscreteEvent @ react-dom.development.js:6430

Code

module FormFields = %lenses(
  type state = {
    email: string,
    password: string,
  }
)

module Form = ReForm.Make(FormFields)

@react.component
let make = () => {
  let handleSubmit = ({state}: Form.onSubmitAPI) => {
    Js.log(state.values)

    None
  }

  let form = Form.use(
    ~initialState={email: "", password: ""},
    ~onSubmit=handleSubmit,
    ~validationStrategy=OnChange,
    ~schema={
      open Form.Validation

      schema([string(~min=8, Password), email(~error="Invalid email", Email)])
    },
    (),
  )

  <div>
    <input
      placeholder="Your email"
      value={form.values.email}
      onChange={ReForm.Helpers.handleChange(form.handleChange(Email))}
    />
  </div>
}

[vmarcosp]

Hey @AshDevFr sorry for the delay and thanks for reporting. Can you provide a reproducible project on github that I can fork and run locally?

[fakenickels]

oh that's strange. anyways we'll be trying to upgrade it to v10 soon too

[Freddy03h]

I got the same issue.

It seems that in a Rescript 10 projet import * as Caml_obj from "rescript/lib/es6/caml_obj.js"; in ReSchema.bs.js will use Caml_obj.equal while in Rescript 9 it's Caml_obj.caml_equal.

I force yarn resolution of rescript to 10 to solve the issue on my project.