{"bugs":{"url":"https://github.com/expo/expo/issues"},"dist":{"shasum":"588f01151efaa6782458fc017750b63ea6f3ae85","tarball":"https://registry.npmjs.org/jest-expo-enzyme/-/jest-expo-enzyme-1.2.2.tgz","fileCount":19,"integrity":"sha512-ioCSvuCqfiSErNI/S4ptGMr6Vnjc/gkRk3hgygfxuKfv2S9DYNokPq2t5HB68MWYaw19sJIjMwQ6QZqTvniqvw==","signatures":[{"sig":"MEQCID1hUybw8WYXOXoQ3S3fF1PIW25fOgkjyK6qoPA4aBztAiBhxklVL55i8pECkj6uJi96Pg+qIK6PsDy9YvqSk890Ng==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":24833},"jest":{"preset":"jest-expo-enzyme"},"main":"build/index.js","name":"jest-expo-enzyme","types":"build/index.d.ts","readme":"# jest-expo-enzyme\n\nA [Jest](https://facebook.github.io/jest/) preset that enables you to test your universal Expo & React elements with the [**Enzyme**](https://airbnb.io/enzyme/) testing library.\n\nThe default preset extends `jest-expo` which means it will run **iOS, Android, and web** platforms with the recommended Enzyme configs for web and native. Notice that we omit the `node` runner because SSR environments don't need to test how virtual DOM is rendered.\n\n## Installation\n\n- `yarn add jest-expo-enzyme --dev` or `npm i jest-expo-enzyme --save-dev`\n- Add the following config to `package.json`:\n\n  ```js\n  \"scripts\": {\n    \"test\": \"jest\",\n  },\n  \"jest\": {\n    \"preset\": \"jest-expo-enzyme\"\n  }\n  ```\n\n- Create a `__tests__` directory anywhere you like and a `Example-test.js` file inside of it, and add this code:\n\n  ```js\n  it('works', () => {\n    expect(1).toBe(1);\n  });\n  ```\n\n- Run `yarn test` or `npm test` and it should pass\n\n## Enzyme Example\n\nThe main benefit of using this preset is to get universal Enzyme support for testing your virtual DOM. Here is a basic example of testing how the `backgroundColor` property of a View style is rendered across iOS, Android, and web.\n\n```js\nimport { shallow } from 'enzyme';\nimport React from 'react';\nimport { View, StyleSheet, Platform } from 'react-native';\n\nit(`renders a view with a custom background`, () => {\n  const component = shallow(<View style={{ backgroundColor: 'rgba(0,0,0,0.5)' }} />);\n  // To debug your component use this:\n  console.log('Component:', component.debug({ verbose: true }));\n\n  // When snapshot testing, you should always try and be as concise as possible\n  // here we are extracting the style prop from `View` on native and `div` on web\n  const prop = component.find(Platform.select({ default: 'View', web: 'div' })).prop('style');\n\n  // Flatten the style so we can read it as an object\n  const style = StyleSheet.flatten(prop);\n\n  /**\n   * Android: exports[`renders a view with a custom background 1`] = `\"rgba(0,0,0,0.5)\"`;\n   * iOS: exports[`renders a view with a custom background 1`] = `\"rgba(0,0,0,0.5)\"`;\n   * web: exports[`renders a view with a custom background 1`] = `\"rgba(0,0,0,0.50)\"`;\n   */\n  expect(style.backgroundColor).toMatchSnapshot();\n});\n```\n\n## Customization\n\nWhen constructing your tests you will more than likely want to build them one platform at a time. To do this you'll want to create a `jest.config.js` with multiple platforms.\n\nThis is done by specifying a separate Jest config in the `projects` field of your custom Jest config. The `withEnzyme` method's purpose is to let you augment each single-platform Jest config with the configuration fields needed to support Enzyme.\n\nThis is why method `withEnzyme` exists.\n\nYou can use `withEnzyme` to add Enzyme support to an existing Jest config (**important:** this is only officially supported with Jest configs provided by `jest-expo`; mixing with other configs may not work as expected). Also use a custom serializer for the React Native **StyleSheet** API, which will make snapshot tests cleaner and easier to read.\n\n### Usage\n\n1. Create a `jest.config.js` in your root directory and delete the `jest` field in your `package.json`. You can also create any `js` file and pass it to the Jest CLI with the `-c` flag, ex: `yarn jest -c custom.config.js`.\n2. Import the platforms you want to test and add Enzyme support:\n\n```js\nconst { withEnzyme } = require('jest-expo-enzyme');\n\nmodule.exports = {\n  projects: [\n    // Skipping Node because we want to test DOM presets only\n    withEnzyme(require('jest-expo/ios/jest-preset')),\n    withEnzyme(require('jest-expo/android/jest-preset')),\n    // The Enzyme support added to web is different from that added to native, which `withEnzyme` handles\n    // Luckily you won't have to do anything special because it reads the platform from\n    // `haste.defaultPlatform` of the provided Jest config\n    withEnzyme(require('jest-expo/web/jest-preset')),\n  ],\n};\n```\n\n3. Run your tests with this new preset!\n\n### Snapshots\n\n`jest-expo-enzyme` wraps `jest-expo` which means you get access to the advanced multi-platform snapshot system required for truly testing your universal application code.\n\nHere is an example output:\n\n|- `View-test.tsx`\n|-- `__snapshots__/View-test.tsx.snap.android`\n|-- `__snapshots__/View-test.tsx.snap.ios`\n|-- `__snapshots__/View-test.tsx.snap.node`\n|-- `__snapshots__/View-test.tsx.snap.web`\n\n### Extensions\n\nTo test specific platforms you can use the following extensions:\n\n- iOS: `-test.ios.*`, `-test.native.*`\n- Android: `-test.android.*`, `-test.native.*`\n- web: `-test.web.*`\n- Node: `-test.node.*`, `-test.web.*`\n","gitHead":"1fffde73411ee7a642b98f1506a8de921805d52b","license":"MIT","scripts":{"lint":"expo-module lint","test":"expo-module test","build":"expo-module build","clean":"expo-module clean","prepare":"expo-module prepare","expo-module":"expo-module","prepublishOnly":"expo-module prepublishOnly"},"_npmUser":{"name":"tsapeta","email":"npm@tsapeta.com"},"homepage":"https://github.com/expo/expo/tree/master/packages/jest-expo-enzyme","keywords":["react-native","react-native-web","enzyme","jest","testing","react-test-renderer","react","universal"],"repository":{"url":"git://github.com/expo/expo.git","type":"git","directory":"packages/jest-expo-enzyme"},"_npmVersion":"6.14.13","description":"A Jest preset that enables you to test your universal Expo & React elements with the Enzyme testing library.","directories":{},"maintainers":[{"name":"fiber-god","email":"datwheat@gmail.com"},{"name":"ide","email":"ide+npm@jameside.com"},{"name":"brentvatne","email":"brentvatne@gmail.com"},{"name":"ccheever","email":"ccheever@gmail.com"},{"name":"evanbacon","email":"baconbrix@gmail.com"},{"name":"quinlanj","email":"quinlanjung@gmail.com"},{"name":"esamelson","email":"eric@expo.io"},{"name":"fson","email":"ville.immonen@iki.fi"},{"name":"expoadmin","email":"support@expo.io"},{"name":"charliecruzan","email":"charliecruzan@gmail.com"},{"name":"tsapeta","email":"npm@tsapeta.com"},{"name":"dsokal","email":"dominiksokal@gmail.com"},{"name":"tcdavis","email":"tc@expo.io"},{"name":"exponent","email":"exponent.team@gmail.com"},{"name":"wschurman","email":"wschurman@gmail.com"},{"name":"bbarthec","email":"bartlomiejbukowski.b@gmail.com"},{"name":"jkhales","email":"jonathan@expo.io"},{"name":"wkozyra","email":"wojciech.kozyra@swmansion.com"},{"name":"bycedric","email":"me@bycedric.com"},{"name":"lukmccall","email":"kosmatylukasz@gmail.com"},{"name":"jonsamp","email":"sampjon@gmail.com"},{"name":"princefleaswallow","email":"mhampton@hey.com"},{"name":"andyboythekid","email":"andydevs123@gmail.com"},{"name":"kudochien","email":"ckchien@gmail.com"},{"name":"haydendaly","email":"haydencdaly@gmail.com"}],"sideEffects":true,"_nodeVersion":"16.0.0","dependencies":{"chalk":"^2.4.2","enzyme":"~3.11.0","jest-expo":"~43.0.0-beta.0","jest-enzyme":"~7.1.2","enzyme-to-json":"~3.5.0","jest-canvas-mock":"~2.2.0","react-test-renderer":"~17.0.1","@wojtekmaj/enzyme-adapter-react-17":"^0.6.3"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"@types/enzyme":"^3.10.3","expo-module-scripts":"^2.0.0","@types/enzyme-adapter-react-16":"~1.0.6"},"_npmOperationalInternal":{"tmp":"tmp/jest-expo-enzyme_1.2.2_1632842614605_0.9601613623869669","host":"s3://npm-registry-packages"},"_id":"jest-expo-enzyme@1.2.2","version":"1.2.2"}