Yup: when does not work with number

[rofrol]

I get error: TypeError: Cannot read property 'length' of undefined

For example I have this validation:

const agreementDurationAmount = Yup.number().when('agreementDuration', (agreementDuration) => {
  if(agreementDuration === 'Miesięczny') {
    return Yup.number().min(1, 'Czas trwania umowy: wprowadź liczbę miesięcy');
  }
  if(agreementDuration === 'Tygodniowy') {
    return Yup.number().min(1, 'Czas trwania umowy: wprowadź liczbę tygodni');
  }
  return Yup.number();
});

And such object:

{
  agreementDuration: 'Nieokreślony',
  agreementDurationAmount: 0,
}

[jquense]

What isn't working?

[rofrol]

I just got error in the console

formik.es6.js:377 Uncaught (in promise) TypeError: Cannot read property 'length' of undefined
    at yupToFormErrors (formik.es6.js:377)
    at formik.es6.js:167
    at <anonymous>
  | yupToFormErrors | @ | formik.es6.js:377
-- | -- | -- | --
  | (anonymous) | @ | formik.es6.js:167
  | Promise rejected (async) |   |  
  | Formik._this.runValidationSchema | @ | formik.es6.js:161
  | Formik._this.submitForm | @ | formik.es6.js:262
  | Formik._this.handleSubmit | @ | formik.es6.js:234
  | ReactErrorUtils.invokeGuardedCallback | @ | ReactErrorUtils.js:69
  | executeDispatch | @ | EventPluginUtils.js:85
  | executeDispatchesInOrder | @ | EventPluginUtils.js:108
  | executeDispatchesAndRelease | @ | EventPluginHub.js:43
  | executeDispatchesAndReleaseTopLevel | @ | EventPluginHub.js:54
  | forEachAccumulated | @ | forEachAccumulated.js:24
  | processEventQueue | @ | EventPluginHub.js:254
  | runEventQueueInBatch | @ | ReactEventEmitterMixin.js:17
  | handleTopLevel | @ | ReactEventEmitterMixin.js:27
  | handleTopLevelImpl | @ | ReactEventListener.js:72
  | batchedUpdates | @ | ReactDefaultBatchingStrategy.js:60
  | batchedUpdates | @ | ReactUpdates.js:97
  | dispatchEvent | @ | ReactEventListener.js:147
  | componentDidUpdate | @ | App.jsx:17
  | measureLifeCyclePerf | @ | ReactCompositeComponent.js:75
  | (anonymous) | @ | ReactCompositeComponent.js:728
  | notifyAll | @ | CallbackQueue.js:76
  | close | @ | ReactReconcileTransaction.js:80
  | closeAll | @ | Transaction.js:209
  | perform | @ | Transaction.js:156
  | perform | @ | Transaction.js:143
  | perform | @ | ReactUpdates.js:89
  | flushBatchedUpdates | @ | ReactUpdates.js:172
  | closeAll | @ | Transaction.js:209
  | perform | @ | Transaction.js:156
  | batchedUpdates | @ | ReactDefaultBatchingStrategy.js:62
  | enqueueUpdate | @ | ReactUpdates.js:200
  | enqueueUpdate | @ | ReactUpdateQueue.js:24
  | enqueueSetState | @ | ReactUpdateQueue.js:218
  | ReactComponent.setState | @ | ReactBaseClasses.js:64
  | onStateChange | @ | connectAdvanced.js:205
  | dispatch | @ | createStore.js:173
  | dispatch | @ | VM33975:2
  | (anonymous) | @ | index.js:14
  | dispatch | @ | applyMiddleware.js:35
  | saveData.then.data | @ | index.js:129
  | Promise resolved (async) |   |  
  | (anonymous) | @ | index.js:102
  | (anonymous) | @ | index.js:11
  | dispatch | @ | VM33975:2
  | initStore.then.initialState | @ | getStore.js:109
  | Promise resolved (async) |   |  
  | getStore | @ | getStore.js:99
  | __webpack_exports__.a | @ | index.jsx:13
  | map../af | @ | main.js:39
  | __webpack_require__ | @ | bootstrap 4fef064…:19
  | Object.defineProperty.value | @ | bundle.js?1504015496728=123:55068
  | __webpack_require__ | @ | bootstrap 4fef064…:19
  | (anonymous) | @ | bootstrap 4fef064…:62
  | (anonymous) | @ | bootstrap 4fef064…:62

[rofrol]

Works, I just needed to add:

agreementPenaltyEnable: yup.boolean(),

Like this:

export const uodValidation = yup.object().shape({
  agreementPenaltyEnable: yup.boolean(),
  agreementPenalty,
});

[wieseljonas]

Having then same issue

landSurface: Yup.number().when('mainType', {
          is: 'house',
          then: Yup.number()
            .typeError(t('Please specify the land surface'))
            .required(t('Please specify the land surface'))
            .min(0, t('Asset must be over 0 m2'))
            .max(2000, t(`Asset must be under 20'000 m2`)),
          otherwise: Yup.number(),
        }),

[jquense]

@wieseljonas you have to post the entire schema, the above is missing info about waht mainType is. PLease put together a repro using https://npm.runkit.com/yup

[liltechnomancer]

If anyones reading this. If you use when in a schema the field it depends on should also be in the schema. So @wieseljonas would need to declare a type and rules for mainType in the same schema as landSurface.