Topic: Lightbox issue on mdb 7.3.2
Expected behavior Before update all works fine Actual behavior After update component lightbox does not init after turbo navigate and i have this error in console:
RangeError: Maximum call stack size exceeded
at String.replace (<anonymous>)
at O (mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:20:3393)
at D (mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:20:3551)
at Object.on (mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:20:4265)
at a_._appendToolbar (mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:39:176782)
at a_._appendTemplate (mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:39:175966)
at a_.init (mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:39:173699)
at new a_ (mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:39:173326)
at mdb.umd.min-ee2d9d18d7212ff17fda2231cf285dea345f9572f8afe71b3925ce59494c0ab6.js:44:85627
at Array.forEach (<anonymous>)
Resources (screenshots, code snippets etc.)
What was your previous version?
Can you prepare a snippet with code that results in the error?
- MDB5 Version: PRO 7.2.0 works well 7.3.1 , 7.3.2 raise error on
function O(t, e, i) {
const s = "string" == typeof e
, n = s ? i : e;
let o = t.replace(x, "");
const a = T[o];
a && (o = a);
return A.indexOf(o) > -1 || (o = t),
[s, n, o]
}
in my rails app with stimulus and turbo i init some mdb components with data attributes and some with stimulus controllers and component constructor as new mdb.Component(element) with Lightbox i have issue in this case
if i refreshes page Lightbox properly init but if i navigate to page with Lightbox it does't
Kamila Pieńkowska staff commented 10 months ago
Have you tried using Lightbog getOrCreateInstace method on pageload?
It initiates component only if it needs it.
jseird pro premium priority commented 9 months ago
Same here. Works until 7.3.0 When initialized manually via JS: mdb.Lightbox.getOrCreateInstance(document.getElementById('lightbox')) the stack size error also shows up.
Thanks for reporting. I see that init via JS doesn't work sometimes, but I don't get a stack size error. Try this solution:
const lightboxEl = document.querySelector('#lightbox')
lightboxEl.dataset.mdbLightboxInit = true;
const Lightbox = mdb.Lightbox
mdb.initMDB({Lightbox})
If you still have an error, let me know. We will try to fix init via JS as soon as possible.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 7.3.2
- Device: Mac
- Browser: All
- OS: MacOS
- Provided sample code: No
- Provided link: No