Challenge - 5 Problems
Jest Mastery Badge
Get all challenges correct to earn this badge!
Test your skills under time pressure!
📝 Syntax
intermediate2:00remaining
Jest configuration file syntax
Which of the following is the correct way to export a Jest configuration in a
jest.config.js file for a React Native project?Attempts:
2 left
💡 Hint
Remember that Jest config files use CommonJS syntax by default.
✗ Incorrect
Jest configuration files typically use CommonJS syntax with module.exports. Option B correctly exports the config object. Option B uses ES module syntax which Jest does not support by default. Option B assigns to 'exports' instead of 'module.exports', which won't work properly. Option B has a typo 'module.export' instead of 'module.exports'.
❓ ui_behavior
intermediate2:00remaining
Jest test output for a failing test
Given this simple React Native component test, what will Jest output if the test fails because the text is not found?
import React from 'react';
import { render } from '@testing-library/react-native';
import Greeting from './Greeting';
test('renders greeting text', () => {
const { getByText } = render(<Greeting name="Alice" />);
getByText('Hello Bob');
});Attempts:
2 left
💡 Hint
Think about what happens when getByText does not find the text.
✗ Incorrect
The getByText query throws an error if the text is not found, causing the test to fail with a message indicating the missing text. It does not return null or pass silently. There is no syntax error in the code.
❓ lifecycle
advanced2:00remaining
Jest setup and teardown methods
Which Jest lifecycle method is best to use for cleaning up mocks after each test in a React Native test suite?
Attempts:
2 left
💡 Hint
Think about when you want to reset mocks to avoid test interference.
✗ Incorrect
Using afterEach ensures mocks are cleared after every test, preventing one test's mocks from affecting another. beforeAll and afterAll run only once for the whole suite, which is not enough. beforeEach runs before each test but clearing mocks after tests is safer.
advanced
2:00remaining
Mocking React Navigation in Jest tests
In a React Native app using React Navigation, which Jest mock setup correctly mocks the
useNavigation hook to avoid errors in unit tests?Attempts:
2 left
💡 Hint
Check the correct package name and the shape of the mocked hook.
✗ Incorrect
Option A correctly mocks the '@react-navigation/native' package and returns an object with a navigate function as jest.fn(), matching the hook's expected return. Option A uses wrong package name. Option A mocks useNavigation as a jest.fn() itself, not a function returning an object. Option A returns a string instead of an object.
🔧 Debug
expert2:00remaining
Diagnosing Jest test timeout in React Native
A Jest test for a React Native component using async storage hangs and eventually times out. Which of the following is the most likely cause?
Attempts:
2 left
💡 Hint
Think about what happens when async functions never resolve in tests.
✗ Incorrect
If async storage is not mocked properly, calls to it return unresolved promises, causing tests to hang and timeout. Syntax errors cause immediate failures, not hangs. Missing preset causes config errors, not hangs. Incorrect file names cause tests to be skipped, not hang.