@react-native-harness/runtime 1.0.0-alpha.2 → 1.0.0-alpha.21

package/src/__tests__/expect.test.ts

@@ -72,7 +72,9 @@ describe('expect - Truthiness', () => {
       expect('hello').toBeTruthy();
       expect({}).toBeTruthy();
       expect([]).toBeTruthy();
-      expect(function () {}).toBeTruthy();
+      expect(function () {
+        // noop
+      }).toBeTruthy();
     });
 
     test('should fail for falsy values', () => {
@@ -330,7 +332,9 @@ describe('expect - Type Checking', () => {
       expect(true).toBeTypeOf('boolean');
       expect(undefined).toBeTypeOf('undefined');
       expect(Symbol('test')).toBeTypeOf('symbol');
-      expect(() => {}).toBeTypeOf('function');
+      expect(() => {
+        // noop
+      }).toBeTypeOf('function');
       expect({}).toBeTypeOf('object');
     });
 
@@ -406,7 +410,11 @@ describe('expect - Exceptions', () => {
     });
 
     test('should fail for functions that do not throw', () => {
-      expect(() => expect(() => {}).toThrow()).toThrow();
+      expect(() =>
+        expect(() => {
+          // noop
+        }).toThrow()
+      ).toThrow();
     });
 
     test('should fail for wrong error message', () => {
@@ -558,10 +566,10 @@ describe('expect - Custom Messages', () => {
 
 describe('expect - Edge Cases', () => {
   test('should handle circular references', () => {
-    const circular: any = { a: 1 };
+    const circular: Record<string, unknown> = { a: 1 };
     circular.self = circular;
 
-    const circular2: any = { a: 1 };
+    const circular2: Record<string, unknown> = { a: 1 };
     circular2.self = circular2;
 
     expect(circular).toEqual(circular2);

package/src/__tests__/initialize.test.ts

@@ -0,0 +1,24 @@
+import { describe, expect, it, vi } from 'vitest';
+
+import { disableHMRWhenReady } from '../disableHMRWhenReady.js';
+
+describe('initialize', () => {
+  it('retries HMRClient.disable until setup is ready', async () => {
+    vi.useFakeTimers();
+
+    const disable = vi
+      .fn()
+      .mockImplementationOnce(() => {
+        throw new Error('Expected HMRClient.setup() call at startup.');
+      })
+      .mockImplementationOnce(() => {
+        // ok
+      });
+
+    const promise = disableHMRWhenReady(disable, 50);
+    await vi.runAllTimersAsync();
+    await promise;
+
+    expect(disable).toHaveBeenCalledTimes(2);
+  });
+});

package/src/bundler/bundle.ts

@@ -1,5 +1,6 @@
 import { Platform } from 'react-native';
 import { getDevServerUrl } from '../utils/dev-server.js';
+import { BundlingFailedError } from './errors.js';
 
 const getModuleUrl = (fileName: string): string => {
   const devServerUrl = getDevServerUrl();
@@ -9,11 +10,17 @@ const getModuleUrl = (fileName: string): string => {
     platform: Platform.OS,
   });
 
-  return `${devServerUrl}/${bundleName}?${urlSearchParams.toString()}`;
+  return `${devServerUrl}${bundleName}?${urlSearchParams.toString()}`;
 };
 
 export const fetchModule = async (fileName: string): Promise<string> => {
   const url = getModuleUrl(fileName);
   const response = await fetch(url);
-  return response.text();
+  const text = await response.text();
+
+  if (!response.ok) {
+    throw new BundlingFailedError(fileName, text);
+  }
+
+  return text;
 };

package/src/bundler/errors.ts

@@ -14,3 +14,14 @@ export class MalformedModuleError extends Error {
     this.name = 'MalformedModuleError';
   }
 }
+
+export class BundlingFailedError extends Error {
+  constructor(
+    public readonly modulePath: string,
+    public readonly reason: string
+  ) {
+    const reasonMessage = JSON.parse(reason).message ?? reason;
+    super(`Bundling of ${modulePath} failed with error:\n\n${reasonMessage}\n`);
+    this.name = 'BundlingFailedError';
+  }
+}

package/src/bundler/evaluate.ts

@@ -1,25 +1,25 @@
 import { MalformedModuleError } from './errors.js';
-import { EnvironmentError } from '../errors.js';
 
 export const evaluateModule = (moduleJs: string, modulePath: string): void => {
-  const __rMatch = moduleJs.match(/__r\((\d+)\)/);
+  const __rMatches = Array.from(moduleJs.matchAll(/__r\((\d+)\)/g));
 
-  if (!__rMatch) {
+  if (__rMatches.length === 0) {
     throw new MalformedModuleError(modulePath, 'No __r function found');
   }
 
+  // Get the last match as there may be many require calls
+  const __rMatch = __rMatches[__rMatches.length - 1];
   const __rParam = __rMatch[1];
 
   if (!__rParam) {
     throw new MalformedModuleError(modulePath, 'No __r parameter found');
   }
 
-  // eslint-disable-next-line no-eval
-  eval(moduleJs);
+  const moduleId = Number(__rParam);
 
-  if (!__r) {
-    throw new EnvironmentError('module evaluation', '__r is not defined');
-  }
+  // This is important as if module was already initialized, it would not be re-initialized
+  global.__resetModule(moduleId);
 
-  __r(Number(__rParam));
+  // eslint-disable-next-line no-eval
+  eval(moduleJs);
 };

package/src/bundler/factory.ts

@@ -0,0 +1,43 @@
+import { BundlerEvents } from '@react-native-harness/bridge';
+import { getEmitter } from '../utils/emitter.js';
+import { Bundler } from './types.js';
+import { fetchModule } from './bundle.js';
+import { BundlingFailedError } from './errors.js';
+
+export const getBundler = (): Bundler => {
+  const events = getEmitter<BundlerEvents>();
+
+  return {
+    events,
+    getModule: async (filePath) => {
+      const bundlingStartTime = Date.now();
+      events.emit({
+        type: 'module-bundling-started',
+        file: filePath,
+      });
+
+      try {
+        const moduleJs = await fetchModule(filePath);
+        events.emit({
+          type: 'module-bundling-finished',
+          file: filePath,
+          duration: Date.now() - bundlingStartTime,
+        });
+
+        return moduleJs;
+      } catch (error) {
+        events.emit({
+          type: 'module-bundling-failed',
+          file: filePath,
+          duration: Date.now() - bundlingStartTime,
+          error:
+            error instanceof BundlingFailedError
+              ? error.reason
+              : 'Unknown error',
+        });
+
+        throw error;
+      }
+    },
+  };
+};

package/src/bundler/index.ts

@@ -1,2 +1,3 @@
-export { fetchModule } from './bundle.js';
 export { evaluateModule } from './evaluate.js';
+export { getBundler } from './factory.js';
+export type { Bundler } from './types.js';

package/src/bundler/types.ts

@@ -0,0 +1,7 @@
+import { BundlerEvents } from '@react-native-harness/bridge';
+import { EventEmitter } from '../utils/emitter.js';
+
+export type Bundler = {
+  events: EventEmitter<BundlerEvents>;
+  getModule: (filePath: string) => Promise<string>;
+};

package/src/client/factory.ts

@@ -1,6 +1,8 @@
 import type {
   TestRunnerEvents,
   TestCollectorEvents,
+  BundlerEvents,
+  TestExecutionOptions,
 } from '@react-native-harness/bridge';
 import { getBridgeClient } from '@react-native-harness/bridge/client';
 import { store } from '../ui/state.js';
@@ -8,7 +10,10 @@ import { getTestRunner, TestRunner } from '../runner/index.js';
 import { getTestCollector, TestCollector } from '../collector/index.js';
 import { combineEventEmitters, EventEmitter } from '../utils/emitter.js';
 import { getWSServer } from './getWSServer.js';
-import { fetchModule, evaluateModule } from '../bundler/index.js';
+import { getBundler, evaluateModule, Bundler } from '../bundler/index.js';
+import { markTestsAsSkippedByName } from '../filtering/index.js';
+import { setup } from '../render/setup.js';
+import { runSetupFiles } from './setup-files.js';
 
 export const getClient = async () => {
   const client = await getBridgeClient(getWSServer(), {
@@ -17,7 +22,10 @@ export const getClient = async () => {
     },
   });
 
-  client.rpc.$functions.runTests = async (path: string) => {
+  client.rpc.$functions.runTests = async (
+    path: string,
+    options: TestExecutionOptions = {}
+  ) => {
     if (store.getState().status === 'running') {
       throw new Error('Already running tests');
     }
@@ -26,24 +34,58 @@ export const getClient = async () => {
 
     let collector: TestCollector | null = null;
     let runner: TestRunner | null = null;
-    let events: EventEmitter<TestRunnerEvents | TestCollectorEvents> | null =
-      null;
+    let events: EventEmitter<
+      TestRunnerEvents | TestCollectorEvents | BundlerEvents
+    > | null = null;
+    let bundler: Bundler | null = null;
 
     try {
       collector = getTestCollector();
       runner = getTestRunner();
-      events = combineEventEmitters(collector.events, runner.events);
+      bundler = getBundler();
+      events = combineEventEmitters(
+        collector.events,
+        runner.events,
+        bundler.events
+      );
 
       events.addListener((event) => {
         client.rpc.emitEvent(event.type, event);
       });
 
-      const moduleJs = await fetchModule(path);
-      const collectionResult = await collector.collect(
-        () => evaluateModule(moduleJs, path),
-        path
-      );
-      return await runner.run(collectionResult.testSuite, path);
+      await runSetupFiles({
+        setupFiles: options.setupFiles ?? [],
+        setupFilesAfterEnv: [],
+        events: events as EventEmitter<BundlerEvents>,
+        bundler: bundler as Bundler,
+        evaluateModule,
+      });
+
+      const moduleJs = await bundler.getModule(path);
+      const collectionResult = await collector.collect(async () => {
+        await runSetupFiles({
+          setupFiles: [],
+          setupFilesAfterEnv: options.setupFilesAfterEnv ?? [],
+          events: events as EventEmitter<BundlerEvents>,
+          bundler: bundler as Bundler,
+          evaluateModule,
+        });
+
+        // Setup automatic cleanup for rendered components
+        setup();
+        evaluateModule(moduleJs, path);
+      }, path);
+
+      // Apply test name pattern by marking non-matching tests as skipped
+      const processedTestSuite = options.testNamePattern
+        ? markTestsAsSkippedByName(
+            collectionResult.testSuite,
+            options.testNamePattern
+          )
+        : collectionResult.testSuite;
+
+      const result = await runner.run(processedTestSuite, path);
+      return result;
     } finally {
       collector?.dispose();
       runner?.dispose();

package/src/client/getDeviceDescriptor.ts

@@ -1,28 +1,49 @@
-import { Platform } from 'react-native';
+import { Platform, PlatformConstants, PlatformStatic } from 'react-native';
+
+interface PlatformKeplerStatic extends PlatformStatic {
+  constants: PlatformConstants;
+  OS: 'kepler';
+  Version: number;
+}
+
+const getPlatform = (): Platform | PlatformKeplerStatic => {
+  return Platform as Platform | PlatformKeplerStatic;
+};
 
 export type DeviceDescriptor = {
-  platform: 'ios' | 'android';
+  platform: 'ios' | 'android' | 'vega';
   manufacturer: string;
   model: string;
   osVersion: string;
 };
 
 export const getDeviceDescriptor = (): DeviceDescriptor => {
-  if (Platform.OS === 'ios') {
+  const platform = getPlatform();
+
+  if (platform.OS === 'ios') {
     return {
       platform: 'ios',
       manufacturer: 'Apple',
       model: 'Unknown',
-      osVersion: Platform.constants.osVersion,
+      osVersion: platform.constants.osVersion,
     };
   }
 
-  if (Platform.OS === 'android') {
+  if (platform.OS === 'android') {
     return {
       platform: 'android',
-      manufacturer: Platform.constants.Manufacturer,
-      model: Platform.constants.Model,
-      osVersion: Platform.constants.Release,
+      manufacturer: platform.constants.Manufacturer,
+      model: platform.constants.Model,
+      osVersion: platform.constants.Release,
+    };
+  }
+
+  if (platform.OS === 'kepler') {
+    return {
+      platform: 'vega',
+      manufacturer: '',
+      model: '',
+      osVersion: '',
     };
   }
 

package/src/client/getWSServer.ts

@@ -4,6 +4,7 @@ import { WS_SERVER_PORT } from '../constants.js';
 export const getWSServer = (): string => {
   const devServerUrl = getDevServerUrl();
   const hostname = devServerUrl.split('://')[1].split(':')[0];
+  const port = global.RN_HARNESS?.webSocketPort || WS_SERVER_PORT;
 
-  return `ws://${hostname}:${WS_SERVER_PORT}`;
+  return `ws://${hostname}:${port}`;
 };

package/src/client/setup-files.ts

@@ -0,0 +1,81 @@
+import { EventEmitter } from '../utils/emitter.js';
+import { Bundler } from '../bundler/index.js';
+import { BundlerEvents } from '@react-native-harness/bridge';
+
+export type RunSetupFilesOptions = {
+  setupFiles: string[];
+  setupFilesAfterEnv: string[];
+  events: EventEmitter<BundlerEvents>;
+  bundler: Bundler;
+  evaluateModule: (moduleJs: string, filePath: string) => void;
+};
+
+export const runSetupFiles = async ({
+  setupFiles,
+  setupFilesAfterEnv,
+  events,
+  bundler,
+  evaluateModule,
+}: RunSetupFilesOptions) => {
+  for (const setupFile of setupFiles) {
+    const startTime = Date.now();
+    events.emit({
+      type: 'setup-file-bundling-started',
+      file: setupFile,
+      setupType: 'setupFiles',
+    });
+
+    try {
+      const setupModuleJs = await bundler.getModule(setupFile);
+      events.emit({
+        type: 'setup-file-bundling-finished',
+        file: setupFile,
+        setupType: 'setupFiles',
+        duration: Date.now() - startTime,
+      });
+      evaluateModule(setupModuleJs, setupFile);
+    } catch (error) {
+      const errorMessage =
+        error instanceof Error ? error.message : 'Unknown error';
+      events.emit({
+        type: 'setup-file-bundling-failed',
+        file: setupFile,
+        setupType: 'setupFiles',
+        duration: Date.now() - startTime,
+        error: errorMessage,
+      });
+      throw error;
+    }
+  }
+
+  for (const setupFile of setupFilesAfterEnv) {
+    const startTime = Date.now();
+    events.emit({
+      type: 'setup-file-bundling-started',
+      file: setupFile,
+      setupType: 'setupFilesAfterEnv',
+    });
+
+    try {
+      const setupModuleJs = await bundler.getModule(setupFile);
+      events.emit({
+        type: 'setup-file-bundling-finished',
+        file: setupFile,
+        setupType: 'setupFilesAfterEnv',
+        duration: Date.now() - startTime,
+      });
+      evaluateModule(setupModuleJs, setupFile);
+    } catch (error) {
+      const errorMessage =
+        error instanceof Error ? error.message : 'Unknown error';
+      events.emit({
+        type: 'setup-file-bundling-failed',
+        file: setupFile,
+        setupType: 'setupFilesAfterEnv',
+        duration: Date.now() - startTime,
+        error: errorMessage,
+      });
+      throw error;
+    }
+  }
+};

package/src/collector/functions.ts

@@ -53,7 +53,21 @@ const computeSuiteStatus = (
 ): TestStatus => {
   if (suite.options.skip) return 'skipped';
   if (suite.options.only) return 'active';
+
+  // Check if this suite has any focused content (tests or child suites)
+  const hasFocusedTests = suite.tests.some((test) => test.options.only);
+  const hasFocusedChildren = suite.suites.some(
+    (childSuite) =>
+      childSuite.options.only ||
+      childSuite.tests.some((test) => test.options.only)
+  );
+
+  // If this suite has focused content, it should be active
+  if (hasFocusedTests || hasFocusedChildren) return 'active';
+
+  // If parent has focused children and this suite has no focused content, skip it
   if (parentContext.hasFocusedChildren) return 'skipped';
+
   return 'active';
 };
 
@@ -356,11 +370,13 @@ const countTests = (suite: TestSuite): number => {
   return count;
 };
 
-export const collectTests = (fn: () => void): CollectionResult => {
+export const collectTests = async (
+  fn: () => void | Promise<void>
+): Promise<CollectionResult> => {
   currentContext = clearState();
 
   try {
-    fn();
+    await fn();
 
     // Convert raw structure to final structure using computation phase
     const testSuite = convertRawTestSuiteToTestSuite(getRootSuite());

package/src/collector/types.ts

@@ -10,6 +10,9 @@ export type TestCollectorEventsEmitter = EventEmitter<TestCollectorEvents>;
 
 export type TestCollector = {
   events: TestCollectorEventsEmitter;
-  collect: (fn: () => void, testFilePath: string) => Promise<CollectionResult>;
+  collect: (
+    fn: () => void | Promise<void>,
+    testFilePath: string
+  ) => Promise<CollectionResult>;
   dispose: () => void;
 };

package/src/constants.ts

@@ -1,2 +1 @@
-export const LOGO_IMAGE = require('../assets/logo.png');
 export const WS_SERVER_PORT = 3001;

package/src/disableHMRWhenReady.ts

@@ -0,0 +1,27 @@
+export function disableHMRWhenReady(
+  disable: () => void,
+  retriesLeft: number,
+  retryDelay = 10
+) {
+  return new Promise<void>((resolve, reject) => {
+    function attempt(remaining: number) {
+      try {
+        disable();
+        resolve();
+      } catch (error) {
+        if (
+          remaining > 0 &&
+          error instanceof Error &&
+          error.message.includes('Expected HMRClient.setup() call at startup.')
+        ) {
+          setTimeout(() => attempt(remaining - 1), retryDelay);
+          return;
+        }
+
+        reject(error);
+      }
+    }
+
+    attempt(retriesLeft);
+  });
+}

package/src/entry-point.ts

@@ -0,0 +1,8 @@
+import { AppRegistry } from 'react-native';
+import { getHarnessGlobal } from './globals.js';
+import { UI } from './ui/index.js';
+
+AppRegistry.registerComponent(
+  getHarnessGlobal().appRegistryComponentName,
+  () => UI
+);

package/src/expect/index.ts

@@ -1,3 +1,6 @@
+// This is adapted version of https://github.com/vitest-dev/vitest/blob/main/packages/vitest/src/integrations/chai/index.ts
+// Credits to Vitest team for the original implementation.
+
 import type { Assertion, ExpectStatic, MatcherState } from '@vitest/expect';
 import {
   addCustomEqualityTesters,
@@ -13,13 +16,16 @@ import * as chai from 'chai';
 import './setup.js';
 
 export function createExpect(): ExpectStatic {
-  const expect = ((value: any, message?: string): Assertion => {
+  const expect = ((value: unknown, message?: string): Assertion => {
     const { assertionCalls } = getState(expect);
     setState({ assertionCalls: assertionCalls + 1 }, expect);
     return chai.expect(value, message) as unknown as Assertion;
   }) as ExpectStatic;
   Object.assign(expect, chai.expect);
-  Object.assign(expect, (globalThis as any)[ASYMMETRIC_MATCHERS_OBJECT]);
+  Object.assign(
+    expect,
+    globalThis[ASYMMETRIC_MATCHERS_OBJECT as unknown as keyof typeof globalThis]
+  );
 
   expect.getState = () => getState<MatcherState>(expect);
   expect.setState = (state) => setState(state as Partial<MatcherState>, expect);

package/src/expect/setup.ts

@@ -1,3 +1,6 @@
+// This is adapted version of https://github.com/vitest-dev/vitest/blob/main/packages/vitest/src/integrations/chai/setup.ts
+// Credits to Vitest team for the original implementation.
+
 import {
   JestAsymmetricMatchers,
   JestChaiExpect,

package/src/filtering/index.ts

@@ -0,0 +1,4 @@
+export {
+  filterTestsByName,
+  markTestsAsSkippedByName,
+} from './testNameFilter.js';

package/src/filtering/testNameFilter.ts

@@ -0,0 +1,82 @@
+import { TestSuite } from '@react-native-harness/bridge';
+
+/**
+ * Filters tests by name pattern, matching against test names and suite+test combinations
+ * @deprecated Use markTestsAsSkippedByName instead - this function will be removed in a future version
+ */
+export const filterTestsByName = (
+  suite: TestSuite,
+  testNamePattern: string
+): TestSuite => {
+  const regex = new RegExp(testNamePattern);
+  return filterSuiteRecursively(suite, regex);
+};
+
+/**
+ * Marks tests as skipped based on name pattern, keeping all tests in the structure
+ * but setting non-matching tests to 'skipped' status
+ */
+export const markTestsAsSkippedByName = (
+  suite: TestSuite,
+  testNamePattern: string
+): TestSuite => {
+  const regex = new RegExp(testNamePattern);
+  return markTestsRecursively(suite, regex);
+};
+
+const markTestsRecursively = (suite: TestSuite, regex: RegExp): TestSuite => {
+  // Mark tests in current suite - skip tests that don't match the pattern
+  const updatedTests = suite.tests.map((test) => {
+    const matches =
+      regex.test(test.name) || regex.test(`${suite.name} ${test.name}`);
+
+    // If test doesn't match pattern and is currently active, mark it as skipped
+    if (!matches && test.status === 'active') {
+      return {
+        ...test,
+        status: 'skipped' as const,
+      };
+    }
+
+    // Keep original status for matching tests or already skipped/todo tests
+    return test;
+  });
+
+  // Recursively process child suites
+  const updatedChildSuites = suite.suites.map((childSuite) =>
+    markTestsRecursively(childSuite, regex)
+  );
+
+  return {
+    ...suite,
+    tests: updatedTests,
+    suites: updatedChildSuites,
+  };
+};
+
+const filterSuiteRecursively = (suite: TestSuite, regex: RegExp): TestSuite => {
+  // Filter tests in current suite - match against test name or "suite test" combination
+  const filteredTests = suite.tests.filter(
+    (test) => regex.test(test.name) || regex.test(`${suite.name} ${test.name}`)
+  );
+
+  // Recursively filter child suites
+  const filteredChildSuites = suite.suites
+    .map((childSuite) => filterSuiteRecursively(childSuite, regex))
+    .filter((childSuite) => hasAnyActiveTests(childSuite));
+
+  return {
+    ...suite,
+    tests: filteredTests,
+    suites: filteredChildSuites,
+  };
+};
+
+const hasAnyActiveTests = (suite: TestSuite): boolean => {
+  const hasDirectTests = suite.tests.some((test) => test.status === 'active');
+  const hasChildTests = suite.suites.some((childSuite) =>
+    hasAnyActiveTests(childSuite)
+  );
+
+  return hasDirectTests || hasChildTests;
+};