diff --git a/packages/render-html/src/__tests__/regression.524.img-enable-exp-percent-width.test.tsx b/packages/render-html/src/__tests__/regression.524.img-enable-exp-percent-width.test.tsx
new file mode 100644
index 000000000..abc63ca4f
--- /dev/null
+++ b/packages/render-html/src/__tests__/regression.524.img-enable-exp-percent-width.test.tsx
@@ -0,0 +1,33 @@
+import React from 'react';
+import RenderHTML from '../RenderHTML';
+import { render } from '@testing-library/react-native';
+
+/**
+ * https://github.com/meliorence/react-native-render-html/issues/524
+ **/
+describe('RenderHTML component', () => {
+ describe('should pass regression regarding percent width', () => {
+ it('dimensions should not be derived from aspect ratio', async () => {
+ const renderersProps = {
+ img: {
+ enableExperimentalPercentWidth: true
+ }
+ };
+ const { findByTestId } = render(
+ '
+ }}
+ />
+ );
+ const img = await findByTestId('image-success');
+ expect(img).toHaveStyle({
+ width: 300,
+ height: 400
+ });
+ });
+ });
+});
diff --git a/packages/render-html/src/elements/__tests__/IMGElement.test.tsx b/packages/render-html/src/elements/__tests__/IMGElement.test.tsx
index 2eeb02074..460380bc6 100644
--- a/packages/render-html/src/elements/__tests__/IMGElement.test.tsx
+++ b/packages/render-html/src/elements/__tests__/IMGElement.test.tsx
@@ -313,10 +313,11 @@ describe('IMGElement', () => {
const image = await findByTestId('image-success');
expect(image).toBeTruthy();
expect(image).toHaveStyle({
- width: 640
+ width: 640,
+ height: 360
});
});
- it('should support strings for width and height which can be parsed to floats', async () => {
+ it('should support strings for width and height which can be parsed to numbers', async () => {
const source = { uri: 'http://via.placeholder.com/640x360' };
const style = {
width: '50'
@@ -340,7 +341,7 @@ describe('IMGElement', () => {
const { findByTestId } = render(