React-native: [0.54] BlobModule.addNetworkingHandler mock missing in jest setup

Created on 8 Mar 2018  路  14Comments  路  Source: facebook/react-native

Upgrading react native to 0.54.0 causes the jest tests to fail with an error
TypeError: BlobModule.addNetworkingHandler is not a function

Environment:

OS: macOS Sierra 10.12.6
Node: 8.9.1
Yarn: 1.3.2
npm: 5.6.0
Watchman: 4.7.0
Xcode: Xcode 9.0 Build version 9A235
Android Studio: Not Found

Packages: (wanted => installed)
react: ^16.3.0-alpha.1 => 16.3.0-alpha.1
react-native: 0.54.0 => 0.54.0

Expected Behavior

The tests should not break on upgrade

Actual Behavior

The test suite fails to run with an error

screen shot 2018-03-08 at 12 12 31 pm

Steps to Reproduce

  • Upgrade react-native to 0.54.0
  • Run jest tests
Regression Locked

Most helpful comment

@FireNoid I think the change should be made in the jest setup file instead of the file node_modules/react-native/Libraries/Blob/BlobManager.js itself.

The setup file is where we should mock the required modules.
So, in node_modules/react-native/jest/setup.js

Change

BlobModule: {
    BLOB_URI_SCHEME: 'content',
    BLOB_URI_HOST: null,
    enableBlobSupport: jest.fn(),
    disableBlobSupport: jest.fn(),
    createFromParts: jest.fn(),
    sendBlob: jest.fn(),
    release: jest.fn(),
  },

to

BlobModule: {
    BLOB_URI_SCHEME: 'content',
    BLOB_URI_HOST: null,
    addNetworkingHandler: jest.fn(),
    enableBlobSupport: jest.fn(),
    disableBlobSupport: jest.fn(),
    createFromParts: jest.fn(),
    sendBlob: jest.fn(),
    release: jest.fn(),
  }

All 14 comments

This issue can be fixed by adding the addNetworkingHandler mock (in BlobModule) inside the jest setup file.

addNetworkingHandler: jest.fn()

Hmm, the tests for 0.54-stable are green. Can you include more information about the failing test? Which suite was it that failed? Thanks!

@FireNoid I think the change should be made in the jest setup file instead of the file node_modules/react-native/Libraries/Blob/BlobManager.js itself.

The setup file is where we should mock the required modules.
So, in node_modules/react-native/jest/setup.js

Change

BlobModule: {
    BLOB_URI_SCHEME: 'content',
    BLOB_URI_HOST: null,
    enableBlobSupport: jest.fn(),
    disableBlobSupport: jest.fn(),
    createFromParts: jest.fn(),
    sendBlob: jest.fn(),
    release: jest.fn(),
  },

to

BlobModule: {
    BLOB_URI_SCHEME: 'content',
    BLOB_URI_HOST: null,
    addNetworkingHandler: jest.fn(),
    enableBlobSupport: jest.fn(),
    disableBlobSupport: jest.fn(),
    createFromParts: jest.fn(),
    sendBlob: jest.fn(),
    release: jest.fn(),
  }

You are right. It didn't work well!
I changed it the same way you suggested. Fixed!
Thank you!

@hramos BlobModule .addNetworkingHandler is being used in Libraries/Network/XMLHttpRequest.js but probably does not have a test coverage around it.
Our test suites are designed differently than the ones being used by react-native, so not sure which test suite it is.

Here is the what the failure says

screen shot 2018-03-09 at 9 50 40 am

Let me know if this helps.

@n-kumari ah, good catch. We should update our test suite as well. Thanks for bringing this to our attention!

For those wanting a copy paste bit of code, add this to the jest setup file:

import { NativeModules } from "react-native";

NativeModules.BlobModule = {
  ...NativeModules.BlobModule,
  addNetworkingHandler: jest.fn()
};

@matt-oakes In what file should I paste it? I am getting this error and can't test my project

@matt-oakes this is the path: node_modules/react-native/jest/setup.js

@Alu1911 @gabrielvcbessa That would work, but I wouldn't recommend putting it there as you shouldn't edit files inside node_modules if you want reproducible builds. Instead, create your own jest setup file.

Will a fix for this land in RN soon?

It landed in commit 43014eaf1992c0b6d8610ba52e1bfea31d00ffe6 already. That commit has not yet made it to a release, but it should as soon as the next RC is cut.

@matt-oakes I'm trying to set this up in the jest config file as you suggested but I'm having trouble with it. Could you share an example of how you've set it up there? Thanks!!

screen shot 2018-12-11 at 11 57 28 pm

@n-kumari I am getting this even after trying your method. But package manager show :
BUNDLE [ios, dev] ./index.ios.js 鈻撯枔鈻撯枔鈻撯枔鈻撯枔鈻撯枔鈻撯枔鈻撯枔鈻撯枔 100.0% (1/1), done.

This is part of package.json
"devDependencies": {
"babel-eslint": "^7.2.3",
"babel-jest": "18.0.0",
"babel-preset-react-native": "1.9.1",
"eslint": "^3.19.0",
"eslint-plugin-flowtype": "^2.32.1",
"eslint-plugin-react": "^6.10.3",
"jest": "^23.6.0",
"react-test-renderer": "15.4.2"
},
"jest": {
"preset": "react-native"
}

Thanks in advance.

Was this page helpful?
0 / 5 - 0 ratings