SyntaxError: Unexpected token export using jest

[loic-lopez]

Current behavior

/@react-native-community/async-storage/lib/index.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){export default from './AsyncStorage';

 SyntaxError: Unexpected token export

    > 1 | import AsyncStorage  from "@react-native-community/async-storage"
        | ^
      2 | 
      3 | /**
      4 |  * Loads a string from storage.

Repro steps

import @react-native-community/async-storage and test with jest.

Environment

• Async Storage version: 1.2.1
• React-Native version: 0.57.7
• Platform tested: iOS / Android
• Jest version: 24.0.11
• Logs/Error that are relevant: see above

[krizzu]

Hey @loic-lopez

Async Storage is not being transformed by Jest, so in your jest.config.js or jest entry in package.json, add:

"transformIgnorePatterns": ["/node_modules/@react-native-community/async-storage/(?!(lib))"]

[vgm8]

The error still happening after adding your solution.

[loic-lopez]

@krizzu thanks for reply and yes transformIgnorePatterns seems to have solved the problem but,
when i try to mock the library like that:

I got:

● save

    expect(jest.fn()).toHaveBeenCalledWith(expected)

    Expected mock function to have been called with:
      ["something", "{\"x\":1}"]
    But it was not called.

      34 | test("save", async () => {
      35 |   await save("something", VALUE_OBJECT)
    > 36 |   expect(mockSetItem).toHaveBeenCalledWith("something", VALUE_STRING)
         |                       ^
      37 | })
      38 | 
      39 | test("saveString", async () => {

      at Object.<anonymous>.test (test/tests/storage.test.ts:36:23)

as if the mock did not work

[krizzu]

@loic-lopez This is more like Jest question :) You can checkout Jest docs about mocking node_modules libs.

Basically, create __mocks__ in project root (unless your roots Jest settings says differently), create @react-native-community/async-storage/index.js in there and export mocked functions.

@vgm8 Anything particular that could help me figuring this out?

[loic-lopez]

@krizzu the mock is on top of my @react-native-community/async-storage test see bellow:

[vgm8]

@krizzu your solution was not working because i had some errors in the jest configuration. After I fixed it works fine, thank you!

[krizzu]

@vgm8 Thanks great!

Would you mind sharing your solution, for future references?

[loic-lopez]

@krizzu As you can see above, the mock is being running before my tests.

[NemanjaManot]

I have same issue. @loic-lopez

[vgm8]

Sure @krizzu! As you said in your comment I've created __mocks__/@react-native-community/async-storage/index.js

let cache = {};
export default {
  setItem: (key, value) => {
    return new Promise((resolve, reject) => {
      return (typeof key !== 'string' || typeof value !== 'string')
        ? reject(new Error('key and value must be string'))
        : resolve(cache[key] = value);
    });
  },
  getItem: (key, value) => {
    return new Promise((resolve) => {
      return cache.hasOwnProperty(key)
        ? resolve(cache[key])
        : resolve(null);
    });
  },
  removeItem: (key) => {
    return new Promise((resolve, reject) => {
      return cache.hasOwnProperty(key)
        ? resolve(delete cache[key])
        : reject('No such key!');
    });
  },
  clear: (key) => {
    return new Promise((resolve, reject) => resolve(cache = {}));
  },

  getAllKeys: (key) => {
    return new Promise((resolve, reject) => resolve(Object.keys(cache)));
  },
}

An then in my tests I just import and mock @react-native-community/async-storage like this:

import AsyncStorage from '@react-native-community/async-storage';
jest.mock('@react-native-community/async-storage');

[loic-lopez]

@NemanjaManot Do you have resolved your issue?

[NemanjaManot]

@loic-lopez not yet.

[opiruyan]

getting
@RNCommunity/AsyncStorage: NativeModule.RCTAsyncStorage is null.
after adding transformIgnorePatterns

[krizzu]

@opiruyan Thanks!

This is from latest release (1.2.2), where we notice devs to link the library in order to use it.

I'll try to come up with custom mocks + docs to help people test this library on the weekend.

thanks.