@omriashke/dynamico-validator 0.1.1

package/src/events.ts

@@ -0,0 +1,38 @@
+import TestRenderer from "react-test-renderer";
+import type { ReactTestInstance } from "react-test-renderer";
+
+/**
+ * Fire onPress on a node. The node may be a Pressable, Button, TouchableOpacity,
+ * or any host component that accepts onPress. If onPress is missing, throws —
+ * because asserting "this thing is pressable" is a useful test all by itself.
+ */
+export function press(node: ReactTestInstance, eventArg: unknown = {}): void {
+  const onPress = node.props?.onPress as ((e: unknown) => void) | undefined;
+  if (typeof onPress !== "function") {
+    const type = typeof node.type === "string" ? node.type : (node.type as { displayName?: string }).displayName ?? "<anonymous>";
+    throw new Error(`press(): node <${type}> has no onPress handler`);
+  }
+  TestRenderer.act(() => {
+    onPress(eventArg);
+  });
+}
+
+export function longPress(node: ReactTestInstance, eventArg: unknown = {}): void {
+  const onLongPress = node.props?.onLongPress as ((e: unknown) => void) | undefined;
+  if (typeof onLongPress !== "function") {
+    throw new Error(`longPress(): node has no onLongPress handler`);
+  }
+  TestRenderer.act(() => {
+    onLongPress(eventArg);
+  });
+}
+
+export function changeText(node: ReactTestInstance, text: string): void {
+  const onChangeText = node.props?.onChangeText as ((t: string) => void) | undefined;
+  if (typeof onChangeText !== "function") {
+    throw new Error(`changeText(): node has no onChangeText handler`);
+  }
+  TestRenderer.act(() => {
+    onChangeText(text);
+  });
+}

package/src/expect.ts

@@ -0,0 +1,70 @@
+/**
+ * Tiny expectation helper. We avoid pulling in Jest/Vitest because tests run
+ * inside the registry's worker thread — the smaller the dependency surface,
+ * the lower the cold-start cost.
+ *
+ * Failed expectations throw — the runner catches the throw and reports it as
+ * the rejection reason for the push.
+ */
+export interface Expectation<T> {
+  toBe(expected: T): void;
+  toEqual(expected: unknown): void;
+  toBeTruthy(): void;
+  toBeFalsy(): void;
+  toMatch(pattern: string | RegExp): void;
+  toThrow(): void;
+}
+
+export function expect<T>(actual: T): Expectation<T> {
+  return {
+    toBe(expected) {
+      if (!Object.is(actual, expected)) {
+        throw new Error(`expected ${stringify(actual)} to be ${stringify(expected)}`);
+      }
+    },
+    toEqual(expected) {
+      if (!deepEqual(actual, expected)) {
+        throw new Error(`expected ${stringify(actual)} to equal ${stringify(expected)}`);
+      }
+    },
+    toBeTruthy() {
+      if (!actual) throw new Error(`expected ${stringify(actual)} to be truthy`);
+    },
+    toBeFalsy() {
+      if (actual) throw new Error(`expected ${stringify(actual)} to be falsy`);
+    },
+    toMatch(pattern) {
+      if (typeof actual !== "string") {
+        throw new Error(`expected ${stringify(actual)} to be a string`);
+      }
+      const re = typeof pattern === "string" ? new RegExp(pattern) : pattern;
+      if (!re.test(actual)) {
+        throw new Error(`expected ${stringify(actual)} to match ${pattern}`);
+      }
+    },
+    toThrow() {
+      if (typeof actual !== "function") {
+        throw new Error(`toThrow() requires a function`);
+      }
+      let threw = false;
+      try { (actual as () => unknown)(); } catch { threw = true; }
+      if (!threw) throw new Error(`expected function to throw`);
+    },
+  };
+}
+
+function deepEqual(a: unknown, b: unknown): boolean {
+  if (Object.is(a, b)) return true;
+  if (typeof a !== "object" || typeof b !== "object" || a === null || b === null) return false;
+  const ak = Object.keys(a as object);
+  const bk = Object.keys(b as object);
+  if (ak.length !== bk.length) return false;
+  for (const k of ak) {
+    if (!deepEqual((a as Record<string, unknown>)[k], (b as Record<string, unknown>)[k])) return false;
+  }
+  return true;
+}
+
+function stringify(v: unknown): string {
+  try { return JSON.stringify(v); } catch { return String(v); }
+}

package/src/index.ts

