Topic: Uncaught TypeError: this._loadingIcon is null

StanislawS priority asked 1 year ago

No errors on simple import of the mdb-Lib

Simple include of the mdb-lib (and also single modules) throws an uncaught typeerror in the browser console.

Uncaught TypeError: this._loadingIcon is null

enter image description here

Kamila Pieńkowska staff answered 1 year ago

We considered checking this and similar cases and stopping code execution if the element doesn't exist. Still, we concluded that it would add considerable and unnecessary bulk to the package and eliminate error messages that make debugging easier.

In this case, you used class "loading" that triggers auto init of loading management, yet you did not add all necessary elements. We plan to change auto init from classes to data attributes to prevent that kind of situation.

StanislawS priority answered 1 year ago

I did found the issue.

The problem lies in the poor MDB programming. As soon as there is an element with the "loading" class in the DOM, the error occurs because it is accessed in the loading-managment module and attempts to access other elements within the element. However, this is done without any check whether they are really present.

Some extracts from the source code..

*const SELECTOR_LOADING = '.loading'; const SELECTOR_LOADING_ICON = '.loading-icon'; const SELECTOR_LOADING_TEXT = '.loading-text';*

*this._loadingIcon = SelectorEngine.findOne(SELECTOR_LOADING_ICON, this._element); this._loadingText = SelectorEngine.findOne(SELECTOR_LOADING_TEXT, this._element);*

this crashes because this._loadingIcon and this._loadingText are null

*const spinnerCloned = this._loadingIcon.cloneNode(true); const loadingCloned = this._loadingText.cloneNode(true);*

this also

*this._loadingIcon.remove(); this._loadingText.remove();*

To be honest I am quite disappointed

Kamila Pieńkowska staff answered 1 year ago

I'm sorry but I need more details. How are you making your imports? Do you use any framework or bundler? Do you have some HTML or JS code that tries to use MDB package?

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 6.1.0
  • Device: MacBook
  • Browser: Firefox 109.0
  • OS: OSX
  • Provided sample code: No
  • Provided link: No