diff --git a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsRunner.tsx b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsRunner.tsx index bfb4de4fdbc..162b810cf75 100644 --- a/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsRunner.tsx +++ b/apps/common-app/src/examples/RuntimeTests/ReanimatedRuntimeTestsRunner/RuntimeTestsRunner.tsx @@ -1,9 +1,15 @@ -import { View, Button, StyleSheet, Text } from 'react-native'; +import { View, TouchableOpacity, StyleSheet, Text } from 'react-native'; import type { ReactNode } from 'react'; import React, { useEffect, useState } from 'react'; import { runTests, configure } from './RuntimeTestsApi'; import { RenderLock } from './SyncUIRunner'; +interface ImportButton { + testSuiteName: string; + importTest: () => void; + skipByDefault?: boolean; +} + let renderLock: RenderLock = new RenderLock(); export class ErrorBoundary extends React.Component< { children: React.JSX.Element | Array }, @@ -21,15 +27,65 @@ export class ErrorBoundary extends React.Component< render() { if (this.state.hasError) { - return Something went wrong.; + return Unable to render component; } return this.props.children; } } -export default function RuntimeTestsRunner() { +function ImportButtons({ importButtons }: { importButtons: Array }) { + const [importedTests, setImportedTests] = useState>([]); + const [importedAll, setImportedAll] = useState(false); + + const handleImportAllClick = () => { + setImportedAll(true); + const newImportedTests = importedTests; + for (const button of importButtons) { + if (!button.skipByDefault) { + button.importTest(); + if (!importedTests.includes(button.testSuiteName)) { + newImportedTests.push(button.testSuiteName); + } + } + } + setImportedTests(newImportedTests); + }; + + const handleImportClick = (button: ImportButton) => { + button.importTest(); + if (!importedTests.includes(button.testSuiteName)) { + setImportedTests([...importedTests, button.testSuiteName]); + } + }; + return ( + + + Import all reanimated tests + + + + {importButtons.map(importButton => { + const { testSuiteName } = importButton; + return ( + handleImportClick(importButton)} + style={[styles.importButton, importedTests.includes(testSuiteName) ? styles.importButtonImported : {}]}> + {testSuiteName} + + ); + })} + + + ); +} + +export default function RuntimeTestsRunner({ importButtons }: { importButtons: Array }) { const [component, setComponent] = useState(null); + const [started, setStarted] = useState(false); useEffect(() => { if (renderLock) { renderLock.unlock(); @@ -37,14 +93,20 @@ export default function RuntimeTestsRunner() { }, [component]); return ( -