highcharts / highcharts-react-native

Other
103 stars 81 forks source link

error thrown within Jest unit test #100

Open epfromer opened 4 years ago

epfromer commented 4 years ago

I have a Jest unit test throwing an error when testing the creation of a bar chart. The call stack is as follows:

  console.error
    Failed to fetch scripts or layout. Cannot read property 'includes' of undefined
      at CustomConsole.Object.<anonymous>.console.error (../../node_modules/react-native/Libraries/LogBox/LogBox.js:33:14)
      at registerError (../../node_modules/react-native/Libraries/YellowBox/YellowBox.js:169:7)
      at errorImpl (../../node_modules/react-native/Libraries/YellowBox/YellowBox.js:84:22)
      at CustomConsole.error (../../node_modules/react-native/Libraries/YellowBox/YellowBox.js:63:14)
      at _callee$ (../../node_modules/@highcharts/highcharts-react-native/src/HighchartsReactNative.js:47:21)
      at tryCatch (../../node_modules/regenerator-runtime/runtime.js:63:40)
      at Generator.invoke [as _invoke] (../../node_modules/regenerator-runtime/runtime.js:293:22)

I have traced it in the HighchartsReactNative.js file to setHcAssets(), calling this.setLayout(), calling this.getAssetAsString() and the following code:

        const downloadedModules = await FileSystem.readDirectoryAsync(FileSystem.cacheDirectory)
        let fileName = 'ExponentAsset-' + asset.hash + '.' + asset.type
        if (!downloadedModules.includes(fileName)) {
            await asset.downloadAsync()
        }

Seems like FileSystem react-native-unimodules is mocked, and has no cacheDirectory?

I tried the following

if (downloadedModules && !downloadedModules.includes(fileName)) {

But am now getting:

console.error
    Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.   
        in HighchartsReactNative (created by BarHighcharts)

For the unit test, I'm using @testing-library/react-native.

Anyway, I thought you should know. If this is an error on my part, please advise.

Denyllon commented 4 years ago

Hi @epfromer ,

Thank you for your report. This package has no test implementation yet, and we've never run it combined with Jest before. Basically, it could be quite hard to find out what can be the general reason of these kind of problems.

Seems like FileSystem react-native-unimodules is mocked, and has no cacheDirectory?

The biggest problem is that I'm not able to find any information about using the mentioned package with Jest, and we do not know how it should be configured to access cacheDirectory. I think would be better to ask about that on their repository.

One thing which comes to my mind for now it to set useCDN flag to true and let the wrapper fetch all required Highcharts scripts from the outside. Have you tried it?

Kind regards!