test: fix e2e tests

.github/workflows/e2e-ios.yml

@@ -22,7 +22,7 @@ jobs:
         working-directory: [paper-example]
       fail-fast: false
     env:
-      DEVICE: iPhone 16 Pro
+      DEVICE: iPhone 15 Pro
     steps:
       - name: Checkout Git repository
         uses: actions/checkout@v4

apps/common/example/e2e/TestingView.tsx

@@ -12,7 +12,7 @@ export const TestingView = () => {
   const [renderedContent, setRenderedContent] =
     useState<React.ReactElement | null>();
   const [readyToSnapshot, setReadyToSnapshot] = useState(false);
-  const [resolution, setResolution] = useState([0, 0]); // placeholder value, later updated by incoming render requests
+  const [resolution, setResolution] = useState({width: 0, height: 0}); // placeholder value, later updated by incoming render requests
   const [message, setMessage] = useState('⏳ Connecting to Jest server...');
 
   const connect = useCallback(() => {
@@ -48,7 +48,8 @@ export const TestingView = () => {
       const message = JSON.parse(rawMessage);
       if (message.type == 'renderRequest') {
         setMessage(`✅ Rendering tests, please don't close this tab.`);
-        setResolution([message.width, message.height]);
+        const {width, height} = message;
+        setResolution({width, height});
         setRenderedContent(
           createElementFromObject(
             message.data.type || 'SvgFromXml',
@@ -67,6 +68,11 @@ export const TestingView = () => {
         `✅ Connection to Jest server has been closed. You can close this tab safely. (${event.code})`,
       );
     };
+
+    return () => {
+      setWsClient(null);
+      client.close();
+    };
   }, [wsClient]);
 
   // Create initial connection when rendering the view
@@ -93,7 +99,7 @@ export const TestingView = () => {
       <Text style={{marginLeft: 'auto', marginRight: 'auto'}}>{message}</Text>
       <ViewShot
         ref={wrapperRef}
-        style={{width: resolution[0], height: resolution[1]}}
+        style={{...resolution}}
         options={{result: 'base64'}}>
         {renderedContent}
       </ViewShot>

apps/common/example/e2e/index.tsx

@@ -1,5 +1,4 @@
 import {icon} from './icon';
-import {TestingView} from './TestingView';
+import {TestingView as component} from './TestingView';
 
-const component = TestingView;
 export {component, icon};

apps/common/example/index.tsx

@@ -11,7 +11,7 @@ import React from 'react';
 import {ActivityIndicator, Platform, View} from 'react-native';
 import {GestureHandlerRootView} from 'react-native-gesture-handler';
 import {ListScreen} from './ListScreen';
-import * as E2e from './e2e/index.macos';
+import * as E2e from './e2e/index';
 import {examples} from './examples';
 import * as FilterImage from './examples/FilterImage';
 import * as Filters from './examples/Filters';