diff --git a/packages/react-native-web/src/exports/Image/__tests__/index-test.js b/packages/react-native-web/src/exports/Image/__tests__/index-test.js
index 6bdd81337b..13f654a27a 100644
--- a/packages/react-native-web/src/exports/Image/__tests__/index-test.js
+++ b/packages/react-native-web/src/exports/Image/__tests__/index-test.js
@@ -401,4 +401,31 @@ describe('components/Image', () => {
});
});
});
+
+ describe('prop "src"', () => {
+ test('renders the image URI', () => {
+ const src = 'https://example.com/src.png';
+ ImageUriCache.add(src);
+
+ const { container } = render();
+
+ expect(container.querySelector('img').src).toBe(src);
+ ImageUriCache.remove(src);
+ });
+
+ test('takes precedence over "source"', () => {
+ const src = 'https://example.com/src.png';
+ const sourceUri = 'https://example.com/source.png';
+ ImageUriCache.add(src);
+ ImageUriCache.add(sourceUri);
+
+ const { container } = render(
+
+ );
+
+ expect(container.querySelector('img').src).toBe(src);
+ ImageUriCache.remove(src);
+ ImageUriCache.remove(sourceUri);
+ });
+ });
});
diff --git a/packages/react-native-web/src/exports/Image/index.js b/packages/react-native-web/src/exports/Image/index.js
index f99faa7ec3..fa52d45cfb 100644
--- a/packages/react-native-web/src/exports/Image/index.js
+++ b/packages/react-native-web/src/exports/Image/index.js
@@ -188,10 +188,12 @@ const Image: React.AbstractComponent<
onLoadEnd,
onLoadStart,
pointerEvents,
- source,
+ source: sourceProp,
+ src,
style,
...rest
} = props;
+ const source = src != null ? src : sourceProp;
const ariaLabel = _ariaLabel || accessibilityLabel;
if (process.env.NODE_ENV !== 'production') {
diff --git a/packages/react-native-web/src/exports/Image/types.js b/packages/react-native-web/src/exports/Image/types.js
index e5d7240261..3ab28b11d7 100644
--- a/packages/react-native-web/src/exports/Image/types.js
+++ b/packages/react-native-web/src/exports/Image/types.js
@@ -98,6 +98,11 @@ export type ImageProps = {
onProgress?: (e: any) => void,
resizeMode?: ResizeMode,
source?: Source,
+ /**
+ * A remote URL string for the image resource. Takes precedence over
+ * `source`.
+ */
+ src?: string,
style?: GenericStyleProp,
tintColor?: ColorValue
};