Add failing tests for Image

packages/react-native-web/src/exports/Image/__tests__/index-test.js

@@ -89,11 +89,34 @@ describe('components/Image', () => {
   });
 
   describe('prop "onLoad"', () => {
-    test('is called after image is loaded from network', () => {
-      jest.useFakeTimers();
+    const originalLoad = ImageLoader.load;
+
+    beforeEach(() => {
       ImageLoader.load = jest.fn().mockImplementation((_, onLoad, onError) => {
         onLoad();
       });
+    });
+
+    afterEach(() => {
+      ImageLoader.load = originalLoad;
+    });
+
+    test('is not called again if callback changes', () => {
+      const onLoadStub = jest.fn();
+      const onLoadReplacementStub = jest.fn();
+
+      const { rerender } = render(
+        <Image onLoad={onLoadStub} source={'https://test.com/img.jpg'} />
+      );
+      act(() => {
+        rerender(<Image onLoad={onLoadReplacementStub} source={'https://test.com/img.jpg'} />);
+      });
+      expect(onLoadStub.mock.calls.length).toBe(1);
+      expect(onLoadReplacementStub.mock.calls.length).toBe(0);
+    });
+
+    test('is called after image is loaded from network', () => {
+      jest.useFakeTimers();
       const onLoadStartStub = jest.fn();
       const onLoadStub = jest.fn();
       const onLoadEndStub = jest.fn();
@@ -111,9 +134,6 @@ describe('components/Image', () => {
 
     test('is called after image is loaded from cache', () => {
       jest.useFakeTimers();
-      ImageLoader.load = jest.fn().mockImplementation((_, onLoad, onError) => {
-        onLoad();
-      });
       const onLoadStartStub = jest.fn();
       const onLoadStub = jest.fn();
       const onLoadEndStub = jest.fn();

packages/react-native-web/src/modules/useStable/index.js

@@ -7,16 +7,16 @@
  * @flow strict-local
  */
 
-import * as React from 'react';
+import { useRef } from 'react';
 
 const UNINITIALIZED =
   typeof Symbol === 'function' && typeof Symbol() === 'symbol' ? Symbol() : Object.freeze({});
 
 export default function useStable<T>(getInitialValue: () => T): T {
-  const ref = React.useRef(UNINITIALIZED);
+  const ref = useRef(UNINITIALIZED);
   if (ref.current === UNINITIALIZED) {
     ref.current = getInitialValue();
   }
-  // $FlowFixMe (#64650789) Trouble refining types where `Symbol` is concerned.
+  // $FlowFixMe: Trouble refining types where `Symbol` is concerned.
   return ref.current;
 }

scripts/jest/setupFiles.js

@@ -11,7 +11,7 @@ window.ResizeObserver = ResizeObserver;
 // JSDOM doesn't provide values for 'clientWidth' etc
 Object.defineProperty(window.document.documentElement, 'clientHeight', {
   get: function () {
-    return this._jsdomClientWidth || window.innerHeight;
+    return this._jsdomClientHeight || window.innerHeight;
   }
 });
 Object.defineProperty(window.document.documentElement, 'clientWidth', {