{"id":25445498,"url":"https://github.com/rkotze/should-enzyme","last_synced_at":"2025-07-25T13:06:55.264Z","repository":{"id":11134829,"uuid":"68482137","full_name":"rkotze/should-enzyme","owner":"rkotze","description":"Useful functions for testing React Components with Enzyme.","archived":false,"fork":false,"pushed_at":"2022-12-07T17:46:00.000Z","size":440,"stargazers_count":40,"open_issues_count":6,"forks_count":6,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-07-02T05:41:32.925Z","etag":null,"topics":["assertions","bdd","enzyme","mocha","react","react-components","should","tdd","test","testing"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/should-enzyme","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rkotze.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-09-17T22:49:15.000Z","updated_at":"2023-03-13T14:14:54.000Z","dependencies_parsed_at":"2023-01-13T16:21:05.775Z","dependency_job_id":null,"html_url":"https://github.com/rkotze/should-enzyme","commit_stats":null,"previous_names":[],"tags_count":16,"template":false,"template_full_name":null,"purl":"pkg:github/rkotze/should-enzyme","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rkotze%2Fshould-enzyme","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rkotze%2Fshould-enzyme/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rkotze%2Fshould-enzyme/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rkotze%2Fshould-enzyme/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rkotze","download_url":"https://codeload.github.com/rkotze/should-enzyme/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rkotze%2Fshould-enzyme/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267009867,"owners_count":24020686,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-07-25T02:00:09.625Z","response_time":70,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["assertions","bdd","enzyme","mocha","react","react-components","should","tdd","test","testing"],"created_at":"2025-02-17T16:23:12.235Z","updated_at":"2025-07-25T13:06:55.230Z","avatar_url":"https://github.com/rkotze.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# should-enzyme\n\n[![npm version](https://img.shields.io/npm/v/should-enzyme.svg)](https://www.npmjs.com/package/should-enzyme)\n[![Build Status](https://travis-ci.org/rkotze/should-enzyme.svg?branch=master)](https://travis-ci.org/rkotze/should-enzyme)\n\n[should.js](https://shouldjs.github.io/) assertions for [enzyme](https://github.com/airbnb/enzyme)\n\n1. [Install](#install)\n1. [Setup](#setup)\n1. [Assertions](#assertions)\n1. [`attr(key, [value])`](#attrkey-value)\n1. [`checked()`](#checked)\n1. [`className(string)`](#classnamestring)\n1. [`contain(node)`](#containnode)\n1. [`containsText(string)`](#containstextstring)\n1. [`data(key, [value])`](#datakey-value)\n1. [`disabled()`](#disabled)\n1. [`exactClassNames(string)`](#exactclassnamesstring)\n1. [`present()`](#present)\n1. [`prop(key, [value])`](#propkey-value)\n1. [`props(object)`](#propsobject)\n1. [`state(key, [value])`](#statekey-value)\n1. [`text(string)`](#textstring)\n1. [`value(string)`](#valuestring)\n1. [Contribute](https://github.com/rkotze/should-enzyme/blob/master/CONTRIBUTING.md)\n\n## Install\n\n`npm i should-enzyme --save-dev`\n\n## Setup\n\nInstall [Enzyme JS](https://github.com/airbnb/enzyme#installation)\n\n```js\nimport \"should\";\nimport \"should-enzyme\";\n```\n\n## Assertions\n\n### `attr(key, [value])`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if element has attribute and optionally check value.\n\n```js\nimport { mount, render, shallow } from \"enzyme\";\nimport React, { PropTypes } from \"react\";\n\nconst AttrFixture = ({ children, title }) =\u003e \u003cdiv title={title}\u003econtent\u003c/div\u003e;\n\nAttrFixture.propTypes = {\n  children: PropTypes.node,\n  title: PropTypes.string\n};\n\nconst wrapper = mount(\u003cAttrFeature /\u003e);\n\nwrapper.should.have.attr(\"title\");\nwrapper.should.have.attr(\"title\", \"enzyme\");\nwrapper.should.not.have.attr(\"pizza\");\nwrapper.should.not.have.attr(\"title\", \"stuff\");\n```\n\n### `checked()`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if input type checkbox is checked.\n\n```js\nimport React from \"react\";\nimport { mount, render, shallow } from \"enzyme\";\n\nconst CheckedFixture = () =\u003e (\n  \u003cdiv\u003e\n    \u003cinput id=\"coffee\" type=\"checkbox\" defaultChecked value=\"coffee\" /\u003e\n    \u003cinput id=\"tea\" type=\"checkbox\" value=\"tea\" /\u003e\n  \u003c/div\u003e\n);\n\nconst wrapper = renderMethod(\u003cCheckedFixture /\u003e);\nconst coffee = wrapper.find(\"#coffee\");\nconst tea = wrapper.find(\"#tea\");\n\ncoffee.should.checked();\ntea.should.not.be.checked();\n```\n\n### `className(string)`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if wrapper has css class.\n\n```js\nimport React from \"react\";\nimport { mount, render, shallow } from \"enzyme\";\n\nconst ClassNameFixture = () =\u003e (\n  \u003cdiv className=\"special burger\"\u003eContent here\u003c/div\u003e\n);\n\nconst wrapper = mount(\u003cClassNameFixture /\u003e);\n\nwrapper.should.have.className(\"special\");\nwrapper.should.not.have.className(\"pizza\");\n```\n\n### `contain(node)`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| no     | yes   | yes     |\n\nCheck to see if wrapper contains the expected node.\n\n```js\nimport React from \"react\";\nimport { mount, shallow } from \"enzyme\";\n\nconst Banana = () =\u003e {\n  return \u003cdiv\u003eBanana\u003c/div\u003e;\n};\n\nconst Apple = props =\u003e {\n  return \u003cdiv\u003eApple\u003c/div\u003e;\n};\n\nconst ContainNodesFixture = () =\u003e {\n  return (\n    \u003cdiv\u003e\n      \u003cApple name=\"Jim\" /\u003e\n      \u003cApple name=\"Bob\" /\u003e\n    \u003c/div\u003e\n  );\n};\n\nconst wrapper = mount(\u003cContainNodesFixture /\u003e);\n\nwrapper.should.contain(\u003cApple name=\"Bob\" /\u003e);\nwrapper.should.not.be.contain(\u003cBanana /\u003e);\n```\n\n### `containsText(string)`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if wrapper contains text.\n\n```js\nimport React from 'react';\nimport {mount, render, shallow} from 'enzyme';\n\nconst TextFixture = () =\u003e (\n  \u003cdiv\u003eContent here. More content\u003c/div\u003e\n);\n\ncont wrapper = mount(\u003cTextFixture /\u003e);\n\nwrapper.should.containsText('Content here');\nwrapper.should.not.containsText('pizza');\n```\n\n### `data(key, [value])`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if element has a data attribute and optionally check value.\n\n```js\nimport { mount, render, shallow } from \"enzyme\";\nimport React, { PropTypes } from \"react\";\n\nconst DataFixture = ({ children, tr }) =\u003e (\n  \u003cdiv data-tr={tr} data-id=\"special-id\"\u003e\n    content\n  \u003c/div\u003e\n);\n\nDataFixture.propTypes = {\n  children: PropTypes.node,\n  tr: PropTypes.string\n};\n\nconst wrapper = mount(\u003cDataFixture tr=\"enzyme\" /\u003e);\n\nwrapper.should.have.data(\"tr\");\nwrapper.should.have.data(\"tr\", \"enzyme\");\nwrapper.should.not.have.data(\"pizza\");\nwrapper.should.not.have.data(\"tr\", \"stuff\");\n```\n\n### `disabled()`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if input fields are disabled.\n\n```js\nimport React from \"react\";\nimport { mount, render, shallow } from \"enzyme\";\n\nconst DisabledFixture = () =\u003e (\n  \u003cdiv\u003e\n    \u003cinput id=\"coffee\" type=\"text\" value=\"coffee\" /\u003e\n    \u003cinput id=\"tea\" type=\"text\" disabled value=\"tea\" /\u003e\n  \u003c/div\u003e\n);\n\nconst wrapper = renderMethod(\u003cDisabledFixture /\u003e);\nconst coffee = wrapper.find(\"#coffee\");\nconst tea = wrapper.find(\"#tea\");\n\ncoffee.should.not.be.disabled();\ntea.should.be.disabled();\n```\n\n### `exactClassNames(string)`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if wrapper has the exact class names.\n\n```js\nimport React from 'react';\nimport {mount, render, shallow} from 'enzyme';\n\nconst ClassNamesFixture = () =\u003e (\n  \u003cdiv className=\"special buffalo chicken burger\"\u003eContent here\u003c/div\u003e\n);\n\ncont wrapper = mount(\u003cClassNamesFixture /\u003e);\n\nwrapper.should.have.exactClassNames('special buffalo chicken burger');\nwrapper.should.not.have.exactClassNames('special buffalo chicken');\nwrapper.should.not.have.exactClassNames('other class names');\n```\n\n### `present()`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if the wrapper is present.\n\n```js\nimport React from \"react\";\nimport { mount, render, shallow } from \"enzyme\";\n\nconst PresentFixture = () =\u003e (\n  \u003cdiv\u003e\n    \u003cdiv id=\"burgers\"\u003ewith cheese\u003c/div\u003e\n    \u003cdiv\u003eside of fries\u003c/div\u003e\n  \u003c/div\u003e\n);\n\nconst wrapper = mount(\u003cPresentFeature /\u003e);\nconst burgers = wrapper.find(\"#burgers\");\nconst salad = wrapper.find(\"#salad\");\n\nburgers.should.be.present();\nsalad.should.not.be.present();\n```\n\n**Exception:** Using `render` only with Enzyme 3 means `null` components are not classed as \"present\".\nThis is related to the cheerio wrapper v1 being returned.\n\nSee example below:\n\n```js\nimport React from \"react\";\nimport { mount, render, shallow } from \"enzyme\";\n\nconst PresentFixture = () =\u003e null;\n\nconst wrapperMount = mount(\u003cPresentFeature /\u003e);\nwrapperMount.should.be.present(); // true\n\nconst wrapperRender = render(\u003cPresentFeature /\u003e);\nwrapperRender.should.be.present(); // false\n```\n\n### `prop(key, [value])`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| no     | yes   | yes     |\n\nCheck to see if wrapper has prop and optionally check value.\n\n```js\nimport React from \"react\";\nimport { mount, shallow } from \"enzyme\";\n\nconst PropFixture = ({ children, id, myObj }) =\u003e \u003cdiv id={id}\u003esalad\u003c/div\u003e;\n\nconst wrapper = mount(\u003cPropFeature id=\"mango\" myObj={{ foo: \"bar\" }} /\u003e);\n\nwrapper.should.have.prop(\"id\");\nwrapper.should.not.have.prop(\"iDontExistProp\");\n\nwrapper.should.have.prop(\"id\", \"mango\");\nwrapper.should.not.have.prop(\"id\", \"banana\");\n// assert objects\nwrapper.should.have.prop(\"myObj\", { foo: \"bar\" });\n\nwrapper.should.not.have.prop(\"iDontExistProp\", \"banana\");\n```\n\n### `props(object)`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| no     | yes   | yes     |\n\nCheck to see if wrapper has props and value. This uses shouldJS `deepEqual` assert.\n\n```js\nimport React from \"react\";\nimport { mount, shallow } from \"enzyme\";\n\nconst PropsFixture = ({ id, title, total }) =\u003e (\n  \u003cdiv id={id} title={title} total={total}\u003e\n    content\n  \u003c/div\u003e\n);\n\nconst wrapper = mount(\n  \u003cPropsFixture id=\"content\" title=\"superfood\" total={24} /\u003e\n);\n\nwrapper.should.have.props({ id: \"content\" });\nwrapper.should.have.props({ id: \"content\", title: \"superfood\", total: 24 });\n\nwrapper.should.not.have.props({ food: \"pizza\" });\nwrapper.should.not.have.props({ id: \"stuff\" });\n\nwrapper.should.have.props(); // will error require object\n```\n\n### `state(key, [value])`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| no     | yes   | yes     |\n\nCheck to see if wrapper has state property and optionally check value.\n\n```js\nimport React, { Component } from \"react\";\nimport { mount, shallow } from \"enzyme\";\n\nclass StateFixture extends Component {\n  constructor() {\n    super();\n    this.state = {\n      bestFruit: \"mango\"\n    };\n  }\n\n  render() {\n    return \u003cdiv id=\"best-mangos\"\u003e{this.state.bestFruit}\u003c/div\u003e;\n  }\n}\n\nconst wrapper = mount(\u003cStateFeature /\u003e);\n\nwrapper.should.have.state(\"bestFruit\");\nwrapper.should.not.have.state(\"anotherFruit\");\n\nwrapper.should.have.state(\"bestFruit\", \"mango\");\nwrapper.should.not.have.state(\"bestFruit\", \"orange\");\n\nwrapper.should.not.have.state(\"anotherFruit\", \"banana\");\n```\n\n### `text(string)`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nCheck to see if the exact text content is in wrapper.\n\n```js\nimport React from 'react';\nimport {mount, render, shallow} from 'enzyme';\n\nconst TextFeature (props) =\u003e (\n      \u003cdiv id='text-feature'\u003e\n        \u003cspan id='text-span'\u003eTest\u003c/span\u003e\n      \u003c/div\u003e\n    );\n\nconst wrapper = mount(\u003cTextFeature /\u003e);\n\nwrapper.find('#text-span').should.have.text('Test');\n\nwrapper.find('#text-span').should.not.have.text('Other text');\n```\n\n### `value(string)`\n\n| render | mount | shallow |\n| ------ | ----- | ------- |\n| yes    | yes   | yes     |\n\nAssert on input field values this includes `\u003cinput\u003e`, `\u003cselect\u003e` and `\u003ctextarea\u003e`.\n\n```js\nimport React from \"react\";\nimport { mount, render, shallow } from \"enzyme\";\n\nconst FormInputsFixture = () =\u003e (\n  \u003cform\u003e\n    \u003cinput type=\"text\" name=\"mug\" defaultValue=\"coffee\" /\u003e\n    \u003cselect defaultValue=\"pizza\"\u003e\n      \u003coption value=\"coffee\"\u003eMore coffee\u003c/option\u003e\n      \u003coption value=\"pizza\"\u003ePizza\u003c/option\u003e\n      \u003coption value=\"salad\"\u003eSalad\u003c/option\u003e\n    \u003c/select\u003e\n    \u003ctextarea name=\"fruit\" value=\"Hands or bunch of bananas?\" /\u003e\n    \u003cdiv id=\"failSelect\"\u003eWhat value?\u003c/div\u003e\n  \u003c/form\u003e\n);\n\nconst wrapper = mount(\u003cFormInputsFixture /\u003e);\n\nwrapper.find(\"input\").should.have.value(\"coffee\");\nwrapper.find(\"input\").should.not.have.value(\"pizza\");\n\nwrapper.find(\"select\").should.have.value(\"pizza\");\nwrapper.find(\"select\").should.not.have.value(\"salad\");\n\nwrapper.find(\"textarea\").should.have.value(\"Hands or bunch of bananas?\");\nwrapper.find(\"textarea\").should.not.have.value(\"Mangoes\");\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frkotze%2Fshould-enzyme","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frkotze%2Fshould-enzyme","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frkotze%2Fshould-enzyme/lists"}