wip

Author: mdjastrzebski

examples/cookbook/.eslintrc

@@ -3,6 +3,6 @@
   "rules": {
     "react-native-a11y/has-valid-accessibility-ignores-invert-colors": "off",
     "react-native/no-color-literals": "off",
-    "react-native-a11y/has-valid-accessibility-descriptors": "off",
+    "react-native-a11y/has-valid-accessibility-descriptors": "off"
   }
 }

examples/cookbook/README.md

@@ -3,6 +3,7 @@
 </p>
 
 # React Native Testing Library Cookbook App
+
 Welcome to the React Native Testing Library (RNTL) Cookbook! This app is designed to provide developers with a collection of best practices, ready-made recipes, and tips & tricks to help you effectively test your React Native applications. Whether you’re just starting out with testing or looking to deepen your skills, this cookbook offers something for everyone.
 
 Each recipe described in the Cookbook should have a corresponding code example screen in this repo.
@@ -12,19 +13,22 @@ Since examples will showcase usage of different dependencies, the dependencies i
 file will grow much larger that in a normal React Native. This is fine 🐶☕️🔥.
 
 ## Running the App
+
 1. Clone the repo `git clone [email protected]:callstack/react-native-testing-library.git`
 2. Go to the `examples/cookbook` directory `cd examples/cookbook`
 3. Install dependencies `yarn`
 4. Run the app `yarn start`
 5. Run the app either on iOS or Android by clicking on `i` or `a` in the terminal.
 
 ## How to Contribute
