Allow prop to pass when value is undefined

src/assertions/prop.js

@@ -0,0 +1,29 @@
+// purpose: enzyme `prop` calls `props()[key]` and doesn't need to check existance but chai-enzyme should
+// so that:
+//   thing = shallow(<Thing arg={undefined} />)
+// passes for:
+//   expect(thing).to.have.prop('arg')
+
+export default function ref (args) {
+  const { wrapper, markup, flag, inspect, arg1, arg2, sig } = args
+
+  const props = wrapper.props()
+  const actual = props[arg1]
+  if ('arg2' in args) {
+    this.assert(
+      actual === arg2,
+      () => 'expected ' + sig + ' to have a ' + inspect(arg1) + ' prop with the value #{exp}, but the value was #{act}' + markup(),
+      () => 'expected ' + sig + ' not to have a ' + inspect(arg1) + ' prop with the value #{act}' + markup(),
+      arg2,
+      actual
+    )
+  } else {
+    this.assert(
+      arg1 in props,
+      () => 'expected ' + sig + ' to have a #{exp} prop' + markup(),
+      () => 'expected ' + sig + ' not to have a #{exp} prop' + markup(),
+      arg1
+    )
+  }
+  flag(this, 'object', actual)
+}

src/index.js

@@ -9,6 +9,7 @@ import disabled from './assertions/disabled'
 import empty from './assertions/empty'
 import exist from './assertions/exist'
 import generic from './assertions/generic'
+import prop from './assertions/prop'
 import props from './assertions/props'
 import html from './assertions/html'
 import id from './assertions/id'
@@ -36,8 +37,8 @@ module.exports = function (debug = printDebug) {
     chaiWrapper.addAssertion(generic('data', 'data attribute'), 'data')
     chaiWrapper.addAssertion(generic('style', 'CSS style property'), 'style')
     chaiWrapper.addAssertion(generic('state', 'state'), 'state')
-    chaiWrapper.addAssertion(generic('prop', 'prop'), 'prop')
 
+    chaiWrapper.addAssertion(prop, 'prop')
     chaiWrapper.addAssertion(props, 'props')
     chaiWrapper.addAssertion(checked, 'checked')
     chaiWrapper.addAssertion(className, 'className')

test/prop.test.js

@@ -19,6 +19,7 @@ class Fixture extends React.Component {
         <ul>
           <li><User index={1} objectProp={{foo: 'bar'}} /></li>
           <li><User index={2} /></li>
+          <li><User index={3} objectProp={undefined} /></li>
         </ul>
       </div>
     )
@@ -46,17 +47,35 @@ describe('#prop', () => {
         expect(wrapper.find(User).first()).to.not.have.prop('index')
       }).to.throw("not to have a 'index' prop")
     }, { render: false })
+
+    it('passes when the actual matches the expected and the value is undefined', (wrapper) => {
+      expect(wrapper.find(User).last()).to.have.prop('objectProp')
+    }, { render: false })
+
+    it('fails negated when the actual exists but is undefined', (wrapper) => {
+      expect(() => {
+        expect(wrapper.find(User).last()).to.not.have.prop('objectProp')
+      }).to.throw("to have a 'objectProp' prop")
+    }, { render: false })
   })
 
   describe('(key, value)', () => {
     it('passes when the actual matches the expected', (wrapper) => {
       expect(wrapper.find(User).first()).to.have.prop('index', 1)
     }, { render: false })
 
+    it('passes when the actual matches the expected and is undefined', (wrapper) => {
+      expect(wrapper.find(User).last()).to.have.prop('objectProp', undefined)
+    }, { render: false })
+
     it('passes negated when the actual does not match the expected', (wrapper) => {
       expect(wrapper.find(User).first()).to.not.have.prop('index', 2)
     }, { render: false })
 
+    it('passes when the actual matches the expected and is undefined', (wrapper) => {
+      expect(wrapper.find(User).last()).to.not.have.prop('objectProp', false)
+    }, { render: false })
+
     it('fails when the actual does not match the expected', (wrapper) => {
       expect(() => {
         expect(wrapper.find(User).first()).to.have.prop('index', 2)