Search code examples
javascriptreactjsjsfiddle

Running react-tippy in jsfiddle


How can I run react-tippy library in jsfiddle?

I get error message Tooltip is not defined, but script is imported.

jsfiddle

Tooltip example

<Tooltip
  // options
  title="Welcome to React"
  position="bottom"
  trigger="click"
>
  <p>
    Click here to show popup
  </p>
</Tooltip>

Solution

  • Two issue. You are loading UMD module of reactTippy. So the module is not loading Tooltip in global scope. So you need to add below at the top of your JSFiddle

    const Tooltip = reactTippy.Tooltip;
    

    or

    const {Tooltip} = reactTippy.Tooltip;
    

    Next your also missing a UMD import of popper.js

    https://unpkg.com/popper.js@1.14.3/dist/umd/popper.js

    Below is the updated JSFiddle

    https://jsfiddle.net/uLg4n2gg/7/

    Working tooltip