Mocking native modules in React Native - Practice Problems & Coding Challenges

Challenge - 5 Problems

🧠 Conceptual

intermediate

What happens when you mock a native module in React Native?

In React Native testing, what is the main effect of mocking a native module?

A The native module's real implementation is replaced with a fake one during tests.

B The native module is removed from the app permanently.

C The native module runs twice, once real and once mocked.

D The app crashes because native modules cannot be mocked.

💡 Hint

Think about how tests isolate parts of the app.

Mocking replaces the real native module with a fake version so tests can run without depending on native code.

❓ ui_behavior

intermediate

Mocking a native module affects UI behavior how?

If you mock a native module that provides device location, what happens to UI components relying on that location during tests?

A They display the real device location regardless of mocking.

B They show an error because location is unavailable.

C They receive the mocked location data instead of real device location.

D They freeze and do not update.

💡 Hint

Mocking controls the data returned by the module.

When mocked, UI components get the fake data provided by the mock, not the real device data.

❓ lifecycle

advanced

When is a native module mock applied in React Native tests?

At what point during the test lifecycle is a native module mock typically applied?

A Before the app or component is rendered in the test.

B Only when the app is built for production.

C After the test finishes running.

D During the app's runtime on a real device.

💡 Hint

Mocks must be ready before code uses the module.

Mocks are set up before rendering so the tested code uses the fake module instead of the real one.

🔧 Debug

advanced

Why does a test fail when mocking a native module incorrectly?

You mocked a native module but your test fails with 'undefined is not a function' error. What is the likely cause?

A The app code has a syntax error unrelated to mocking.

B The native module cannot be mocked at all.

C The test environment is missing a device connection.

D The mock does not provide the expected function or method the code calls.

💡 Hint

Check what your mock returns or defines.

If the mock lacks a function the code expects, calling it causes an error.

❓ navigation

expert

How does mocking native modules affect navigation in React Native tests?

You mock a native module that controls hardware back button behavior. How does this affect navigation testing?

A Navigation stops working because the real back button handler is missing.

B The back button behavior is controlled by the mock, allowing predictable navigation tests.

C The app crashes on back button press during tests.

D The back button triggers both real and mocked handlers simultaneously.

💡 Hint

Mocks let you simulate hardware behavior in tests.

Mocking the back button module lets tests simulate back presses and check navigation without real hardware.