Blueprint: Issue using Tooltips in v2.0.1

[scottfr]

Bug report

• __Package version(s)__: 2.0.1
• __Browser and OS versions__: Chrome 65

Steps to reproduce

Porting a Blueprint 1.X app to 2.0.1. I have a variety of usages in the app which worked fine in 1.X. When I run the app after upgrading to 2.X and hover over the element that contains the tooltip I now get the following error. Note this happens at the moment the cursor hovers over the element.

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `Blueprint2.Overlay`.
    in Blueprint2.Overlay (created by Blueprint2.Popover)
    in span (created by Manager)
    in Manager (created by Blueprint2.Popover)
    in Blueprint2.Popover (created by Blueprint2.Tooltip)
    in Blueprint2.Tooltip (at ElementWithTooltip.js:20)

[scottfr]

Looks like I needed to install react-transition-group. That addressed the error.

[RickCarlino]

@scottfr Thanks for pointing this out. I hit the same issue after an upgrade as well.

This issue was particularly tricky because, when attempting to reproduce the error in a seperate isolated repo, I did not need to install react-transition-group- the popovers worked fine.

Installing react-transition-group in the "real" repo did the trick, though.

Pasting error log below for maximum visibility to anyone else that is hitting this error and searching Google:

warning.js:33 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `Blueprint2.Overlay`.
    in Blueprint2.Overlay (created by Blueprint2.Popover)
    in span (created by Manager)
    in Manager (created by Blueprint2.Popover)
printWarning @ warning.js:33
warning @ warning.js:57
createElementWithValidation @ react.development.js:1296
Overlay._this.maybeRenderChild @ overlay.js:34
mapSingleChildIntoContext @ react.development.js:880
traverseAllChildrenImpl @ react.development.js:753
traverseAllChildren @ react.development.js:824
mapIntoWithKeyPrefixInternal @ react.development.js:900
mapChildren @ react.development.js:922
./node_modules/@blueprintjs/core/lib/esm/components/overlay/overlay.js.Overlay.render @ overlay.js:99
finishClassComponent @ react-dom.development.js:8389
updateClassComponent @ react-dom.development.js:8357
beginWork @ react-dom.development.js:8982
performUnitOfWork @ react-dom.development.js:11814
workLoop @ react-dom.development.js:11843
renderRoot @ react-dom.development.js:11874
performWorkOnRoot @ react-dom.development.js:12449
performWork @ react-dom.development.js:12370
performSyncWork @ react-dom.development.js:12347
interactiveUpdates @ react-dom.development.js:12597
interactiveUpdates @ react-dom.development.js:1958
dispatchInteractiveEvent @ react-dom.development.js:4259
invariant.js:42 Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `TransitionGroup`.
    at invariant (invariant.js:42)
    at throwOnInvalidElementType (react-dom.development.js:5393)
    at createFiberFromElement (react-dom.development.js:5364)
    at createChild (react-dom.development.js:7554)
    at reconcileChildrenArray (react-dom.development.js:7805)
    at reconcileChildFibers (react-dom.development.js:8121)
    at reconcileChildrenAtExpirationTime (react-dom.development.js:8240)
    at reconcileChildren (react-dom.development.js:8231)
    at updateHostComponent (react-dom.development.js:8539)
    at beginWork (react-dom.development.js:8986)
invariant @ invariant.js:42
throwOnInvalidElementType @ react-dom.development.js:5393
createFiberFromElement @ react-dom.development.js:5364
createChild @ react-dom.development.js:7554
reconcileChildrenArray @ react-dom.development.js:7805
reconcileChildFibers @ react-dom.development.js:8121
reconcileChildrenAtExpirationTime @ react-dom.development.js:8240
reconcileChildren @ react-dom.development.js:8231
updateHostComponent @ react-dom.development.js:8539
beginWork @ react-dom.development.js:8986
performUnitOfWork @ react-dom.development.js:11814
workLoop @ react-dom.development.js:11843
callCallback @ react-dom.development.js:100
invokeGuardedCallbackDev @ react-dom.development.js:138
invokeGuardedCallback @ react-dom.development.js:187
replayUnitOfWork @ react-dom.development.js:11318
renderRoot @ react-dom.development.js:11885
performWorkOnRoot @ react-dom.development.js:12449
performWork @ react-dom.development.js:12370
performSyncWork @ react-dom.development.js:12347
interactiveUpdates @ react-dom.development.js:12597
interactiveUpdates @ react-dom.development.js:1958
dispatchInteractiveEvent @ react-dom.development.js:4259
react-dom.development.js:9643 The above error occurred in the <div> component:
    in div (created by TransitionGroup)
    in TransitionGroup (created by Blueprint2.Overlay)
    in Blueprint2.Portal (created by Blueprint2.Overlay)
    in Blueprint2.Overlay (created by Blueprint2.Popover)
    in span (created by Manager)
    in Manager (created by Blueprint2.Popover)
    in Blueprint2.Popover (created by Foo)

React will try to recreate this component tree from scratch using the error boundary you provided, ErrorBoundary.

[giladgray]

r-t-g is a peer dependency alongside react and react-dom. this is called out clearly in the getting started docs.