From 8777e25d8e6d20152c768c7ab174942dc24af7ac Mon Sep 17 00:00:00 2001
From: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed, 28 Jun 2017 14:03:19 -0700
Subject: [PATCH] [add] Image: draggable prop

Allows control over browser's default drag-and-drop behaviour for
images. Setting draggable to 'false' will prevent dragging.

Close #514
---
 src/components/Image/__tests__/index-test.js | 10 +++++++++-
 src/components/Image/index.js                |  3 +++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/components/Image/__tests__/index-test.js b/src/components/Image/__tests__/index-test.js
index 8b78aec9..1bf6a922 100644
--- a/src/components/Image/__tests__/index-test.js
+++ b/src/components/Image/__tests__/index-test.js
@@ -4,7 +4,7 @@ import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';
 import Image from '../';
 import ImageUriCache from '../ImageUriCache';
 import React from 'react';
-import { mount, render } from 'enzyme';
+import { mount, render, shallow } from 'enzyme';
 
 const originalCanUseDOM = ExecutionEnvironment.canUseDOM;
 const originalImage = window.Image;
@@ -76,6 +76,14 @@ describe('components/Image', () => {
     });
   });
 
+  test('prop "draggable"', () => {
+    const defaultSource = { uri: 'https://google.com/favicon.ico' };
+    const component = shallow(<Image defaultSource={defaultSource} />);
+    expect(component.find('img').prop('draggable')).toBeUndefined();
+    component.setProps({ defaultSource, draggable: false });
+    expect(component.find('img').prop('draggable')).toBe(false);
+  });
+
   describe('prop "resizeMode"', () => {
     [
       Image.resizeMode.contain,
diff --git a/src/components/Image/index.js b/src/components/Image/index.js
index 548c2812..69bc1be1 100644
--- a/src/components/Image/index.js
+++ b/src/components/Image/index.js
@@ -79,6 +79,7 @@ class Image extends Component {
     ...ViewPropTypes,
     children: any,
     defaultSource: ImageSourcePropType,
+    draggable: bool,
     onError: func,
     onLayout: func,
     onLoad: func,
@@ -155,6 +156,7 @@ class Image extends Component {
       accessible,
       children,
       defaultSource,
+      draggable,
       onLayout,
       source,
       testID,
@@ -188,6 +190,7 @@ class Image extends Component {
     // Allows users to trigger the browser's image context menu
     const hiddenImage = displayImage
       ? createDOMElement('img', {
+          draggable,
           src: displayImage,
           style: [StyleSheet.absoluteFill, styles.img]
         })