Parsing of swedish mobile phone numbers together with yup fail.

[timrombergjakobsson]

Hi, I Im using the lib in a React app that Im building, and Im trying to use it together with yup. Im using it like this:

import * as Yup from 'yup';
import { parsePhoneNumber } from 'libphonenumber-js'

Yup.addMethod(Yup.string, 'phoneNumber', function () {
    return this.test({
      name: 'phoneNumber',
      exclusive: true,
      message: Not a valid number',
      test: (value) => {
        try {
          const phoneUtils = parsePhoneNumber(value, 'SE')
          const phoneNumber = phoneUtils
          return phoneUtils.isValidNumber(phoneNumber)
        } catch (e) {
          return false
        }
      }
    })
})

export default function ValidationSchema(values) {
    return Yup.object().shape({
        radioGroup: Yup.string().required("Du måste välja ett av valen."),
        phoneNumber: Yup.string().required('Du måste ange ett telefonnummer').phoneNumber()
    })
}

I verified it here https://libphonenumber.appspot.com/phonenumberparser?number=+467567891&country=SE And here https://libphonenumber.appspot.com/phonenumberparser?number=0734448472&country=SE and it works. Although when entering the phone number in my app I get the message saying that it is not a valid number, regardles the preceeding +46 or just 07? What am I missing?

[catamphetamine]

What's the exact issue you're having? Without any of the yup stuff.

[timrombergjakobsson]

That regardless in what format I write the phone number into the input that uses the validation I get the message: 'Not a valid number'.

[catamphetamine]

Provide an exact code sample

[timrombergjakobsson]

@catamphetamine ok, I posted above how Im defining the validation schema, and then I have a validation method that uses the ValidationSchema like this:

validate = values => {
      let validationErrors = {};
      try {
          validateYupSchema ( 
              values,
              ValidationSchema(), <--- here I use the imported function
              true, // synchronous validation
          );
      } catch (err) {
          validationErrors = yupToFormErrors(err);
          return validationErrors;
      }
        const activePage = React.Children.toArray(this.props.children)[
          this.state.page
        ];
        return activePage.props.validate ? activePage.props.validate(values) : {};
    };

[catamphetamine]

Don't post any "yup" references. Post a minimal and simple code sample which only uses libhphonenumber-js.

[timrombergjakobsson]

Ok then:

import { parsePhoneNumber } from 'libphonenumber-js'

try {
    const phoneUtils = parsePhoneNumber(value, 'SE')
    const phoneNumber = phoneUtils
    return phoneUtils.isValidNumber(phoneNumber)
    } catch (e) {
       return false
    }

[catamphetamine]

Simplify further, until it's the simplest code.

import { parsePhoneNumber } from 'libphonenumber-js'

try {
    return parsePhoneNumber(value, 'SE')
} catch (e) {
   return false
}

[catamphetamine]

What's your issue with the code posted above?

[timrombergjakobsson]

Hmm this wont work return phoneUtils.isValidNumber(parsePhoneNumber(value, 'SE')) as I need to define phoneUtils. But besides that it's as I mentioned. When using this to validate a swedish mobile phone number it fails. I tried to enter a number in both the formats +477xxxxx and 07xxxx but it still does not pass validation.

[catamphetamine]

If you don't post an exact minimal code sample illustrating the issue in your next comment I will close this issue.

[timrombergjakobsson]

Ok, it might be late but I dont understand what you mean. I have posted code examples in several comments. you mean a codesandbox or plunker or what do you mean?

[catamphetamine]

Ok, it might be late but I dont understand what you mean. I have posted code examples in several comments. you mean a codesandbox or plunker or what do you mean?

No, you should post a simple minimal example illustrating the issue you're having with no non-defined variables and not spread across several comments.

[timrombergjakobsson]

Ok, I tried your example, return parsePhoneNumber(value, 'SE') and now it works. Thank you.

[catamphetamine]

For validation use:

parsePhoneNumber(value, 'SE').isValid()