TypeError: func is not a function on Validation Rule Set

Environment

• OS: OS X 10.13.6
• Node: 8.11
• NPM: 5.6
• react-advanaced-form: 1.5.0

What

Having a small problem that I can’t seem to nail down. I can’t even reproduce it on code sandbox, but can do it when I pull down a brand new create-react-app. When creating a field rule via the name property, on render I’m getting:

Uncaught TypeError: func is not a function
    at dispatch (index.development.js:24394)
    at flushFieldRefs (index.development.js:24892)
    at index.development.js:25090
    at _map (index.development.js:2367)
    at map (index.development.js:2760)
    at index.development.js:2221
    at index.development.js:1770
    at f1 (index.development.js:1636)
    at getRulesRefs (index.development.js:25094)
    at Object.createRulesSubscriptions (index.development.js:27243)
    at index.development.js:22207
    at Array.forEach (<anonymous>)

It looks like at https://github.com/kettanaito/react-advanced-form/blob/a00a08bfcab9a7427f38f383874445a99ac98a7c/src/utils/dispatch.js#L6

this function is going over the rules. When inspecting func, I’m getting back {someValidationFunction}, then `func(args) throws the above error.

This happens when I have something like

validation-rules.js

import isEmail from 'validator/lib/isEmail'
import isAlphanumeric from 'validator/lib/isAlphanumeric';
export default {
  type: {
    email: ({ value }) => isEmail(value),
    password: {
      capitalLetter: ({ value }) => /[A-Z]/.test(value),
      oneNumber: ({ value }) => /[0-9]/.test(value),
      minLength: ({ value }) => value.length > 5,
    },
  },

  name: {
    first_name: {
      isAlphanumeric: ({ value }) => value.length > 5,
    },
  },
}

when

Current behavior

Field cannot render and does not function when giving it the correct name property.

Expected behavior

This should render the field and create the field with it’s rules.

Why

I think this is something in a configuration, version of Webpack, babel but can’t find it myself ☹️ even after a few hours of swapping out versions.

How

Use the create-react-app and copy the code sandbox synchronous example. This I have been able to reproduce twice on the current 1.5.0 release. create-react-app@master.

If this can’t be solved it’s not a huge deal, as it seems to work great on another project! I just can’t nail down what might be causing this and though this might uncover something else otherwise.

Attached a project that should cause this issue as well! that might help!

react-advanced-form-broken-example.zip

[kettanaito]

Hi, @robertsonsamuel. I must say this is one of the greatest issue reports I’ve seen. Thank you for so detailed info and even your insights on what may cause this behavior.

I will investigate this when I have a spare minute and update this thread. Keep in touch.

[kettanaito]

I was able to reproduce the issue. It is unlikely that it relates to the configuration, but rather to the library itself. Will update once I have more info.