Error: "Dropdown: This module requires ui transitions"

[dsnoeck]

I'm working on a webapp where I'm using only a selection of Semantic-UI components, including dropdown, transition, item, menu, input, form and a few other.

In order to ensure transition is available, I'm using it successfully in the same page.

Unfortunately, the dropdown is not working and output the following error when I click on it: Dropdown: This module requires ui transitions <https://github.com/Semantic-Org/UI-Transition> slide down.

After digging into the dropdown.js file, I found that it fails at this line: else if($.fn.transition !== undefined && $module.transition('is supported')) { Both $.fn.transition and $module.transition are undefined.

I know that dropdown is working well if I use the full semantic-ui package. So does someone have any tip in how should I use it as a separated component ?

[itainoam]

You need to include semantic-ui-transition.

[dsnoeck]

thanks @itainoam, but if you read my previous message, I wrote:

In order to ensure transition is available, I'm using it successfully in the same page.

[jlukic]

If transition was available in the page $.fn.transition will be defined.

[timkelty]

The docs state:

Fade and slide down are available without including ui transitions

…which appears to not be the case, transitions js seems to be required. Not only that, but if you don't include the transition css, you will get this error: https://github.com/Semantic-Org/Semantic-UI/issues/3960

https://semantic-ui.com/modules/dropdown.html#/settings