Lightbox issue on mdb 7.3.2


Topic: Lightbox issue on mdb 7.3.2

kostyaha pro premium 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.)


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?


kostyaha pro premium 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 pro premium 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.


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.


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
  • 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