Unable to run Jest and V2 with reactNative version 0.73.6

[dmregister]

When running our jest test after upgrading our React Native version to .73, all the tests are failing with:

ReferenceError: self is not defined

    > 1 | import { Realtime } from 'ably';

On react-native version .70, it seems like it was importing the nodejs version rather than the react-native build. This is probably due to RN now supporting exports from the package.json. The quick fix is to force jest to import the nodejs version e.g.

moduleNameMapper: {
    ably: require.resolve('ably'),
  },

but this is not ideal. Our jest config is using the react-native preset.

Using the example file and applying the attached patch will result in the same error: https://github.com/ably-labs/ably-js-react-native-example jest_error_ably.patch

┆Issue is synchronized with this Jira Task by Unito

[ttypic]

Thank you very much for such a detailed report; we are looking into this.

[VeskeR]

Hello @dmregister . Thank you for reporting this!

We identified the issue with our React Native bundle, which used the self property for the global object in the UMD wrapper. This property is not available in the Node environment, in which Jest is configured to run by default with the 'react-native' preset. This has been fixed in https://github.com/ably/ably-js/pull/1738 and will be included in the next ably-js patch version release.

That being said, upon further testing, I encountered other obstacles when running jest tests for a React Native app using the non-mocked ably-js. Our React Native bundle relies on various browser APIs to function (WebSocket and XMLHttpRequest, for example). However, the Node environment in which Jest runs its tests does not load any DOM or browser APIs by design, leading to errors like ReferenceError: WebSocket is not defined when attempting to run tests.

Mocking these browser APIs can become complex quickly. Therefore, I would suggest either mocking the ably client or using your workaround to force Jest to import the node.js ably-js bundle:

moduleNameMapper: {
    ably: require.resolve('ably'),
},

You can also force Jest to resolve the exports field using the node condition for all imported bundles (although this seems like the least ideal solution) in jest.config.js:

testEnvironmentOptions: {
    customExportConditions: ['node'],
},

[VeskeR]

ReferenceError: self is not defined error when running Jest tests in React Native was fixed in v2.0.3 ably-js release.

Since ably-js requires certain browser APIs to function correctly, and the Jest testing environment for React Native does not provide them, some additional workarounds are required to make it work. See the comment above for more details.

Closing this as completed.