@@ -0,0 +1,23 @@
+/**
+ * Public API surface of @omriashke/dynamico-validator.
+ *
+ * This package is consumed in two places:
+ *
+ *   1. By component authors writing `Foo.test.tsx` next to `Foo.tsx`. They
+ *      import { render, press, findByText, sleep, expect } from
+ *      '@omriashke/dynamico-validator' and write a default-exported async function.
+ *
+ *   2. By the registry-server's push validator, which uses runTest() to
+ *      execute a compiled component + test pair in a worker thread. If the
+ *      test throws, the push is rejected.
+ *
+ * The author API is small on purpose: less surface = fewer ways to write a
+ * misleading test. Assertions are throw-on-failure — if the test function
+ * returns, the component is considered valid.
+ */
+export { render, type RenderResult, type RenderOptions } from "./render.js";
+export { press, longPress, changeText } from "./events.js";
+export { findByText, findAllByType, queryByText } from "./queries.js";
+export { sleep, flush } from "./timing.js";
+export { expect, type Expectation } from "./expect.js";
+export { runTest, type RunTestInput, type RunTestResult, setHostScope, getHostScope } from "./runTest.js";

package/src/mocks/react-native.ts

@@ -0,0 +1,203 @@
+/**
+ * Minimal `react-native` mock for use inside the dynamico push validator.
+ *
+ * react-test-renderer treats every JSX tag whose component is a string OR a
+ * function as a host component. The real react-native exports each primitive
+ * (View, Text, Pressable, ...) as a class/native component that the JS runtime
+ * doesn't have at validation time. We substitute each with a tiny functional
+ * component that just renders its children. This is enough for:
+ *
+ *   - assertions about which sub-trees rendered (the test can still
+ *     `find(node => node.type.name === 'Text' && node.props.children === 'X')`)
+ *   - exercising onPress / onChangeText handlers via the press()/type() helpers
+ *   - StyleSheet.create / Animated / Platform — stubbed to no-op
+ *
+ * We deliberately do NOT import the real `react-native` here: doing so pulls
+ * in the iOS/Android bridge code which fails at require() time on Node.
+ */
+import * as React from "react";
+
+type AnyProps = Record<string, unknown> & { children?: React.ReactNode };
+
+function createHostComponent(displayName: string) {
+  const C = (props: AnyProps): React.ReactElement =>
+    React.createElement(displayName, props, props.children);
+  C.displayName = displayName;
+  return C;
+}
+
+export const View = createHostComponent("View");
+export const Text = createHostComponent("Text");
+export const Pressable = createHostComponent("Pressable");
+export const TouchableOpacity = createHostComponent("TouchableOpacity");
+export const TouchableHighlight = createHostComponent("TouchableHighlight");
+export const TouchableWithoutFeedback = createHostComponent("TouchableWithoutFeedback");
+export const ScrollView = createHostComponent("ScrollView");
+export const SafeAreaView = createHostComponent("SafeAreaView");
+export const Image = createHostComponent("Image");
+export const TextInput = createHostComponent("TextInput");
+export const Switch = createHostComponent("Switch");
+export const Modal = createHostComponent("Modal");
+export const ActivityIndicator = createHostComponent("ActivityIndicator");
+export const KeyboardAvoidingView = createHostComponent("KeyboardAvoidingView");
+export const RefreshControl = createHostComponent("RefreshControl");
+
+// FlatList passes data/renderItem in real RN; the mock does the same so
+// onPress handlers inside renderItem still get exercised by tests.
+export function FlatList(props: AnyProps): React.ReactElement {
+  const data = (props as { data?: unknown[] }).data ?? [];
+  const renderItem = (props as { renderItem?: (info: { item: unknown; index: number }) => React.ReactElement | null }).renderItem;
+  const keyExtractor = (props as { keyExtractor?: (item: unknown, i: number) => string }).keyExtractor;
+  return React.createElement(
+    "FlatList",
+    props,
+    ...data.map((item, index) => {
+      const child = renderItem ? renderItem({ item, index }) : null;
+      const key = keyExtractor ? keyExtractor(item, index) : String(index);
+      return child ? React.cloneElement(child, { key }) : null;
+    }),
+  );
+}
+
+export const StyleSheet = {
+  create<T extends Record<string, object>>(styles: T): T {
+    return styles;
+  },
+  flatten(style: unknown): unknown {
+    if (Array.isArray(style)) {
+      return Object.assign({}, ...style.filter(Boolean));
+    }
+    return style ?? {};
+  },
+  hairlineWidth: 1,
+  absoluteFill: {},
+  absoluteFillObject: {},
+};
+
+export const Platform = {
+  OS: "ios" as const,
+  Version: 17,
+  select<T>(specifics: { ios?: T; android?: T; default?: T }): T | undefined {
+    return specifics.ios ?? specifics.default;
+  },
+  isPad: false,
+  isTV: false,
+};
+
+export const Dimensions = {
+  get: (_what: "window" | "screen") => ({ width: 390, height: 844, scale: 3, fontScale: 1 }),
+  addEventListener: () => ({ remove: () => {} }),
+  removeEventListener: () => {},
+};
+
+export const PixelRatio = {
+  get: () => 3,
+  getFontScale: () => 1,
+  roundToNearestPixel: (n: number) => Math.round(n),
+  getPixelSizeForLayoutSize: (n: number) => n * 3,
+};
+
+const noopAnimatedValue = () => ({
+  setValue: () => {},
+  interpolate: () => 0,
+  addListener: () => "",
+  removeListener: () => {},
+  removeAllListeners: () => {},
+  stopAnimation: () => {},
+  resetAnimation: () => {},
+  __getValue: () => 0,
+});
+
+export const Animated = {
+  Value: function (this: unknown) {
+    return noopAnimatedValue();
+  } as unknown as new (n: number) => ReturnType<typeof noopAnimatedValue>,
+  ValueXY: function (this: unknown) {
+    return { x: noopAnimatedValue(), y: noopAnimatedValue() };
+  } as unknown as new () => { x: ReturnType<typeof noopAnimatedValue>; y: ReturnType<typeof noopAnimatedValue> },
+  View,
+  Text,
+  ScrollView,
+  Image,
+  FlatList,
+  timing: () => ({ start: (cb?: () => void) => cb?.() }),
+  spring: () => ({ start: (cb?: () => void) => cb?.() }),
+  decay: () => ({ start: (cb?: () => void) => cb?.() }),
+  parallel: (animations: Array<{ start: (cb?: () => void) => void }>) => ({
+    start: (cb?: () => void) => {
+      animations.forEach((a) => a.start());
+      cb?.();
+    },
+  }),
+  sequence: (animations: Array<{ start: (cb?: () => void) => void }>) => ({
+    start: (cb?: () => void) => {
+      animations.forEach((a) => a.start());
+      cb?.();
+    },
+  }),
+  loop: () => ({ start: () => {} }),
+  createAnimatedComponent: <P,>(C: React.ComponentType<P>) => C,
+  event: () => () => {},
+};
+
+export const Easing = {
+  linear: (t: number) => t,
+  ease: (t: number) => t,
+  in: (e: (t: number) => number) => e,
+  out: (e: (t: number) => number) => e,
+  inOut: (e: (t: number) => number) => e,
+};
+
+export const Alert = {
+  alert: () => {},
+  prompt: () => {},
+};
+
+export const StatusBar = createHostComponent("StatusBar");
+
+export const Keyboard = {
+  dismiss: () => {},
+  addListener: () => ({ remove: () => {} }),
+  removeListener: () => {},
+};
+
+export const InteractionManager = {
+  runAfterInteractions: (cb: () => void) => {
+    cb();
+    return { cancel: () => {} };
+  },
+  createInteractionHandle: () => 0,
+  clearInteractionHandle: () => {},
+};
+
+export const NativeModules: Record<string, unknown> = {};
+
+export default {
+  View,
+  Text,
+  Pressable,
+  TouchableOpacity,
+  TouchableHighlight,
+  TouchableWithoutFeedback,
+  ScrollView,
+  SafeAreaView,
+  Image,
+  TextInput,
+  Switch,
+  Modal,
+  ActivityIndicator,
+  KeyboardAvoidingView,
+  RefreshControl,
+  FlatList,
+  StyleSheet,
+  Platform,
+  Dimensions,
+  PixelRatio,
+  Animated,
+  Easing,
+  Alert,
+  StatusBar,
+  Keyboard,
+  InteractionManager,
+  NativeModules,
+};

