Search code examples
react-nativeios-simulator

React Native code doesn't work without Remote Debugger enabled


This a weird question, but since I'm really curious about this I wanted to ask. I have a piece of code that works in the iOS Simulator when I enable Remote Debugging but it stops working without it. This is the code:

      let filtered = []
      let dueDate
      const dateNow = new Date(Date.now())

      for (let item of this.props.listData) {
        dueDate = new Date(item.dueDate)
        if (!item.paid && (dueDate < dateNow)) {
          filtered.push(item)
        }
      }
      if (filtered.length > 0) {          
        this.setState({
          dataSource: this.state.dataSource.cloneWithRows(filtered)
        })
      }

(item.dueDate is a string like "12.02.2016")

Obviously the code would work (and it works) if I supplied the date in a correct format (like ISO "2016-02-12"). What interests me is why does it work even with the wrong format when I enable Remote Debugging (which fires up a Google Chrome instance)? Because when I console.log the dates in Chrome they are converted normally. Thanks in advance!


Solution

  • This is most likely due to subtle differences between the JavaScript execution environments on the device, and in your remote debugger.

    In this case, the Date constructor seems to accept the locale-specific date formats in the Chrome remote debugging environment, but not on the device. This probably due to your computer's locale having been set to a culture that uses the dd.MM.yyyy format, and the emulator to something else, such as en-US. The ISO format works on both, because it's supported regardless of the locale.

    When you run the code on the device or simulator, the code executes in a JavaScriptCore on the device itself. This is the JavaScript engine React Native uses internally to run the application scripts

    When you turn remote debugging on, the React Native packager will instead execute the code in your computer's Chrome's JavaScript engine, V8, and send messages between the browser and the device/simulator over WebSockets.

    You've run into one of the many edge cases that make remote debugging in React Native unreliable. You should always test all features on a real device without the debugger.