react-native formatting is different - debug mode on/off

[jonasgroendahl]

There seems to be different formats for when debugging is on (development) and off (production) in react-native using the latest version of date-fns, any way to make them the same? i sense some inconsistencies will arise when shipping the app from development to production.

I'm getting the error: Invalid time value.

As shown in the video below I'm trying out this format: '2020-12-29 01:15:00' and calling isValid on it in both debug/no debug mode.

Screen.Recording.2021-01-03.at.10.25.55.PM.mov

[jasondibenedetto]

Was there any update on this one?

[fturmel]

I think this has noting to do with date-fns. I could reproduce the behavior within the interactive code example in React Native's "get started" page just using a native Date object. Works on web, breaks on iOS.

Screen.Recording.2021-06-22.at.12.55.20.PM.mov

The problem is that you are using a string in the Date constructor, which can behave differently depending on the runtime.

Per MDN:

Note: Parsing of date strings with the Date constructor (and Date.parse(), which works the same way) is strongly discouraged due to browser differences and inconsistencies.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/Date

Couple solutions:

• use a numerical timestamp in the Date constructor
• use one of the parse functions in date-fns to safely parse your string. parseISO should work well here. https://date-fns.org/docs/parseISO

Good luck!

[fturmel]

Some additional details on the React Native runtimes here: https://reactnative.dev/docs/javascript-environment#javascript-runtime

Essentially, it's JavaScriptCore (Safari's JS engine) that runs prod and V8 (Chrome) while debugging. I get the exact same error in Safari.

[fturmel]

Going to move this to a discussion so it's easier for people to find.