3

I'm creating a Android React Native application and trying to use the speedtest.net api to get the upload and download speed for a mobile device. However, when I try to integrate the library in React Native, I'm getting the following error when I try to do const test = speedTest({maxTime: 5000, serverId : "7334"});

Possible Unhandled Promise Rejection (id: 0): TypeError: Network request failed TypeError: Network request failed at XMLHttpRequest.xhr.onerror at XMLHttpRequest.dispatchEvent at XMLHttpRequest.setReadyState at XMLHttpRequest.__didCompleteResponse at blob:http://localhost:8081/b1cfcde4-0ef7-4805-bd16-22849a1db8e3:17594:47 at RCTDeviceEventEmitter.emit at MessageQueue.__callFunction at blob:http://localhost:8081/b1cfcde4-0ef7-4805-bd16-22849a1db8e3:2156:17 at MessageQueue.__guardSafe at MessageQueue.callFunctionReturnFlushedQueue

Possible Unhandled Promise Rejection (id: 1): TypeError: One of the sources for assign has an enumerable key on the prototype chain. Are you trying to assign a prototype property? We don't allow it, as this is an edge case that we do not support. This error is a performance optimization and not spec compliant. TypeError: One of the sources for assign has an enumerable key on the prototype chain. Are you trying to assign a prototype property? We don't allow it, as this is an edge case that we do not support. This error is a performance optimization and not spec compliant. at Object.assign at Object.request at Object.https.get at getHttp at getXML at nextServer at gotServers at blob:http://localhost:8081/b1cfcde4-0ef7-4805-bd16-22849a1db8e3:87345:24 at module.exports. at module.exports.

Actually before this, I had trouble trying to even add the speedtest npm module to React Native and got a 500 error:

Error: Unable to resolve module url from C:\Users\user\Documents\mobileapp\node_modules\speedtest-net\index.js: Module url does not exist in the Haste module map

The line of code I was putting into my React Native app: var speedTest = require('speedtest-net');

I managed to find this article to fix the issue, but this is where I get the first error now... How can I properly use a npm module in my React Native application without getting all of these errors? Is there possibly a better way to integrate the speedtest.net npm module into my React Native app? Here is my code:

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';

const instructions = Platform.select({
  ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
  android:
    'Double tap R on your keyboard to reload,\n' +
    'Shake or press menu button for dev menu',
});

//using the node module
const speedTest = require('speedtest-net');

//using the instructions from the article
const speedTest = require('./speedtest');
const test = speedTest({maxTime: 5000});

type Props = {};
export default class App extends Component<Props> {
  constructor()  {
    super();
  }

  componentWillMount() {
    test.on('downloadspeed', speed => {
       console.log('Download speed:', speed.toFixed(2));
   });

    test.on('uploadspeed', speed => {
       console.log('Upload speed:',(speed * 125).toFixed(2),'KB/s');
    })
  }

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>Welcome to React Native!</Text>
        <Text style={styles.instructions}>To get started, edit App.js</Text>
        <Text style={styles.instructions}>{instructions}</Text>
      </View>
    );
  }
}

Also I tried to test out the API separately and it worked perfectly fine. It's just that when I try to implement the API with React Native, I'm getting all of these issues. Here is how my code for the other js file looks like:

var speedTest = require('speedtest-net');
var test = speedTest({maxTime: 5000, serverId : "7334"});
var http = require('http');

// test.on('data', data => {
//   console.log(data);
// });

// test.on('error', err => {
//   console.error(err);
// });

test.on('downloadspeed', speed => {
  console.log('Download speed:', speed.toFixed(2));
});

test.on('uploadspeed', speed => {
  console.log('Upload speed:',(speed * 125).toFixed(2),'KB/s');
})

http.createServer(function (req, res) {
    res.writeHead(200, {'Content-Type': 'text/html'});
    res.end('Hello World!');
}).listen(8080);
Highlight
  • 51
  • 1
  • 2
  • 8
  • So the error you are getting isn't about the library, the API call failed and returned an error which is what you are seeing. I have never used this api but are you sure server id is a string and not a number? Also try if it works without serverid – Nemi Shah Aug 17 '18 at 03:56
  • I tried it without the serverId and it still didn't work. I still get the possible unhandled promise rejection error. I actually tried to this in a seperate js file, not using React Native, and it worked perfectly fine – Highlight Aug 17 '18 at 15:52
  • Can you post the code to the file? That will help understand the problem – Nemi Shah Aug 17 '18 at 16:08
  • I edited my question and posted my code! – Highlight Aug 17 '18 at 20:30
  • Actually just updated my post with both of my code from the separate javascript file and my code for my React Native app – Highlight Aug 17 '18 at 21:04
  • So I just did a little reading on this, turns out core Node.JS modules on react native is a bad idea in general. Even if you do make it work it can cause multiple problems because of the differences in how React Native has been made to work. I know this isnt the solution but just telling you what I found out. Here is one of the things I was reading https://www.reddit.com/r/reactnative/comments/5os4w8/nodejs_module_in_reactnative/ – Nemi Shah Aug 18 '18 at 04:48
  • Hmm, that's interesting because I spoke to someone and they said that they use node modules all the time.. I'm not sure why I'm getting a TypeError with this particular node module – Highlight Aug 20 '18 at 17:41
  • I'll try to do a workaround to use the node module in my React Native project! However, when I tried to do one work around, I ended up getting a Network request failed TypeError. Do you happen to know why I would get this error? – Highlight Aug 20 '18 at 18:12

0 Answers0