package/src/mocks/safe-area-context.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+
+const passthrough = (props: { children?: React.ReactNode }) =>
+  React.createElement(React.Fragment, null, props.children);
+
+export const SafeAreaProvider = passthrough;
+export const SafeAreaView = passthrough;
+export const SafeAreaInsetsContext = React.createContext({ top: 0, right: 0, bottom: 0, left: 0 });
+export const SafeAreaFrameContext = React.createContext({ x: 0, y: 0, width: 390, height: 844 });
+export const useSafeAreaInsets = () => ({ top: 0, right: 0, bottom: 0, left: 0 });
+export const useSafeAreaFrame = () => ({ x: 0, y: 0, width: 390, height: 844 });
+export const initialWindowMetrics = {
+  insets: { top: 0, right: 0, bottom: 0, left: 0 },
+  frame: { x: 0, y: 0, width: 390, height: 844 },
+};

package/src/queries.ts

@@ -0,0 +1,66 @@
+import type { ReactTestInstance } from "react-test-renderer";
+
+/**
+ * Find the first node whose direct text content matches `matcher`. Walks the
+ * tree and looks for Text nodes whose children stringify to the matcher.
+ *
+ * Mirrors the spirit of testing-library's getByText without pulling the
+ * whole library in.
+ */
+export function findByText(root: ReactTestInstance, matcher: string | RegExp): ReactTestInstance {
+  const node = queryByText(root, matcher);
+  if (!node) {
+    throw new Error(
+      `findByText(): no node found matching ${matcher instanceof RegExp ? matcher.toString() : JSON.stringify(matcher)}`,
+    );
+  }
+  return node;
+}
+
+export function queryByText(root: ReactTestInstance, matcher: string | RegExp): ReactTestInstance | null {
+  const matches = (haystack: string): boolean =>
+    typeof matcher === "string" ? haystack === matcher : matcher.test(haystack);
+
+  const visit = (node: ReactTestInstance): ReactTestInstance | null => {
+    const typeName = typeof node.type === "string" ? node.type : (node.type as { displayName?: string }).displayName ?? "";
+    if (typeName === "Text") {
+      const direct = textOf(node.props?.children);
+      if (matches(direct)) return node;
+    }
+    for (const child of node.children ?? []) {
+      if (typeof child === "string") {
+        if (typeName === "Text" && matches(child)) return node;
+        continue;
+      }
+      const found = visit(child);
+      if (found) return found;
+    }
+    return null;
+  };
+
+  return visit(root);
+}
+
+/**
+ * Find all rendered nodes whose displayName/type matches the given name.
+ * E.g. findAllByType(root, 'Text') returns every Text node.
+ */
+export function findAllByType(root: ReactTestInstance, typeName: string): ReactTestInstance[] {
+  const out: ReactTestInstance[] = [];
+  const visit = (node: ReactTestInstance) => {
+    const t = typeof node.type === "string" ? node.type : (node.type as { displayName?: string }).displayName ?? "";
+    if (t === typeName) out.push(node);
+    for (const child of node.children ?? []) {
+      if (typeof child !== "string") visit(child);
+    }
+  };
+  visit(root);
+  return out;
+}
+
+function textOf(value: unknown): string {
+  if (value == null) return "";
+  if (typeof value === "string" || typeof value === "number") return String(value);
+  if (Array.isArray(value)) return value.map(textOf).join("");
+  return "";
+}

