Adapt Learning Community: Trickle not working with Tabs component in Firefox

I am having an issue with the Trickle functionality in Firefox (53.0.2), specifically upon completion of the adapt-tabs component. The disabled continue button appears at the bottom of the component when scrolling to the bottom of the component, but once all tabs have been selected the continue button does not enable. Otherwise Trickle works with all other components in the course.

Here is a sample of the Trickle setup for a block with tabs:

"_trickle": {
"_isEnabled": true,
"_autoScroll": true,
"_scrollDuration": 300,
"_scrollTo": "@block +1",
"_button": {
"_isEnabled": true,
"_styleBeforeCompletion": "visible",
"_styleAfterClick": "hidden",
"_isFullWidth": true,
"_autoHide": true,
"_className": "",
"text": "Continue",
"startText": "Begin",
"finalText": "Finish",
"_component": "trickle-button"
},
"_stepLocking": {
"_isEnabled": true,
"_isCompletionRequired": true,
"_isLockedOnRevisit": false
}
}

When reviewing the console in Firefox I get the following reference errors.

reference error in firefox

Any help would be appreciated,

Josi

Hi Josi,

It works for me without errors in Firefox (53.0.2).

Do you have last version of tab and trickle?

Show parent | Reply

Thanks for your suggestion. It turns out we were using an outdated tabs component that wasn't compliant with the latest adapt, but we made custom mods to the new adapt component to have the features we wanted from the old one yet still work with adapt 2.0.

Show parent | Reply

Hi Josi,

Have you tried adding "_onChildren": false, to Trickle's properties?

I had an issue with Trickle getting in a tangle when I didn't set that on a blockSlider recently - maybe tabs works the same.

Chris

Show parent | Reply

Thanks for the suggestion. The issue was an outdated tabs component that wasn't compliant with the latest version of adapt.

Show parent | Reply