--- title: Handle platform differences --- import { SnackInline, Terminal } from '~/ui/components/Snippet'; import Video from '~/components/plugins/Video'; import { A } from '~/ui/components/Text'; import { Step } from '~/ui/components/Step'; import { BoxLink } from '~/ui/components/BoxLink'; import { BookOpen02Icon } from '@expo/styleguide-icons'; Android, iOS, and the web have different capabilities. In our case, Android and iOS both are able to capture a screenshot with the `react-native-view-shot` library, however web browsers cannot. In this chapter, let's learn how to make an exception for web browsers to get the same functionality on all platforms. ## Install and import dom-to-image To capture a screenshot on the web and save it as an image , we'll use a third-party library called [dom-to-image](https://github.com/tsayen/dom-to-image#readme). It allows taking a screenshot of any DOM node and turning it into a vector (SVG) or raster (PNG or JPEG) image. Stop the development server and run the following command to install the library: After installing it, make sure to restart the development server and press w in the terminal. To use it, let's import it into **App.js**: ```jsx App.js import domtoimage from 'dom-to-image'; ``` ## Add platform-specific code React Native provides a `Platform` module that gives us access to information about the platform on which the app is currently running. You can use it to implement platform-specific behavior. Import the `Platform` module in **App.js**: {/* prettier-ignore */} ```jsx App.js import { StyleSheet, View, /* @info Import the Platform module from react-native. */ Platform /* @end */ } from 'react-native'; ``` Inside the `onSaveImageAsync()` function in the `` component, we'll use `Platform.OS` to check whether the platform is `'web'`. If it is not `'web'`, we'll run the logic added previously to take and save the screenshot. If it is `'web'`, we'll use the `domtoimage.toJpeg()` method to convert and capture the current `` as a JPEG image. {/* prettier-ignore */} ```jsx const onSaveImageAsync = async () => { /* @info Add the if condition here to check whether the current platform is web or not. */ if (Platform.OS !== 'web') { /* @end */ try { const localUri = await captureRef(imageRef, { height: 440, quality: 1, }); await MediaLibrary.saveToLibraryAsync(localUri); if (localUri) { alert('Saved!'); } } catch (e) { console.log(e); } } /* @info Add an else condition to run the logic when the current platform is the web. */else { try { const dataUrl = await domtoimage.toJpeg(imageRef.current, { quality: 0.95, width: 320, height: 440, }); let link = document.createElement('a'); link.download = 'sticker-smash.jpeg'; link.href = dataUrl; link.click(); } catch (e) { console.log(e); } } /* @end */ }; ``` On running the app in a web browser, we can now save a screenshot: ## Next step The app does everything we set out for it to do, so it's time to shift our focus toward the purely aesthetic.