Closed mattekelly closed 8 months ago
HuiSF
commented
8 months ago I think the jest module loader cannot resolve the @react-native-async-storage/async-storage package in its module system.
Looking at the stack trace, if your test does not depend on the @aws-amplify/react-native, you can probably add the following to prevent this from happening.
jest.mock('`@aws-amplify/react-native')
mattekelly
commented
8 months ago @HuiSF thanks for the suggestion. I just tried that, as the majority of the tests do not depend upon amplify. That caused a different error:
TypeError: Cannot destructure property 'encode' of '(0 , react_native_1.loadBase64)(...)' as it is undefined.This particular requires to mock the loadBase64 function exported from the @aws-amplify/react-native package š¤
I noticed your test suites load .native implementation, have you configured the jest to mimic a react-native environment?
mattekelly
commented
8 months ago @HuiSF mocking loadBase64 kicks off a seemingly endless list of other things that need to be mocked.
We are using the 'react-native' preset for jest so yes, it is set to mimic a react-native environment.
mattekelly
commented
8 months ago I ended up mocking all of the following:
jest.mock('@aws-amplify/react-native', () => ({
loadBase64: jest.fn().mockImplementation(() => ({
encode: jest.fn(),
})),
loadGetRandomValues: jest.fn(),
loadUrlPolyfill: jest.fn(),
loadAsyncStorage: jest.fn(),
loadAppState: jest.fn(),
}));Now I am stuck here:
ā Test suite failed to run
TypeError: Cannot read properties of undefined (reading 'addEventListener')
> 1 | import { signInWithRedirect, signOut, fetchAuthSession, getCurrentUser } from 'aws-amplify/auth';
| ^
2 | import { Hub } from 'aws-amplify/utils';
3 | import { Amplify } from 'aws-amplify';
4 | import { AuthenticationServiceInterface } from './AuthenticationServiceInterface';
at new SessionListener (node_modules/@aws-amplify/core/src/utils/sessionListener/SessionListener.native.ts:16:38)
at Object.<anonymous> (node_modules/@aws-amplify/core/dist/cjs/utils/sessionListener/index.js:23:27)
at Object.<anonymous> (node_modules/@aws-amplify/core/src/providers/pinpoint/apis/record.ts:10:26)
at Object.<anonymous> (node_modules/@aws-amplify/core/dist/cjs/providers/pinpoint/apis/index.js:16:16)
at Object.<anonymous> (node_modules/@aws-amplify/core/src/providers/pinpoint/index.ts:9:22)
at Object.<anonymous> (node_modules/@aws-amplify/core/src/ServiceWorker/ServiceWorker.ts:12:1)
at Object.<anonymous> (node_modules/@aws-amplify/core/dist/cjs/ServiceWorker/index.js:9:23)
at Object.<anonymous> (node_modules/@aws-amplify/core/dist/cjs/index.js:117:23)
at Object.<anonymous> (node_modules/@aws-amplify/auth/src/providers/cognito/apis/signUp.ts:8:7)
at Object.<anonymous> (node_modules/@aws-amplify/auth/src/providers/cognito/index.ts:8:5)
at Object.<anonymous> (node_modules/@aws-amplify/auth/src/index.ts:9:8)
at Object.<anonymous> (node_modules/aws-amplify/dist/cjs/auth/index.js:12:22)
at Object.require (src/services/authentication/AuthenticationService.ts:1:1)For this particular error, would need this
jest.mock('@aws-amplify/react-native', () => ({
loadBase64: jest.fn().mockImplementation(() => ({
encode: jest.fn(),
})),
loadGetRandomValues: jest.fn(),
loadUrlPolyfill: jest.fn(),
loadAsyncStorage: jest.fn(),
loadAppState: jest.fn(() => ({
addEventListener: jest.fn(),
})),
}));This is a bit tricky like you said, as jest is going to evaluate everything on the module loading paths.
Do your unit tests actually depend on the actual functionalities of Amplify libraries?
I would mock the Amplify APIs in this case if I only needed to test the business logic in my own code, e.g verify the params gets passed to Amplify API. In this case, aws-amplify/auth, aws-amplify/utils and aws-amplify would get a mock.
mattekelly
commented
8 months ago Thank you - I could not figure out how/where to mock addEventListener. I copied in your mock, line for line, and all of our tests began passing. I will keep in mind the potential need to mock Amplify APIs, should we encounter similar errors in the future.
cwomack
commented
8 months ago Awesome help and diagnosis with this @HuiSF! @mattekelly, any further tests failures or help needed on this?
mattekelly
commented
8 months ago @cwomack no, thank you. I do still have an open question on my other issue 12816.
cwomack
commented
8 months ago Sounds good, we'll get to that one then and close this out. Thanks, @mattekelly!
OOCAZ
commented
7 months ago Hey all, I am a little late to the party but I am experiencing the same issue mentioned above, and then I try to use the fixes listed from HuiSF and I get a weird error that is not leaving me alone...
C:\myUser\myproject\node_modules\uuid\dist\esm-browser\index.js:1
({"Object.
SyntaxError: Unexpected token 'export'.Appears to be springing from the Amplify generateClient import on the file I am testing, I am not using Amplify in any way in my test file. The only difference I may have is I am using Expo and not Vanilla React-Native. But I have tried using the preset of react-native and jest-expo, and both of them are giving me this same error. If I remove the mock suggested by HuiSF I am left with the original error above. Please advise, and thank you for your time.
victoralmeidadev
commented
5 months ago Hey guys.
I did all the above steps and also added the directory settings in my jest.config.js file.
...
transformIgnorePatterns: [
'...|aws-amplify/.*|aws-amplify|@aws-amplify/react-native|...'
],
...
moduleNameMapper: {
'aws-amplify': '<rootDir>/node_modules/aws-amplify',
'aws-amplify/auth': '<rootDir>/node_modules/aws-amplify/auth',
'@aws-amplify/react-native':
'<rootDir>/node_modules/@aws-amplify/react-native',
...
},
...This worked in my project that uses Expo SDK 50 + Expo Dev Client.
Hope it works. If you notice any problems with this configuration, let me know so I can fix it in my project.
Before opening, please confirm:
JavaScript Framework
React Native
Amplify APIs
Authentication
Amplify Version
v6
Amplify Categories
auth
Backend
Other
Environment information
Describe the bug
After upgrading to Amplify V6, a vast number of our jest tests are failing due to the following error. We are already using "@react-native-async-storage/async-storage": "^1.21.0". This appears to be originating from the loadAsyncStorage.ts file.
Expected behavior
Jest tests successful run as they did prior to upgrading to V6.
Reproduction steps
Code Snippet
Log output
aws-exports.js
No response
Manual configuration
No response
Additional configuration
No response
Mobile Device
No response
Mobile Operating System
No response
Mobile Browser
No response
Mobile Browser Version
No response
Additional information and screenshots
No response