+
 We invite all developers, from beginners to experts, to contribute your own recipes! If you have a clever solution, best practice, or useful tip, we encourage you to:
 
 1. Submit a Pull Request with your recipe.
 2. Join the conversation on GitHub [here](https://github.com/callstack/react-native-testing-library/issues/1624) to discuss ideas, ask questions, or provide feedback.
 
 ## Screenshots From the App
+
 | Home Screen                                           | Phonebook with Net. Req. Example                                |
-|-------------------------------------------------------|-----------------------------------------------------------------|
+| ----------------------------------------------------- | --------------------------------------------------------------- |
 | ![home-screenshot](assets/readme/home-screenshot.png) | ![phonebook-screenshot](assets/readme/phonebook-screenshot.png) |

examples/cookbook/app/network-requests/__tests__/test-utils.ts

@@ -1,6 +1,6 @@
 import { User } from '../types';
-import {http, HttpResponse} from "msw";
-import {setupServer} from "msw/node";
+import { http, HttpResponse } from 'msw';
+import { setupServer } from 'msw/node';
 
 // Define request handlers and response resolvers for random user API.
 // By default, we always return the happy path response.

flow-typed/npm/jest_v26.x.x.js

@@ -54,17 +54,13 @@ type JestMockFn<TArguments: $ReadOnlyArray<*>, TReturn> = {
    * that come from itself -- the only difference is that the implementation
    * will also be executed when the mock is called.
    */
-  mockImplementation(
-    fn: (...args: TArguments) => TReturn
-  ): JestMockFn<TArguments, TReturn>,
+  mockImplementation(fn: (...args: TArguments) => TReturn): JestMockFn<TArguments, TReturn>,
   /**
    * Accepts a function that will be used as an implementation of the mock for
    * one call to the mocked function. Can be chained so that multiple function
    * calls produce different results.
    */
-  mockImplementationOnce(
-    fn: (...args: TArguments) => TReturn
-  ): JestMockFn<TArguments, TReturn>,
+  mockImplementationOnce(fn: (...args: TArguments) => TReturn): JestMockFn<TArguments, TReturn>,
   /**
    * Accepts a string to use in test result output in place of "jest.fn()" to
    * indicate which mock function is being referenced.
@@ -89,9 +85,7 @@ type JestMockFn<TArguments: $ReadOnlyArray<*>, TReturn> = {
   /**
    * Sugar for jest.fn().mockImplementationOnce(() => Promise.resolve(value))
    */
-  mockResolvedValueOnce(
-    value: TReturn
-  ): JestMockFn<TArguments, Promise<TReturn>>,
+  mockResolvedValueOnce(value: TReturn): JestMockFn<TArguments, Promise<TReturn>>,
   /**
    * Sugar for jest.fn().mockImplementation(() => Promise.reject(value))
    */
@@ -182,7 +176,7 @@ type JestStyledComponentsMatchersType = {
   toHaveStyleRule(
     property: string,
     value: JestStyledComponentsMatcherValue,
-    options?: JestStyledComponentsMatcherOptions
+    options?: JestStyledComponentsMatcherOptions,
   ): void,
   ...
 };
@@ -205,20 +199,17 @@ type EnzymeMatchersType = {
   toExist(): void,
   toHaveClassName(className: string): void,
   toHaveHTML(html: string): void,
-  toHaveProp: ((propKey: string, propValue?: any) => void) &
-    ((props: { ... }) => void),
+  toHaveProp: ((propKey: string, propValue?: any) => void) & ((props: { ... }) => void),
   toHaveRef(refName: string): void,
-  toHaveState: ((stateKey: string, stateValue?: any) => void) &
-    ((state: { ... }) => void),
-  toHaveStyle: ((styleKey: string, styleValue?: any) => void) &
-    ((style: { ... }) => void),
+  toHaveState: ((stateKey: string, stateValue?: any) => void) & ((state: { ... }) => void),
+  toHaveStyle: ((styleKey: string, styleValue?: any) => void) & ((style: { ... }) => void),
   toHaveTagName(tagName: string): void,
   toHaveText(text: string): void,
   toHaveValue(value: any): void,
   toIncludeText(text: string): void,
   toMatchElement(
     element: React$Element<any>,
-    options?: {| ignoreProps?: boolean, verbose?: boolean |}
+    options?: {| ignoreProps?: boolean, verbose?: boolean |},
   ): void,
   toMatchSelector(selector: string): void,
   // 7.x
@@ -250,10 +241,7 @@ type DomTestingLibraryType = {
   toHaveFocus(): void,
   toHaveFormValues(expectedValues: { [name: string]: any, ... }): void,
   toHaveStyle(css: string | { [name: string]: any, ... }): void,
-  toHaveTextContent(
-    text: string | RegExp,
-    options?: {| normalizeWhitespace: boolean |}
-  ): void,
+  toHaveTextContent(text: string | RegExp, options?: {| normalizeWhitespace: boolean |}): void,
   toHaveValue(value?: string | string[] | number): void,
 
   // 5.x
@@ -562,7 +550,7 @@ type SnapshotDiffType = {
       aAnnotation?: string,
       bAnnotation?: string,
     |},
-    testName?: string
+    testName?: string,
   ): void,
   ...
 };
@@ -816,7 +804,7 @@ type JestObjectType = {
    * implementation.
    */
   fn<TArguments: $ReadOnlyArray<*>, TReturn>(
-    implementation?: (...args: TArguments) => TReturn
+    implementation?: (...args: TArguments) => TReturn,
   ): JestMockFn<TArguments, TReturn>,
   /**
    * Determines if the given function is a mocked function.
@@ -836,11 +824,7 @@ type JestObjectType = {
    * The third argument can be used to create virtual mocks -- mocks of modules
    * that don't exist anywhere in the system.
    */
-  mock(
-    moduleName: string,
-    moduleFactory?: any,
-    options?: Object
-  ): JestObjectType,
+  mock(moduleName: string, moduleFactory?: any, options?: Object): JestObjectType,
   /**
    * Returns the actual module instead of a mock, bypassing all checks on
    * whether the module should receive a mock implementation or not.
@@ -920,11 +904,7 @@ type JestObjectType = {
    * Creates a mock function similar to jest.fn but also tracks calls to
    * object[methodName].
    */
-  spyOn(
-    object: Object,
-    methodName: string,
-    accessType?: 'get' | 'set'
-  ): JestMockFn<any, any>,
+  spyOn(object: Object, methodName: string, accessType?: 'get' | 'set'): JestMockFn<any, any>,
   /**
    * Set the default timeout interval for tests and before/after hooks in milliseconds.
    * Note: The default timeout interval is 5 seconds if this method is not called.
@@ -941,25 +921,13 @@ type JestDoneFn = {|
 |};
 
 /** Runs this function after every test inside this context */
-declare function afterEach(
-  fn: (done: JestDoneFn) => ?Promise<mixed>,
-  timeout?: number
-): void;
+declare function afterEach(fn: (done: JestDoneFn) => ?Promise<mixed>, timeout?: number): void;
 /** Runs this function before every test inside this context */
-declare function beforeEach(
-  fn: (done: JestDoneFn) => ?Promise<mixed>,
-  timeout?: number
-): void;
+declare function beforeEach(fn: (done: JestDoneFn) => ?Promise<mixed>, timeout?: number): void;
 /** Runs this function after all tests have finished inside this context */
-declare function afterAll(
-  fn: (done: JestDoneFn) => ?Promise<mixed>,
-  timeout?: number
-): void;
+declare function afterAll(fn: (done: JestDoneFn) => ?Promise<mixed>, timeout?: number): void;
 /** Runs this function before any tests have started inside this context */
-declare function beforeAll(
-  fn: (done: JestDoneFn) => ?Promise<mixed>,
-  timeout?: number
-): void;
+declare function beforeAll(fn: (done: JestDoneFn) => ?Promise<mixed>, timeout?: number): void;
 
 /** A context for grouping tests together */
 declare var describe: {
@@ -982,11 +950,7 @@ declare var describe: {
    */
   each(
     ...table: Array<Array<mixed> | mixed> | [Array<string>, string]
-  ): (
-    name: JestTestName,
-    fn?: (...args: Array<any>) => ?Promise<mixed>,
-    timeout?: number
-  ) => void,
+  ): (name: JestTestName, fn?: (...args: Array<any>) => ?Promise<mixed>, timeout?: number) => void,
   ...
 };
 
@@ -999,11 +963,7 @@ declare var it: {
    * @param {Function} Test
    * @param {number} Timeout for the test, in milliseconds.
    */
-  (
-    name: JestTestName,
-    fn?: (done: JestDoneFn) => ?Promise<mixed>,
-    timeout?: number
-  ): void,
+  (name: JestTestName, fn?: (done: JestDoneFn) => ?Promise<mixed>, timeout?: number): void,
   /**
    * Only run this test
    *
@@ -1012,17 +972,13 @@ declare var it: {
    * @param {number} Timeout for the test, in milliseconds.
    */
   only: {|
-    (
-      name: JestTestName,
-      fn?: (done: JestDoneFn) => ?Promise<mixed>,
-      timeout?: number
-    ): void,
+    (name: JestTestName, fn?: (done: JestDoneFn) => ?Promise<mixed>, timeout?: number): void,
     each(
       ...table: Array<Array<mixed> | mixed> | [Array<string>, string]
     ): (
       name: JestTestName,
       fn?: (...args: Array<any>) => ?Promise<mixed>,
-      timeout?: number
+      timeout?: number,
     ) => void,
   |},
   /**
@@ -1032,11 +988,7 @@ declare var it: {
    * @param {Function} Test
    * @param {number} Timeout for the test, in milliseconds.
    */
-  skip(
-    name: JestTestName,
-    fn?: (done: JestDoneFn) => ?Promise<mixed>,
-    timeout?: number
-  ): void,
+  skip(name: JestTestName, fn?: (done: JestDoneFn) => ?Promise<mixed>, timeout?: number): void,
   /**
    * Highlight planned tests in the summary output
    *
@@ -1053,7 +1005,7 @@ declare var it: {
   concurrent(
     name: JestTestName,
     fn?: (done: JestDoneFn) => ?Promise<mixed>,
-    timeout?: number
+    timeout?: number,
   ): void,
   /**
    * each runs this test against array of argument arrays per each run
@@ -1062,18 +1014,14 @@ declare var it: {
    */
   each(
     ...table: Array<Array<mixed> | mixed> | [Array<string>, string]
-  ): (
-    name: JestTestName,
-    fn?: (...args: Array<any>) => ?Promise<mixed>,
-    timeout?: number
-  ) => void,
+  ): (name: JestTestName, fn?: (...args: Array<any>) => ?Promise<mixed>, timeout?: number) => void,
   ...
 };
 
 declare function fit(
   name: JestTestName,
   fn: (done: JestDoneFn) => ?Promise<mixed>,
-  timeout?: number
+  timeout?: number,
 ): void;
 /** An individual test unit */
 declare var test: typeof it;
@@ -1146,7 +1094,7 @@ type JestPrettyFormatPlugin = {
     serialize: JestPrettyFormatPrint,
     indent: JestPrettyFormatIndent,
     opts: JestPrettyFormatOptions,
-    colors: JestPrettyFormatColors
+    colors: JestPrettyFormatColors,
   ) => string,
   test: (any) => boolean,
   ...
@@ -1158,7 +1106,7 @@ type JestPrettyFormatPlugins = Array<JestPrettyFormatPlugin>;
 declare var expect: {
   /** The object that you want to make assertions against */
   (
-    value: any
+    value: any,
   ): JestExpectType &
     JestPromiseType &
     EnzymeMatchersType &
@@ -1210,7 +1158,7 @@ declare var jasmine: {
   createSpy(name: string): JestSpyType,
   createSpyObj(
     baseName: string,
-    methodNames: Array<string>
+    methodNames: Array<string>,
   ): { [methodName: string]: JestSpyType, ... },
   objectContaining(value: Object): Object,
   stringMatching(value: string): string,

flow-typed/npm/react-test-renderer_v16.x.x.js

@@ -31,15 +31,12 @@ type ReactTestInstance = {
 
   findAll(
     predicate: (node: ReactTestInstance) => boolean,
-    options?: { deep: boolean }
-  ): ReactTestInstance[],
-  findAllByType(
-    type: React$ElementType,
-    options?: { deep: boolean }
+    options?: { deep: boolean },
   ): ReactTestInstance[],
+  findAllByType(type: React$ElementType, options?: { deep: boolean }): ReactTestInstance[],
   findAllByProps(
     props: { [propName: string]: any },
-    options?: { deep: boolean }
+    options?: { deep: boolean },
   ): ReactTestInstance[],
 };
 
@@ -63,7 +60,7 @@ declare module 'react-test-renderer' {
 
   declare function create(
     nextElement: React$Element<any>,
-    options?: TestRendererOptions
+    options?: TestRendererOptions,
   ): ReactTestRenderer;
 
   declare function act(callback: () => void): Thenable;

package.json

@@ -93,7 +93,7 @@
     "release-it": "^18.0.0",
     "typescript": "^5.6.3",
     "typescript-eslint": "^8.19.1",
-    "universal-test-renderer": "0.7.0"
+    "universal-test-renderer": "0.8.1"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org"