diff --git a/.all-contributorsrc b/.all-contributorsrc index 30ce8af..d4f8f20 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -1,6 +1,6 @@ { "projectName": "jest-native", - "projectOwner": "bcarroll22", + "projectOwner": "testing-library", "repoType": "github", "repoHost": "https://github.com", "files": [ diff --git a/.travis.yml b/.travis.yml index 991320a..dcbf989 100644 --- a/.travis.yml +++ b/.travis.yml @@ -11,12 +11,11 @@ cache: - coverage notifications: email: false -install: npm install -script: npm run test:coverage +install: npm install && npm install -g codecov +script: npm run test:coverage && codecov jobs: include: - stage: release if: branch = master AND type != pull_request node_js: '10' - install: npm install -g codecov - script: codecov && npm run semantic-release + script: npm run semantic-release diff --git a/README.md b/README.md index fe9c88a..5c6a7fb 100644 --- a/README.md +++ b/README.md @@ -6,7 +6,7 @@ height="80" width="80" alt="goat" - src="https://raw.githubusercontent.com/bcarroll22/jest-native/master/other/eagle.png" + src="https://raw.githubusercontent.com/testing-library/jest-native/master/other/eagle.png" /> @@ -15,35 +15,37 @@
-[![Build Status](https://travis-ci.org/bcarroll22/jest-native.svg?branch=master)](https://travis-ci.org/bcarroll22/jest-native) -[![Code Coverage](https://img.shields.io/codecov/c/github/bcarroll22/jest-native.svg?style=flat-square)](https://codecov.io/github/bcarroll22/jest-native) +[![Build Status](https://travis-ci.org/testing-library/jest-native.svg?branch=master)](https://travis-ci.org/testing-library/jest-native) +[![Code Coverage](https://img.shields.io/codecov/c/github/testing-library/jest-native.svg?style=flat-square)](https://codecov.io/github/testing-library/jest-native) [![version](https://img.shields.io/npm/v/jest-native.svg?style=flat-square)](https://www.npmjs.com/package/jest-native) [![downloads](https://img.shields.io/npm/dm/jest-native.svg?style=flat-square)](http://www.npmtrends.com/jest-native) -[![MIT License](https://img.shields.io/npm/l/jest-native.svg?style=flat-square)](https://github.com/bcarroll22/jest-native/blob/master/LICENSE) +[![MIT License](https://img.shields.io/npm/l/jest-native.svg?style=flat-square)](https://github.com/testing-library/jest-native/blob/master/LICENSE) [![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors) [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) -[![Code of Conduct](https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square)](https://github.com/bcarroll22/jest-native/blob/master/CODE_OF_CONDUCT.md) +[![Code of Conduct](https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square)](https://github.com/testing-library/jest-native/blob/master/CODE_OF_CONDUCT.md) -[![Watch on GitHub](https://img.shields.io/github/watchers/bcarroll22/jest-native.svg?style=social)](https://github.com/bcarroll22/jest-native/watchers) -[![Star on GitHub](https://img.shields.io/github/stars/bcarroll22/jest-native.svg?style=social)](https://github.com/bcarroll22/jest-native/stargazers) +[![Watch on GitHub](https://img.shields.io/github/watchers/testing-library/jest-native.svg?style=social)](https://github.com/testing-library/jest-native/watchers) +[![Star on GitHub](https://img.shields.io/github/stars/testing-library/jest-native.svg?style=social)](https://github.com/testing-library/jest-native/stargazers) + ## Table of Contents - [The problem](#the-problem) - [This solution](#this-solution) +- [Compatibility](#compatibility) - [Installation](#installation) - [Usage](#usage) - [Matchers](#matchers) - [`toBeDisabled`](#tobedisabled) - [`toBeEnabled`](#tobeenabled) - [`toBeEmpty`](#tobeempty) - - [`toContainElement(element)`](#tocontainelementelement) - - [`toHaveProp(prop, value)`](#tohavepropprop-value) - - [`toHaveTextContent(text)`](#tohavetextcontenttext) - - [`toHaveStyle(styles)`](#tohavestylestyles) + - [`toContainElement`](#tocontainelementelement) + - [`toHaveProp`](#tohavepropprop-value) + - [`toHaveTextContent`](#tohavetextcontenttext) + - [`toHaveStyle`](#tohavestylestyles) - [Inspiration](#inspiration) - [Other solutions](#other-solutions) - [Contributors](#contributors) @@ -53,7 +55,7 @@ ## The problem You want to use [jest](https://facebook.github.io/jest/) to write tests that assert various things -about the state of a React Native tree. As part of that goal, you want to avoid all the repetitive +about the state of a React Native app. As part of that goal, you want to avoid all the repetitive patterns that arise in doing so like checking for a native element's props, its text content, its styles, and more. @@ -62,6 +64,14 @@ styles, and more. The `jest-native` library provides a set of custom jest matchers that you can use to extend jest. These will make your tests more declarative, clear to read and to maintain. +## Compatibility + +These matchers should, for the most part, be agnostic enough to work with any React Native testing +utilities, but they are primarily intended to be used with +[native-testing-library](https://github.com/testing-library/native-testing-library). Any issues +raised with existing matchers or any newly proposed matchers must be viewed through compatibility +with that library and its guiding principles first. + ## Installation This module should be installed as one of your project's `devDependencies`: @@ -162,10 +172,10 @@ const { getByTestId } = render(); expect(getByTestId('empty')).toBeEmpty(); ``` -### `toContainElement(element)` +### `toContainElement` -```javascript -toContainElement(); +```typescript +toContainElement(element: ReactTestInstance | null); ``` Check if an element contains another element as a descendant. Again, will only work for native @@ -195,10 +205,10 @@ expect(parent).toContainElement(child); expect(parent).not.toContainElement(grandparent); ``` -### `toHaveProp(prop, value)` +### `toHaveProp` -```javascript -toHaveProp(prop, value); +```typescript +toHaveProp(prop: string, value?: any); ``` Check that an element has a given prop. Only works for native elements, so this is similar to @@ -224,10 +234,10 @@ expect(queryByTestId('button')).not.toHaveProp('disabled'); expect(queryByTestId('button')).not.toHaveProp('title', 'ok'); ``` -### `toHaveTextContent(text)` +### `toHaveTextContent` -```javascript -toHaveTextContent(text); +```typescript +toHaveTextContent(text: string | RegExp, options?: { normalizeWhitespace: boolean }); ``` Check if an element has the supplied text. @@ -248,10 +258,10 @@ expect(queryByTestId('count-value')).toHaveTextContent(/2/); expect(queryByTestId('count-value')).not.toHaveTextContent('21'); ``` -### `toHaveStyle(styles)` +### `toHaveStyle` ```javascript -toHaveStyle(styles); +toHaveStyle(style: object[] | object); ``` Check if an element has the supplied styles. @@ -279,7 +289,7 @@ expect(queryByText('Hello World')).not.toHaveStyle({ color: 'white' }); ## Inspiration This library was made to be a companion for -[native-testing-library](https://github.com/bcarroll22/native-testing-library). +[native-testing-library](https://github.com/testing-library/native-testing-library). It was inspired by [jest-dom](https://github.com/gnapse/jest-dom/), the companion library for [dom-testing-library](https://github.com/kentcdodds/dom-testing-library/). We emulated as many of @@ -295,7 +305,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d -
Brandon Carroll
Brandon Carroll
💻 📖 🚇 ⚠️
+
Brandon Carroll
Brandon Carroll
💻 📖 🚇 ⚠️
diff --git a/babel.config.js b/babel.config.js index f842b77..7a0856d 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,3 +1,8 @@ module.exports = { presets: ['module:metro-react-native-babel-preset'], + overrides: [ + { + compact: false, + }, + ], }; diff --git a/extend-expect.d.ts b/extend-expect.d.ts new file mode 100644 index 0000000..f0ce3a1 --- /dev/null +++ b/extend-expect.d.ts @@ -0,0 +1,13 @@ +import { ReactTestInstance } from 'react-test-renderer'; + +declare namespace jest { + interface Matchers { + toBeDisabled(): R; + toContainElement(element: ReactTestInstance | null): R; + toBeEmpty(): R; + toHaveProp(attr: string, value?: any): R; + toHaveTextContent(text: string | RegExp, options?: { normalizeWhitespace: boolean }): R; + toBeEnabled(): R; + toHaveStyle(style: object[] | object): R; + } +} diff --git a/jest.config.js b/jest.config.js index 18a55c9..cf05928 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,8 +1,7 @@ const ignores = ['/node_modules/', '/__tests__/helpers/', '__mocks__']; module.exports = { - preset: 'react-native', - transformIgnorePatterns: ['node_modules/(?!(react-native.*|@?react-navigation.*)/)'], + preset: 'native-testing-library', setupFilesAfterEnv: ['/setup-tests.js'], collectCoverageFrom: ['src/**/*.+(js|jsx|ts|tsx)'], testMatch: ['**/__tests__/**/*.+(js|jsx|ts|tsx)'], diff --git a/package.json b/package.json index 5533c25..2d96f2d 100644 --- a/package.json +++ b/package.json @@ -9,13 +9,17 @@ "commit:all": "npm run commit:add && npm run commit", "readme:toc": "doctoc README.md --maxlevel 3 --title '## Table of Contents'", "test": "jest", - "pretty-quick": "pretty-quick --staged --pattern '**/*.(js|jsx|ts|tsx)'", + "pretty-quick": "pretty-quick --staged", "prepublishOnly": "rm -rf dist; babel src --out-dir dist --ignore 'src/__tests__/*'", "semantic-release": "semantic-release", "test:coverage": "jest --coverage", "test:watch": "jest --watch --coverage" }, - "files": ["dist"], + "files": [ + "dist", + "extend-expect.js", + "extend-expect.d.ts" + ], "keywords": [ "testing", "native-testing-library", @@ -28,6 +32,7 @@ "jest-matcher-utils": "^24.0.0", "ramda": "^0.26.1", "pretty-format": "^24.0.0", + "react-test-renderer": "^16.8.0", "redent": "^2.0.0" }, "devDependencies": { @@ -39,7 +44,7 @@ "husky": "^1.3.1", "jest": "^24.7.1", "metro-react-native-babel-preset": "^0.52.0", - "native-testing-library": "^1.5.0", + "native-testing-library": "^3.0.0", "prettier": "^1.16.4", "pretty-quick": "^1.10.0", "react": "16.8.3", @@ -47,9 +52,8 @@ "semantic-release": "^15.13.3" }, "peerDependencies": { - "native-testing-library": "^1.2.0", "react": "*", - "react-native": "*" + "react-native": ">0.55" }, "husky": { "hooks": { @@ -79,12 +83,12 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/bcarroll22/jest-native.git" + "url": "git+https://github.com/testing-library/jest-native.git" }, "author": "Brandon Carroll", "license": "MIT", "bugs": { - "url": "https://github.com/bcarroll22/jest-native/issues" + "url": "https://github.com/testing-library/jest-native/issues" }, - "homepage": "https://github.com/bcarroll22/jest-native#readme" + "homepage": "https://github.com/testing-library/jest-native#readme" } diff --git a/setup-tests.js b/setup-tests.js index 4e9ceae..79323c1 100644 --- a/setup-tests.js +++ b/setup-tests.js @@ -1,4 +1,5 @@ import { plugins } from 'pretty-format'; + import './src/extend-expect'; expect.addSnapshotSerializer(plugins.ConvertAnsi); diff --git a/src/__tests__/to-be-disabled.js b/src/__tests__/to-be-disabled.js index 585b91b..f049344 100644 --- a/src/__tests__/to-be-disabled.js +++ b/src/__tests__/to-be-disabled.js @@ -10,7 +10,7 @@ import { import { render } from 'native-testing-library'; test('.toBeDisabled', () => { - const { queryByTestId, queryByText } = render( + const { queryByTestId, queryByText, queryByTitle } = render(