diff --git a/src/modules/Embed/Embed.js b/src/modules/Embed/Embed.js
index 55bb2c0d82..a27597700a 100644
--- a/src/modules/Embed/Embed.js
+++ b/src/modules/Embed/Embed.js
@@ -1,4 +1,5 @@
 import cx from 'clsx'
+import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React from 'react'
 
@@ -57,10 +58,9 @@ export default class Embed extends Component {
   }
 
   handleClick = (e) => {
-    const { onClick } = this.props
     const { active } = this.state
 
-    if (onClick) onClick(e, { ...this.props, active: true })
+    _.invoke(this.props, 'onClick', e, { ...this.props, active: true })
     if (!active) this.setState({ active: true })
   }
 
diff --git a/src/modules/Transition/Transition.js b/src/modules/Transition/Transition.js
index 0cd0fb8e09..0fdea6a222 100644
--- a/src/modules/Transition/Transition.js
+++ b/src/modules/Transition/Transition.js
@@ -87,7 +87,11 @@ export default class Transition extends Component {
     const durationType = TRANSITION_CALLBACK_TYPE[nextStatus]
     const durationValue = normalizeTransitionDuration(duration, durationType)
 
-    this.timeoutId = setTimeout(() => this.setState({ status: nextStatus }), durationValue)
+    if (durationValue === 0) {
+      this.setState({ status: nextStatus })
+    } else {
+      this.timeoutId = setTimeout(() => this.setState({ status: nextStatus }), durationValue)
+    }
   }
 
   updateStatus = (prevState) => {
@@ -161,7 +165,7 @@ export default class Transition extends Component {
     debug('render(): state', this.state)
 
     const { children } = this.props
-    const { status } = this.state
+    const { nextStatus, status } = this.state
 
     if (status === TRANSITION_STATUS_UNMOUNTED) {
       return null
@@ -170,6 +174,10 @@ export default class Transition extends Component {
     return cloneElement(children, {
       className: this.computeClasses(),
       style: this.computeStyle(),
+      ...(process.env.NODE_ENV !== 'production' && {
+        'data-test-status': status,
+        'data-test-next-status': nextStatus,
+      }),
     })
   }
 }
diff --git a/test/specs/addons/TransitionablePortal/TransitionablePortal-test.js b/test/specs/addons/TransitionablePortal/TransitionablePortal-test.js
index 79d9f23a63..8dd4e6d4de 100644
--- a/test/specs/addons/TransitionablePortal/TransitionablePortal-test.js
+++ b/test/specs/addons/TransitionablePortal/TransitionablePortal-test.js
@@ -4,68 +4,26 @@ import TransitionablePortal from 'src/addons/TransitionablePortal/Transitionable
 import * as common from 'test/specs/commonTests'
 import { domEvent, sandbox, assertWithTimeout } from 'test/utils'
 
-// ----------------------------------------
-// Wrapper
-// ----------------------------------------
-let wrapper
-
-// we need to unmount the modal after every test to remove it from the document
-// wrap the render methods to update a global wrapper that is unmounted after each test
-const wrapperMount = (...args) => (wrapper = mount(...args))
-const wrapperShallow = (...args) => (wrapper = shallow(...args))
-
 const quickTransition = { duration: 0 }
 const requiredProps = {
-  children: <div />,
+  children: <div id='children' />,
 }
 
 describe('TransitionablePortal', () => {
-  beforeEach(() => {
-    wrapper = undefined
-    document.body.innerHTML = ''
-  })
-
-  afterEach(() => {
-    if (wrapper && wrapper.unmount) wrapper.unmount()
-  })
-
   common.isConformant(TransitionablePortal, { requiredProps })
 
   describe('children', () => {
-    it('renders a Portal', () => {
-      wrapperShallow(<TransitionablePortal {...requiredProps} />).should.have.descendants('Portal')
-    })
-
     it('renders a Transition', () => {
-      wrapperShallow(<TransitionablePortal {...requiredProps} />).should.have.descendants(
-        'Transition',
-      )
-    })
-  })
-
-  describe('getDerivedStateFromProps', () => {
-    it('passes `open` prop to `portalOpen` when defined', () => {
-      wrapperMount(<TransitionablePortal {...requiredProps} />)
+      const wrapper = mount(<TransitionablePortal {...requiredProps} open />)
 
-      wrapper.setProps({ open: true })
-      wrapper.should.have.state('portalOpen', true)
-      wrapper.setProps({ open: false })
-      wrapper.should.have.state('portalOpen', false)
-    })
-
-    it('does not pass `open` prop to `portalOpen` when not defined', () => {
-      wrapperMount(<TransitionablePortal {...requiredProps} />)
-
-      wrapper.setProps({ transition: {} })
-      wrapper.should.have.not.state('portalOpen')
+      wrapper.should.have.descendants('.transition')
     })
   })
 
   describe('onClose', () => {
-    it('is called with (null, data) when Portal closes', (done) => {
+    it('is called with (null, data) on a click outside', (done) => {
       const onClose = sandbox.spy()
-
-      wrapperMount(
+      const wrapper = mount(
         <TransitionablePortal
           {...requiredProps}
           onClose={onClose}
@@ -80,36 +38,33 @@ describe('TransitionablePortal', () => {
       assertWithTimeout(() => {
         onClose.should.have.been.calledOnce()
         onClose.should.have.been.calledWithMatch(null, { portalOpen: false })
+
+        wrapper.unmount()
       }, done)
     })
 
-    it('changes `portalOpen` to false', () => {
-      wrapperMount(
-        <TransitionablePortal
-          {...requiredProps}
-          transition={quickTransition}
-          trigger={<button />}
-        />,
-      )
+    it('hides contents on a click outside', () => {
+      const wrapper = mount(<TransitionablePortal {...requiredProps} trigger={<button />} />)
 
       wrapper.find('button').simulate('click')
-      domEvent.click(document.body)
+      wrapper.should.have.descendants('.in#children')
 
-      wrapper.should.have.state('portalOpen', false)
+      domEvent.click(document.body)
+      wrapper.update()
+      wrapper.should.have.descendants('.out#children')
     })
   })
 
   describe('onHide', () => {
     it('is called with (null, data) when exiting transition finished', (done) => {
       const onHide = sandbox.spy()
-      const trigger = <button />
-      wrapperMount(
+      const wrapper = mount(
         <TransitionablePortal
           {...requiredProps}
           onHide={onHide}
           open
           transition={quickTransition}
-          trigger={trigger}
+          trigger={<button />}
         />,
       )
 
@@ -121,37 +76,58 @@ describe('TransitionablePortal', () => {
           portalOpen: false,
           transitionVisible: false,
         })
+
+        wrapper.unmount()
       }, done)
     })
   })
 
   describe('onOpen', () => {
-    it('is called with (null, data) when Portal opens', () => {
+    it('is called with (null, data) when opens', () => {
       const onOpen = sandbox.spy()
+      const wrapper = mount(
+        <TransitionablePortal {...requiredProps} onOpen={onOpen} trigger={<button />} />,
+      )
 
-      wrapperMount(<TransitionablePortal {...requiredProps} onOpen={onOpen} trigger={<button />} />)
       wrapper.find('button').simulate('click')
-
       onOpen.should.have.been.calledOnce()
       onOpen.should.have.been.calledWithMatch(null, { portalOpen: true })
     })
 
-    it('changes `portalOpen` to true', () => {
-      wrapperMount(<TransitionablePortal {...requiredProps} trigger={<button />} />)
+    it('renders contents', () => {
+      const wrapper = mount(<TransitionablePortal {...requiredProps} trigger={<button />} />)
 
       wrapper.find('button').simulate('click')
-      wrapper.should.have.state('portalOpen', true)
+      wrapper.should.have.descendants('.in#children')
     })
   })
 
   describe('open', () => {
-    it('does not block update of state on Portal close', () => {
-      wrapperMount(<TransitionablePortal {...requiredProps} open />)
-      wrapper.should.have.state('portalOpen', true)
-      wrapper.update()
+    it('does not block update of state on a portal close', () => {
+      const wrapper = mount(<TransitionablePortal {...requiredProps} open />)
+      wrapper.should.have.descendants('.in#children')
 
       domEvent.click(document.body)
-      wrapper.should.have.state('portalOpen', false)
+      wrapper.update()
+      wrapper.should.have.descendants('.out#children')
+    })
+
+    it('passes `open` prop to Transition when defined', () => {
+      const wrapper = mount(<TransitionablePortal {...requiredProps} />)
+
+      wrapper.setProps({ open: true })
+      wrapper.should.have.descendants('.in#children')
+
+      wrapper.setProps({ open: false })
+      wrapper.should.have.descendants('.out#children')
+    })
+
+    it('does not pass `open` prop to Transition when not defined', () => {
+      const wrapper = mount(<TransitionablePortal {...requiredProps} />)
+      wrapper.should.have.not.descendants('#children')
+
+      wrapper.setProps({ transition: {} })
+      wrapper.should.have.not.descendants('#children')
     })
   })
 })
diff --git a/test/specs/modules/Accordion/AccordionAccordion-test.js b/test/specs/modules/Accordion/AccordionAccordion-test.js
index af6db9a6ce..0577e95a8e 100644
--- a/test/specs/modules/Accordion/AccordionAccordion-test.js
+++ b/test/specs/modules/Accordion/AccordionAccordion-test.js
@@ -21,89 +21,74 @@ describe('AccordionAccordion', () => {
       { key: 'C', title: 'C', content: 'Something C' },
     ]
 
-    it('defaults to -1', () => {
-      shallow(<AccordionAccordion />).should.have.state('activeIndex', -1)
+    it('there is no active items by default', () => {
+      mount(<AccordionAccordion />).should.not.have.descendants('.active')
     })
 
-    it('defaults to -1 when "exclusive" is false', () => {
-      shallow(<AccordionAccordion exclusive={false} />)
-        .should.have.state('activeIndex')
-        .that.is.empty()
+    it('there is no active items by default when "exclusive" is false', () => {
+      mount(<AccordionAccordion exclusive={false} />).should.not.have.descendants('.active')
     })
 
-    it('makes Accordion.Content at activeIndex - 0 "active"', () => {
-      const wrapper = shallow(<AccordionAccordion activeIndex={0} panels={panels} />)
+    it('activates an item', () => {
+      const wrapper = mount(<AccordionAccordion activeIndex={0} panels={panels} />)
 
-      wrapper.childAt(0).should.have.prop('active', true)
-      wrapper.childAt(1).should.have.prop('active', false)
-      wrapper.childAt(2).should.have.prop('active', false)
+      wrapper.find('.title').at(0).should.have.className('active')
+      wrapper.find('.title').at(1).should.not.have.className('active')
+      wrapper.find('.title').at(2).should.not.have.className('active')
     })
 
-    it('is toggled to -1 when clicking Title a second time', () => {
+    it('items can be toggled by a click', () => {
       const wrapper = mount(<AccordionAccordion panels={panels} />)
 
-      wrapper.find(AccordionTitle).at(0).simulate('click')
-      wrapper.should.have.state('activeIndex', 0)
+      wrapper.find('.title').at(0).simulate('click')
+      wrapper.find('.title').at(0).should.have.className('active')
 
-      wrapper.find(AccordionTitle).at(0).simulate('click')
-      wrapper.should.have.state('activeIndex', -1)
+      wrapper.find('.title').at(0).simulate('click')
+      wrapper.find('.title').at(0).should.not.have.className('active')
     })
 
-    it('sets the correct panel active', () => {
-      const wrapper = shallow(<AccordionAccordion activeIndex={0} panels={panels} />)
-
-      wrapper.childAt(0).should.have.prop('active', true)
-      wrapper.childAt(1).should.have.prop('active', false)
-      wrapper.childAt(2).should.have.prop('active', false)
+    it('activates a proper item', () => {
+      const wrapper = mount(<AccordionAccordion activeIndex={0} panels={panels} />)
 
       wrapper.setProps({ activeIndex: 1 })
-      wrapper.childAt(0).should.have.prop('active', false)
-      wrapper.childAt(1).should.have.prop('active', true)
-      wrapper.childAt(2).should.have.prop('active', false)
-    })
-
-    it('can be an array', () => {
-      const wrapper = shallow(
-        <AccordionAccordion activeIndex={[0, 1]} exclusive={false} panels={panels} />,
-      )
-      wrapper.childAt(0).should.have.prop('active', true)
-      wrapper.childAt(1).should.have.prop('active', true)
-      wrapper.childAt(2).should.have.prop('active', false)
-
-      wrapper.setProps({ activeIndex: [1, 2] })
-      wrapper.childAt(0).should.have.prop('active', false)
-      wrapper.childAt(1).should.have.prop('active', true)
-      wrapper.childAt(2).should.have.prop('active', true)
+      wrapper.find('.title').at(0).should.not.have.className('active')
+      wrapper.find('.title').at(1).should.have.className('active')
+      wrapper.find('.title').at(2).should.not.have.className('active')
     })
 
-    it('can be inclusive and makes Accordion.Content at activeIndex - 1 "active"', () => {
-      const wrapper = shallow(
+    it('can activate a single item when "exclusive" is false', () => {
+      const wrapper = mount(
         <AccordionAccordion activeIndex={[0]} exclusive={false} panels={panels} />,
       )
 
-      wrapper.childAt(0).should.have.prop('active', true)
-      wrapper.childAt(1).should.have.prop('active', false)
-      wrapper.childAt(2).should.have.prop('active', false)
+      wrapper.find('.title').at(0).should.have.className('active')
+      wrapper.find('.title').at(1).should.not.have.className('active')
+      wrapper.find('.title').at(2).should.not.have.className('active')
     })
 
-    it('can be inclusive and allows multiple open', () => {
-      const wrapper = shallow(
+    it('can activate multiple items when "exclusive" is false', () => {
+      const wrapper = mount(
         <AccordionAccordion activeIndex={[0, 1]} exclusive={false} panels={panels} />,
       )
+      wrapper.find('.title').at(0).should.have.className('active')
+      wrapper.find('.title').at(1).should.have.className('active')
+      wrapper.find('.title').at(2).should.not.have.className('active')
 
-      wrapper.childAt(0).should.have.prop('active', true)
-      wrapper.childAt(1).should.have.prop('active', true)
-      wrapper.childAt(2).should.have.prop('active', false)
+      wrapper.setProps({ activeIndex: [1, 2] })
+      wrapper.find('.title').at(0).should.not.have.className('active')
+      wrapper.find('.title').at(1).should.have.className('active')
+      wrapper.find('.title').at(2).should.have.className('active')
     })
 
     it('can be inclusive and can open multiple panels by clicking', () => {
       const wrapper = mount(<AccordionAccordion exclusive={false} panels={panels} />)
 
-      wrapper.find(AccordionTitle).at(0).simulate('click')
-      wrapper.should.have.state('activeIndex').that.includes(0)
+      wrapper.find('.title').at(0).simulate('click')
+      wrapper.find('.title').at(0).should.have.className('active')
 
-      wrapper.find(AccordionTitle).at(1).simulate('click')
-      wrapper.should.have.state('activeIndex').that.includes(0, 1)
+      wrapper.find('.title').at(1).simulate('click')
+      wrapper.find('.title').at(0).should.have.className('active')
+      wrapper.find('.title').at(1).should.have.className('active')
     })
 
     it('can be inclusive and close multiple panels by clicking', () => {
@@ -111,11 +96,13 @@ describe('AccordionAccordion', () => {
         <AccordionAccordion defaultActiveIndex={[0, 1]} exclusive={false} panels={panels} />,
       )
 
-      wrapper.find(AccordionTitle).at(0).simulate('click')
-      wrapper.should.have.state('activeIndex').that.includes(1)
+      wrapper.find('.title').at(0).simulate('click')
+      wrapper.find('.title').at(0).should.not.have.className('active')
+      wrapper.find('.title').at(1).should.have.className('active')
 
-      wrapper.find(AccordionTitle).at(1).simulate('click')
-      wrapper.should.have.state('activeIndex').that.is.empty()
+      wrapper.find('.title').at(1).simulate('click')
+      wrapper.find('.title').at(0).should.not.have.className('active')
+      wrapper.find('.title').at(1).should.not.have.className('active')
     })
 
     it('warns if is `exclusive` and is given an array', () => {
@@ -139,7 +126,18 @@ describe('AccordionAccordion', () => {
 
   describe('defaultActiveIndex', () => {
     it('sets the initial activeIndex state', () => {
-      shallow(<AccordionAccordion defaultActiveIndex={123} />).should.have.state('activeIndex', 123)
+      const wrapper = mount(
+        <AccordionAccordion
+          defaultActiveIndex={1}
+          panels={[
+            { key: 'A', title: 'A', content: 'Something A' },
+            { key: 'B', title: 'B', content: 'Something B' },
+          ]}
+        />,
+      )
+
+      wrapper.find('.title').at(0).should.not.have.className('active')
+      wrapper.find('.title').at(1).should.have.className('active')
     })
   })
 
@@ -153,14 +151,11 @@ describe('AccordionAccordion', () => {
     ]
 
     it('is called with (e, titleProps) when clicked', () => {
-      mount(<AccordionAccordion panels={panels} onTitleClick={onTitleClick} />)
-        .find(AccordionTitle)
-        .at(0)
-        .simulate('click', event)
+      const wrapper = mount(<AccordionAccordion panels={panels} onTitleClick={onTitleClick} />)
 
+      wrapper.find('.title').at(0).simulate('click', event)
       onClick.should.have.been.calledOnce()
       onClick.should.have.been.calledWithMatch(event, { index: 0, content: 'A' })
-
       onTitleClick.should.have.been.calledOnce()
       onTitleClick.should.have.been.calledWithMatch(event, { index: 0, content: 'A' })
     })
diff --git a/test/specs/modules/Checkbox/Checkbox-test.js b/test/specs/modules/Checkbox/Checkbox-test.js
index b24faa7f43..3123b4c6e5 100644
--- a/test/specs/modules/Checkbox/Checkbox-test.js
+++ b/test/specs/modules/Checkbox/Checkbox-test.js
@@ -482,22 +482,32 @@ describe('Checkbox', () => {
 
         render() {
           const handler = isOnClick ? { onClick: this.toggle } : { onChange: this.toggle }
-          return <Checkbox label='Check this box' checked={this.state.checked} {...handler} />
+
+          return (
+            <Checkbox
+              data-checked={this.state.checked}
+              label='Check this box'
+              checked={this.state.checked}
+              {...handler}
+            />
+          )
         }
       }
 
     it('toggles state on "change" with "setState" as function', () => {
-      const ControlledCheckbox = getControlledCheckbox(false)
-      wrapperMount(<ControlledCheckbox />)
-      domEvent.fire(document.querySelector('input'), 'click')
-      wrapper.state().should.eql({ checked: true })
+      const TestComponent = getControlledCheckbox(false)
+      wrapperMount(<TestComponent />)
+
+      domEvent.click('input')
+      wrapper.should.not.have.descendants('[data-checked=true]')
     })
 
     it('toggles state on "click" with "setState" as function', () => {
-      const ControlledCheckbox = getControlledCheckbox(true)
-      wrapperMount(<ControlledCheckbox />)
-      domEvent.fire(document.querySelector('input'), 'click')
-      wrapper.state().should.eql({ checked: true })
+      const TestComponent = getControlledCheckbox(true)
+      wrapperMount(<TestComponent />)
+
+      domEvent.click('input')
+      wrapper.should.not.have.descendants('[data-checked=true]')
     })
   })
 })
diff --git a/test/specs/modules/Dropdown/Dropdown-test.js b/test/specs/modules/Dropdown/Dropdown-test.js
index 6aef057478..76d80811a4 100644
--- a/test/specs/modules/Dropdown/Dropdown-test.js
+++ b/test/specs/modules/Dropdown/Dropdown-test.js
@@ -58,6 +58,30 @@ const dropdownMenuIsClosed = () => {
   }
 }
 
+function bodyIsFocused() {
+  const isFocused = document.activeElement === document.body
+
+  isFocused.should.be.true(
+    `Expected Dropdown to be the active element but found ${document.activeElement} instead.`,
+  )
+}
+
+function dropdownIsFocused() {
+  const isFocused = document.activeElement === document.querySelector('div.dropdown')
+
+  isFocused.should.be.true(
+    `Expected Dropdown to be the active element but found ${document.activeElement} instead.`,
+  )
+}
+
+function dropdownInputIsFocused() {
+  const isFocused = document.activeElement === document.querySelector('input.search')
+
+  isFocused.should.be.true(
+    `Expected DropdownSearchInput to be the active element but found ${document.activeElement} instead.`,
+  )
+}
+
 const dropdownMenuIsOpen = () => {
   wrapper.childAt(0).should.have.className('active')
   wrapper.childAt(0).should.have.className('visible')
@@ -141,7 +165,8 @@ describe('Dropdown', () => {
 
   describe('defaultSearchQuery', () => {
     it('changes default value of searchQuery', () => {
-      shallow(<Dropdown defaultSearchQuery='foo' />).should.have.state('searchQuery', 'foo')
+      wrapperMount(<Dropdown defaultSearchQuery='foo' search />)
+      wrapper.find('input.search').should.have.value('foo')
     })
   })
 
@@ -369,14 +394,15 @@ describe('Dropdown', () => {
       const event = { stopPropagation: _.noop }
       const onChange = sandbox.spy()
 
-      wrapperShallow(
+      wrapperMount(
         <Dropdown defaultValue={defaultValue} clearable onChange={onChange} options={options} />,
       )
-      wrapper.find('Icon').simulate('click', event)
+      wrapper.find('i.clear').simulate('click', event)
 
       onChange.should.have.been.calledOnce()
       onChange.should.have.been.calledWithMatch(event, { value: '' })
-      wrapper.should.have.state('selectedIndex', 0)
+      wrapper.should.have.exactly(1).descendants('.selected.item')
+      wrapper.find('.item').at(0).should.have.className('selected')
     })
 
     it('clears when value is multiple and is not empty', () => {
@@ -384,7 +410,7 @@ describe('Dropdown', () => {
       const event = { stopPropagation: _.noop }
       const onChange = sandbox.spy()
 
-      wrapperShallow(
+      wrapperMount(
         <Dropdown
           defaultValue={defaultValue}
           clearable
@@ -393,11 +419,12 @@ describe('Dropdown', () => {
           options={options}
         />,
       )
-      wrapper.find('Icon').simulate('click', event)
+      wrapper.find('i.clear').simulate('click', event)
 
       onChange.should.have.been.calledOnce()
       onChange.should.have.been.calledWithMatch(event, { value: [] })
-      wrapper.should.have.state('selectedIndex', 0)
+      wrapper.should.have.exactly(1).descendants('.selected.item')
+      wrapper.find('.item').at(0).should.have.className('selected')
     })
   })
 
@@ -447,19 +474,11 @@ describe('Dropdown', () => {
       onChange.should.have.been.calledOnce()
     })
 
-    it('sets focus state to false', () => {
-      wrapperShallow(<Dropdown selectOnBlur />)
-
-      wrapper.childAt(0).simulate('blur')
-      wrapper.should.have.state('focus', false)
-    })
-
     it('sets searchQuery state to empty', () => {
-      wrapperShallow(<Dropdown />)
+      wrapperMount(<Dropdown defaultSearchQuery='foo' search />)
 
-      wrapper.setState({ searchQuery: 'foo' })
       wrapper.childAt(0).simulate('blur')
-      wrapper.should.have.state('searchQuery', '')
+      wrapper.find('input.search').should.have.value('')
     })
 
     it('does not call onBlur when the mouse is down', () => {
@@ -486,15 +505,6 @@ describe('Dropdown', () => {
 
       instance.makeSelectedItemActive.should.not.have.been.called()
     })
-
-    it('does not set focus state when the mouse is down', () => {
-      wrapperShallow(<Dropdown />)
-
-      wrapper.setState({ focus: 'foo' })
-      wrapper.simulate('mousedown')
-      wrapper.simulate('blur')
-      wrapper.should.have.state('focus', 'foo')
-    })
   })
 
   describe('handleClose', () => {
@@ -522,7 +532,7 @@ describe('Dropdown', () => {
       dropdownMenuIsOpen()
 
       wrapper.find('DropdownItem').first().simulate('click')
-      wrapper.should.have.state('value', options[0].value)
+      wrapper.find('.item').at(0).should.have.className('active')
       dropdownMenuIsClosed()
 
       // The dropdown will be still focused after an item will be selected, we should remove
@@ -595,10 +605,11 @@ describe('Dropdown', () => {
 
       wrapper.simulate('click')
       wrapper.simulate('keydown', { key: 'ArrowDown' })
-      wrapper.should.have.state('selectedIndex', 1)
+      wrapper.should.have.exactly(1).descendants('.selected.item')
+      wrapper.find('.item').at(1).should.have.className('selected')
 
       wrapper.setProps({ options: [] })
-      wrapper.should.have.not.state('selectedIndex')
+      wrapper.should.not.have.descendants('.selected.item')
     })
 
     it('will not call setSelectedIndex if options have not changed', () => {
@@ -606,10 +617,10 @@ describe('Dropdown', () => {
 
       wrapper.simulate('click')
       wrapper.simulate('keydown', { key: 'ArrowDown' })
-      wrapper.should.have.state('selectedIndex', 1)
+      wrapper.find('.item').at(1).should.have.className('selected')
 
       wrapper.setProps({ options })
-      wrapper.should.have.state('selectedIndex', 1)
+      wrapper.find('.item').at(1).should.have.className('selected')
     })
   })
 
@@ -623,16 +634,15 @@ describe('Dropdown', () => {
       // open, simulate search and select option
       wrapper.simulate('click')
       wrapper.simulate('keydown', { key: 'ArrowDown' })
-      wrapper.should.have.state('selectedIndex', 1)
+      wrapper.find('.item').at(1).should.have.className('selected')
 
       input.simulate('change', { target: { value: option.text } })
       wrapper.simulate('keydown', { key: 'Enter' })
-
-      wrapper.should.have.state('selectedIndex', 4)
+      wrapper.find('.item').at(4).should.have.className('selected')
 
       // open again
       wrapper.simulate('click')
-      wrapper.should.have.state('selectedIndex', 4)
+      wrapper.find('.item').at(4).should.have.className('selected')
     })
 
     it('keeps "selectedIndex" when the same item was selected', () => {
@@ -644,13 +654,12 @@ describe('Dropdown', () => {
       // simulate search and select option
       input.simulate('change', { target: { value: option.text } })
       wrapper.simulate('keydown', { key: 'Enter' })
-
-      wrapper.should.have.state('selectedIndex', 4)
+      wrapper.find('.item').at(4).should.have.className('selected')
 
       // select the same option again
       input.simulate('change', { target: { value: option.text } })
       wrapper.simulate('keydown', { key: 'Enter' })
-      wrapper.should.have.state('selectedIndex', 4)
+      wrapper.find('.item').at(4).should.have.className('selected')
     })
   })
 
@@ -703,11 +712,13 @@ describe('Dropdown', () => {
 
   describe('searchQuery', () => {
     it('defaults to empty string', () => {
-      shallow(<Dropdown />).should.have.state('searchQuery', '')
+      wrapperMount(<Dropdown search />)
+      wrapper.find('input.search').should.have.value('')
     })
 
     it('passes value to state', () => {
-      shallow(<Dropdown searchQuery='foo' />).should.have.state('searchQuery', 'foo')
+      wrapperMount(<Dropdown search searchQuery='foo' />)
+      wrapper.find('input.search').should.have.value('foo')
     })
   })
 
@@ -1054,7 +1065,7 @@ describe('Dropdown', () => {
       wrapper.simulate('click')
       wrapper.simulate('keydown', { key: 'ArrowDown' })
 
-      wrapper.should.have.state('searchQuery', 'foo')
+      wrapper.find('input.search').should.have.value('foo')
     })
   })
 
@@ -1110,8 +1121,7 @@ describe('Dropdown', () => {
 
       wrapper.simulate('click')
       wrapper.simulate('keydown', { key: 'ArrowDown' })
-
-      wrapper.should.have.state('value', options[1].value)
+      wrapper.find('.item').at(1).should.have.className('active')
     })
 
     it('updates value on up arrow', () => {
@@ -1119,8 +1129,7 @@ describe('Dropdown', () => {
 
       wrapper.simulate('click')
       wrapper.simulate('keydown', { key: 'ArrowUp' })
-
-      wrapper.should.have.state('value', options[4].value)
+      wrapper.find('.item').at(4).should.have.className('active')
     })
   })
 
@@ -1359,15 +1368,15 @@ describe('Dropdown', () => {
 
     it('handles focus correctly', () => {
       wrapperMount(<Dropdown options={options} selection />)
-      wrapper.should.have.state('focus', false)
+      bodyIsFocused()
 
       // focus
       wrapper.getDOMNode().focus()
-      wrapper.should.have.state('focus', true)
+      dropdownIsFocused()
 
       // click outside
       domEvent.click(document.body)
-      wrapper.should.have.state('focus', false)
+      bodyIsFocused()
     })
 
     it('closes on esc key', () => {
@@ -1718,6 +1727,7 @@ describe('Dropdown', () => {
       spy.should.have.been.calledOnce()
       spy.should.have.been.calledWithMatch({}, { value: expected })
     })
+
     it('removes the last item when there is no search query when uncontrolled', () => {
       const value = _.map(options, 'value')
       const expected = _.dropRight(value)
@@ -1734,14 +1744,12 @@ describe('Dropdown', () => {
 
       // open
       wrapper.simulate('click')
-
       domEvent.keyDown(document, { key: 'Backspace' })
 
       spy.should.have.been.calledOnce()
       spy.should.have.been.calledWithMatch({}, { value: expected })
-
-      wrapper.state('value').should.deep.equal(expected)
     })
+
     it('does not remove the last item when there is a search query', () => {
       // search for random item
       const searchQuery = _.sample(options).text
@@ -2121,7 +2129,7 @@ describe('Dropdown', () => {
       wrapper.find('DropdownItem').first().simulate('click')
 
       // bye bye search query
-      wrapper.should.have.state('searchQuery', '')
+      wrapper.find('input.search').should.have.value('')
     })
 
     it('opens the menu on change if there is a query and not already open', () => {
@@ -2195,10 +2203,10 @@ describe('Dropdown', () => {
       // avoid it to prevent false positives
       wrapper.simulate('click')
       wrapper.simulate('keydown', { key: 'ArrowUp' })
-      wrapper.should.have.state('selectedIndex', 3)
+      wrapper.find('.item').at(3).should.have.className('selected')
 
       wrapper.find('input.search').simulate('change', { target: { value: 'baz' } })
-      wrapper.should.have.state('selectedIndex', 0)
+      wrapper.find('.item').at(0).should.have.className('selected')
     })
 
     it('still allows moving selection after blur/focus', () => {
@@ -2248,13 +2256,7 @@ describe('Dropdown', () => {
         .simulate('click', nativeEvent)
 
       dropdownMenuIsClosed()
-
-      const activeElement = document.activeElement
-      const searchIsFocused = activeElement === document.querySelector('input.search')
-      searchIsFocused.should.be.true(
-        `Expected "input.search" to be the active element but found ${activeElement} instead.`,
-      )
-      wrapper.should.have.state('focus', true)
+      dropdownInputIsFocused()
     })
 
     it('sets focus to the dropdown after selection', () => {
@@ -2269,14 +2271,7 @@ describe('Dropdown', () => {
       // TODO: try reenable after Enzyme update
       // /~https://github.com/Semantic-Org/Semantic-UI-React/pull/3747#issuecomment-522018329
       // dropdownMenuIsClosed()
-
-      const activeElement = document.activeElement
-      const dropdownIsFocused = activeElement === document.querySelector('div.dropdown')
-      dropdownIsFocused.should.be.true(
-        `Expected Dropdown to be the active element but found ${activeElement} instead.`,
-      )
-
-      wrapper.should.have.state('focus', true)
+      dropdownIsFocused()
     })
 
     it('does not selected "disabled" item after blur', () => {
@@ -2728,7 +2723,7 @@ describe('Dropdown', () => {
       search.simulate('change', { target: { value: 'boo' } })
       search.simulate('keydown', { key: 'Enter' })
 
-      wrapper.should.have.state('searchQuery', '')
+      wrapper.find('input.search').should.have.value('')
     })
   })
 
@@ -2796,7 +2791,7 @@ describe('Dropdown', () => {
       wrapper.simulate('keydown', { key: 'ArrowDown' })
 
       onChange.should.have.been.called()
-      wrapper.should.have.state('value', options[1].value)
+      wrapper.find('.item').at(1).should.have.className('active')
     })
 
     it('does not change value when set to false', () => {
@@ -2817,7 +2812,7 @@ describe('Dropdown', () => {
       wrapper.simulate('keydown', { key: 'ArrowDown' })
 
       onChange.should.not.have.been.called()
-      wrapper.should.have.state('value', value)
+      wrapper.find('.item').at(0).should.have.className('active')
     })
   })
 
diff --git a/test/specs/modules/Embed/Embed-test.js b/test/specs/modules/Embed/Embed-test.js
index 3cd3b13bd2..988302c43a 100644
--- a/test/specs/modules/Embed/Embed-test.js
+++ b/test/specs/modules/Embed/Embed-test.js
@@ -48,17 +48,21 @@ describe('Embed', () => {
 
   describe('active', () => {
     it('defaults to false', () => {
-      shallow(<Embed />).should.have.not.state('active')
+      mount(<Embed />).should.have.not.className('active')
     })
 
-    it('passes to state', () => {
-      shallow(<Embed active />).should.have.state('active', true)
+    it('applies className', () => {
+      mount(<Embed active />).should.have.className('active')
     })
 
     it('renders nothing when false', () => {
-      const children = 'child text'
+      const wrapper = mount(
+        <Embed>
+          <p id='foo' />
+        </Embed>,
+      )
 
-      shallow(<Embed>{children}</Embed>).should.not.contain(<div className='embed'>{children}</div>)
+      wrapper.should.not.have.descendants('#foo')
     })
   })
 
@@ -90,9 +94,8 @@ describe('Embed', () => {
 
   describe('defaultActive', () => {
     it('sets the initial active state', () => {
-      shallow(<Embed defaultActive />).should.have.state('active', true)
-
-      shallow(<Embed defaultActive={false} />).should.have.state('active', false)
+      mount(<Embed defaultActive />).should.have.className('active')
+      mount(<Embed defaultActive={false} />).should.have.not.className('active')
     })
   })
 
@@ -118,23 +121,18 @@ describe('Embed', () => {
   })
 
   describe('onClick', () => {
-    it('omitted when not defined', () => {
-      const click = () => shallow(<Embed />).simulate('click')
-      expect(click).to.not.throw()
-    })
-
-    it('updates state', () => {
+    it('sets to active state', () => {
       const wrapper = mount(<Embed />)
 
       wrapper.simulate('click')
-      wrapper.should.have.state('active', true)
+      wrapper.should.have.className('active')
     })
 
-    it('omits state update if active', () => {
+    it('skips state update if active', () => {
       const wrapper = mount(<Embed active />)
 
       wrapper.simulate('click')
-      wrapper.should.have.state('active', true)
+      wrapper.should.have.className('active')
     })
   })
 
diff --git a/test/specs/modules/Transition/Transition-test.js b/test/specs/modules/Transition/Transition-test.js
index 258cc6bc15..b951aae78b 100644
--- a/test/specs/modules/Transition/Transition-test.js
+++ b/test/specs/modules/Transition/Transition-test.js
@@ -8,7 +8,6 @@ import {
   TRANSITION_STATUS_ENTERING,
   TRANSITION_STATUS_EXITED,
   TRANSITION_STATUS_EXITING,
-  TRANSITION_STATUS_UNMOUNTED,
 } from 'src/modules/Transition/utils/computeStatuses'
 import * as common from 'test/specs/commonTests'
 import { sandbox } from 'test/utils'
@@ -39,12 +38,12 @@ describe('Transition', () => {
           </Transition>,
         )
 
-        wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
         animation.split(' ').forEach((className) => wrapper.should.have.className(className))
         wrapper.should.have.className('in')
 
         wrapper.setProps({ visible: false })
-        wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
         animation.split(' ').forEach((className) => wrapper.should.have.className(className))
         wrapper.should.have.className('out')
       })
@@ -58,12 +57,12 @@ describe('Transition', () => {
           </Transition>,
         )
 
-        wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
         wrapper.should.have.className(animation)
         wrapper.should.not.have.className('in')
 
         wrapper.setProps({ visible: false })
-        wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
         wrapper.should.have.className(animation)
         wrapper.should.not.have.className('out')
       })
@@ -76,11 +75,11 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       wrapper.should.have.className('jump')
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
       wrapper.should.have.className('jump')
     })
   })
@@ -153,11 +152,11 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       wrapper.should.have.className('in')
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
       wrapper.should.have.className('out')
     })
 
@@ -168,11 +167,11 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       wrapper.should.have.not.className('in')
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
       wrapper.should.have.not.className('out')
     })
   })
@@ -205,8 +204,8 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERED)
-      wrapper.should.have.not.state('nextStatus')
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.not.have.data('test-next-status')
     })
 
     it('sets statuses when `visible` is false', () => {
@@ -216,8 +215,7 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_UNMOUNTED)
-      wrapper.should.have.not.state('nextStatus')
+      wrapper.should.have.not.descendants('p')
     })
 
     it('sets statuses when mount is disabled', () => {
@@ -227,8 +225,8 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITED)
-      wrapper.should.have.not.state('nextStatus')
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.not.have.data('test-next-status')
     })
   })
 
@@ -250,7 +248,7 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       wrapper.should.have.style('animation-duration', '500ms')
     })
 
@@ -261,7 +259,7 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       wrapper.should.have.style('animation-duration', '1000ms')
     })
 
@@ -272,7 +270,7 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       wrapper.should.have.style('animation-duration', '2000ms')
     })
 
@@ -283,7 +281,7 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITED)
       wrapper.should.not.have.style('animation-duration')
     })
 
@@ -295,7 +293,7 @@ describe('Transition', () => {
       )
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
       wrapper.should.have.style('animation-duration')
     })
 
@@ -306,7 +304,7 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       wrapper.should.have.style('animation-duration', '1000ms')
     })
 
@@ -318,7 +316,7 @@ describe('Transition', () => {
       )
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
       wrapper.should.have.style('animation-duration', '1000ms')
     })
   })
@@ -331,11 +329,11 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_EXITED)
     })
 
     it('updates status when set to false while ENTERED', () => {
@@ -344,11 +342,11 @@ describe('Transition', () => {
           <p />
         </Transition>,
       )
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERED)
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_EXITED)
     })
 
     it('updates status when set to true while UNMOUNTED', () => {
@@ -357,12 +355,11 @@ describe('Transition', () => {
           <p />
         </Transition>,
       )
-
-      wrapper.should.have.state('status', TRANSITION_STATUS_UNMOUNTED)
+      wrapper.should.have.not.descendants('p')
 
       wrapper.setProps({ visible: true })
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_ENTERED)
     })
 
     it('updates next status when set to true while performs an ENTERING transition', (done) => {
@@ -372,11 +369,11 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_EXITED)
     })
 
     it('updates next status when set to true while performs an EXITING transition', (done) => {
@@ -386,15 +383,15 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERED)
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_EXITED)
 
       wrapper.setProps({ visible: true })
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_ENTERED)
     })
   })
 
@@ -474,14 +471,14 @@ describe('Transition', () => {
       )
 
       wrapper.setProps({ visible: false })
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
 
       setTimeout(() => {
-        wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
       }, 100)
       setTimeout(() => {
         onHide.should.have.been.calledOnce()
-        wrapper.should.have.state('status', TRANSITION_STATUS_EXITED)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITED)
 
         done()
       }, 200)
@@ -498,13 +495,13 @@ describe('Transition', () => {
 
       wrapper.setProps({ visible: false })
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_EXITED)
 
       wrapper.setProps({})
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_EXITING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_EXITED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_EXITED)
 
       onStart.should.have.been.calledOnce()
       done()
@@ -541,14 +538,14 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
 
       setTimeout(() => {
-        wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
       }, 100)
       setTimeout(() => {
         onShow.should.have.been.calledOnce()
-        wrapper.should.have.state('status', TRANSITION_STATUS_ENTERED)
+        wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERED)
         done()
       }, 200)
     })
@@ -585,13 +582,13 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_ENTERED)
 
       wrapper.setProps({})
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_ENTERED)
 
       onStart.should.have.been.calledOnce()
       done()
@@ -619,38 +616,34 @@ describe('Transition', () => {
         </Transition>,
       )
 
-      wrapper.should.have.state('status', TRANSITION_STATUS_ENTERING)
-      wrapper.should.have.state('nextStatus', TRANSITION_STATUS_ENTERED)
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_ENTERING)
+      wrapper.find('p').should.have.data('test-next-status', TRANSITION_STATUS_ENTERED)
     })
   })
 
   describe('unmountOnHide', () => {
-    it('unmounts child when true', (done) => {
-      const onHide = () => {
-        wrapper.should.have.state('status', TRANSITION_STATUS_UNMOUNTED)
-        done()
-      }
-
+    it('unmounts child when true', () => {
       wrapperMount(
-        <Transition duration={0} onHide={onHide} transitionOnMount={false} unmountOnHide>
+        <Transition duration={0} transitionOnMount={false} unmountOnHide>
           <p />
         </Transition>,
       )
+
       wrapper.setProps({ visible: false })
+      wrapper.update()
+      wrapper.should.have.not.descendants('p')
     })
 
-    it('lefts mounted when false', (done) => {
-      const onHide = () => {
-        wrapper.should.have.state('status', TRANSITION_STATUS_EXITED)
-        done()
-      }
-
+    it('lefts mounted when false', () => {
       wrapperMount(
-        <Transition duration={5} onHide={onHide} transitionOnMount={false} unmountOnHide={false}>
+        <Transition duration={0} transitionOnMount={false} unmountOnHide={false}>
           <p />
         </Transition>,
       )
+
       wrapper.setProps({ visible: false })
+      wrapper.update()
+      wrapper.find('p').should.have.data('test-status', TRANSITION_STATUS_EXITED)
     })
   })
 })