package/src/render.ts

@@ -0,0 +1,64 @@
+import * as React from "react";
+import TestRenderer from "react-test-renderer";
+import type { ReactTestInstance, ReactTestRenderer } from "react-test-renderer";
+
+export interface RenderOptions {
+  /**
+   * Override or extend the auto-stubbed scope for this render. Keys are bare
+   * specifiers that the component imports (e.g. '@newscast/app-hooks'); values
+   * are the modules the component will receive when it require()s that key.
+   *
+   * The runner already auto-stubs everything the component imports with empty
+   * objects; use this to set specific return values (e.g. simulate
+   * `useAuth() === { isAuthenticated: true }`).
+   */
+  scope?: Record<string, unknown>;
+}
+
+export interface RenderResult {
+  root: ReactTestInstance;
+  renderer: ReactTestRenderer;
+  /** Re-render with new props. */
+  update: (next: React.ReactElement) => void;
+  /** Tear down. Tests don't usually need to call this; the runner does it. */
+  unmount: () => void;
+  /**
+   * Convenience: get the rendered tree as a serializable JSON snapshot. Useful
+   * when a test wants to assert on overall shape rather than poking specific
+   * nodes.
+   */
+  toJSON: () => unknown;
+}
+
+/**
+ * Mount a component using react-test-renderer with `act()` semantics.
+ *
+ * `RenderOptions.scope` is currently a hint surface only — the actual scope
+ * is wired up by the runner before render() is called (see runTest.ts), so
+ * passing scope here when calling render() directly in a test file is a no-op
+ * unless the runner is honoring it. The runner DOES merge scope from the
+ * second arg, so use it to control what hooks / modules the component sees.
+ */
+export function render(element: React.ReactElement, _opts: RenderOptions = {}): RenderResult {
+  let renderer!: ReactTestRenderer;
+  TestRenderer.act(() => {
+    renderer = TestRenderer.create(element);
+  });
+  return {
+    root: renderer.root,
+    renderer,
+    update(next: React.ReactElement) {
+      TestRenderer.act(() => {
+        renderer.update(next);
+      });
+    },
+    unmount() {
+      TestRenderer.act(() => {
+        renderer.unmount();
+      });
+    },
+    toJSON() {
+      return renderer.toJSON();
+    },
+  };
+}