Topic: Modals : error in browser console when using icons in buttons

efilippi priority asked 3 years ago

Hello, there is a problem on modal button when adding an icon instead of text in the button.

Expected behavior

no error in console

Actual behavior

error in console :

Uncaught TypeError: 'querySelector' called on an object that does not implement interface Element.
    findOne selector-engine.js:26
    r modal.js:86
    Gb mdb.min.js:316
    r modal.js:80
    n modal.js:345
    e event-handler.js:119
    C event-handler.js:200
    on event-handler.js:228
    n modal.js:335
    Webpack 4

Resources (screenshots, code snippets etc.)

see here, I copied the button and then added an icon. the first button is ok, the second one gets an error.

softcon premium commented 3 years ago

I don't see the error

efilippi priority answered 3 years ago

Thnaks, it works.

is it a turn around or a normal behavior ? (I'm not fond of using "style" attributes instead of standard mdb classes in my code ...)


Michał Duszak staff commented 3 years ago

You can also use classes. In this case it's .pe-none, so the element will look like this

efilippi priority answered 3 years ago


class pe-none is the best yhing to do ! thanks !

Michał Duszak staff answered 3 years ago

Hello, adding pointer-events: none to your <i> element should do the thing. Try this snippet:

efilippi priority answered 3 years ago

I checked with :

Edge : no error

Chrome : no error

Firefox : error

with just the mdb snippet window opened, so it's not an environment point.

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: 3.2.0
  • Device: computer / smartphone
  • Browser: firefox
  • OS: Debian
  • Provided sample code: No
  • Provided link: Yes