Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Lightbox issue on mdb 7.3.2

kostyaha priority asked 5 months ago


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.)


Grzegorz Bujański staff answered 4 months ago


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.


kostyaha priority answered 5 months ago


  • 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 5 months ago

Have you tried using Lightbog getOrCreateInstace method on pageload? It initiates component only if it needs it.


jseird priority commented 4 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.


Kamila Pieńkowska staff answered 5 months ago


What was your previous version?

Can you prepare a snippet with code that results in the error?



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • 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