Sharing and clipboard in React Native - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

What happens when this React Native clipboard code runs?

Consider this React Native code snippet that copies text to the clipboard and then reads it back to display in an alert. What will the alert show?

React Native

import Clipboard from '@react-native-clipboard/clipboard';
import {Alert} from 'react-native';

Clipboard.setString('Hello World');
Clipboard.getString().then(text => Alert.alert('Clipboard content', text));

A An alert with title 'Clipboard content' and message 'Hello World'

B An alert with title 'Clipboard content' and an empty message

C No alert appears because getString returns undefined

D A runtime error because Clipboard methods are not asynchronous

💡 Hint

Clipboard.setString stores text, getString returns a Promise with that text.

Clipboard.setString('Hello World') stores the string. Clipboard.getString() returns a Promise resolving to that string. The alert shows the stored text.

🧠 Conceptual

intermediate

Which React Native API is best for sharing text to other apps?

You want to let users share a text message from your app to other apps like email or messaging. Which React Native API should you use?

A Animated API to animate the text before sharing

B Linking API to open a URL with the text

C Clipboard API to copy text and ask user to paste

D Share API to open the native share dialog

💡 Hint

Sharing means sending data to other apps, not just copying.

The Share API opens the native share dialog letting users send text to other apps directly.

❓ lifecycle

advanced

What is the effect of calling Clipboard.getString() inside useEffect without dependencies?

In a React Native functional component, what happens if you call Clipboard.getString() inside useEffect with no dependency array?

React Native

import React, {useEffect} from 'react';
import Clipboard from '@react-native-clipboard/clipboard';

function MyComponent() {
  useEffect(() => {
    Clipboard.getString().then(text => console.log(text));
  });
  return null;
}

A Clipboard.getString() runs on every render causing repeated logs

B Clipboard.getString() runs once when component mounts

C Clipboard.getString() never runs because useEffect needs dependencies

D Clipboard.getString() causes a runtime error without dependencies

💡 Hint

useEffect without [] runs after every render.

Without a dependency array, useEffect runs after every render, so Clipboard.getString() is called repeatedly.

🔧 Debug

advanced

Why does this sharing code fail to open the share dialog?

This React Native code tries to share text but nothing happens. What is the likely cause?

React Native

import {Share} from 'react-native';

async function shareText() {
  try {
    await Share.share({message: 'Hello!'});
  } catch (error) {
    console.error(error);
  }
}

A message property should be called text, not message

B Missing await before Share.share causes the dialog not to open

C Share API requires a URL, not plain text

D Try-catch block prevents the share dialog from showing

💡 Hint

Share.share returns a Promise that should be awaited.

Without await, the Promise is not handled properly and the share dialog may not appear.

📝 Syntax

expert

What error does this clipboard code produce?

What error will this React Native clipboard code cause?

React Native

import Clipboard from '@react-native-clipboard/clipboard';

Clipboard.setString('Test');
Clipboard.getString().then(text => console.log(text));

A ReferenceError because Clipboard is not imported correctly

B SyntaxError due to missing semicolon after setString

C TypeError because getString does not take a callback

D No error, logs 'Test' correctly

💡 Hint

Check the signature of Clipboard.getString() in React Native.

Clipboard.getString() returns a Promise and does not accept a callback, so passing a callback causes a TypeError.