GPXParser.js icon indicating copy to clipboard operation
GPXParser.js copied to clipboard

React Native compatibility?

Open benallfree opened this issue 4 years ago • 3 comments

window.DOMParser is preventing this from working in React Native. Any ideas?

https://github.com/Luuka/GPXParser.js/blob/d9c41f727d222f74aa9f768be5168a10c346afd9/src/GPXParser.js#L24

benallfree avatar Feb 24 '21 16:02 benallfree

Hello,

I don't know how React Native works but for Node.js environment I included a DOM polyfill (https://github.com/rstacruz/jsdom-global).

if(typeof module !== 'undefined'){
    require('jsdom-global')();
    module.exports = gpxParser;
}

It's already included in GPXParser but you may need to include it in a different way to make it works with React Native.

Fell free to give me the solution if you found it, I will add it to the Readme :)

Luuka avatar Feb 24 '21 16:02 Luuka

Thanks for the quick response :)

I figured out it's because React Native's bundler (Metro) uses the browser entry point in package.json (docs), which is a noop and doesn't import jsdom.

One solution might be to remove the browser entry and browswer.js and just use the main and index.js with some sniffer code:

if (typeof document != 'undefined') {
  // I'm on the web!
}
else if (typeof navigator != 'undefined' && navigator.product == 'ReactNative') {
  // I'm in react-native
}
else {
  // I'm in node js
}

https://stackoverflow.com/questions/39468022/how-do-i-know-if-my-code-is-running-as-react-native/39473604

benallfree avatar Feb 24 '21 17:02 benallfree

Hi,

Is there a solution to this at all? I'm having the same issue and I can't find an answer anywhere.

ally-garton avatar Apr 18 '21 12:04 ally-garton