*Expected behavior*I have a page with a datetimepicker object that needs yyyy-mm-dd instead of dd-mm-yyyy, so I need to instantiate it using Javascript. I can have multiple datepickers per page, so I made a generic javascript file that can instantiate an array of components (see snippet).

Actual behavior

I have 2 issues with this datepicker: 1. it will not respect the form-outline css class (and thus not show an outline around the input) unless I explicitly have a date-mdb-input-init data attribute on the component I'm instantiating the datetimepicker on; 2. When I'm selecting something, I get an exception in the JavaScript console:

mdb.umd.min.js:20 
 Uncaught 
TypeError: Illegal invocation
    at Object.findOne (mdb.umd.min.js:20:7124)
    at ib._updateHeaderDate (mdb.umd.min.js:39:303521)
    at ib._handleDateSelection (mdb.umd.min.js:39:303396)
    at HTMLDivElement.<anonymous> (mdb.umd.min.js:39:302964)
    at HTMLDivElement.i (mdb.umd.min.js:20:4008)

When I look at ib._updateHeaderDate, it tries to run this code:

const s = B.findOne(".datepicker-date-text", this.container)

but this.container is null which makes it error out in the next step in the stack. It appears it does not configure the container property when creating a datepicker as part of a datetimepicker. I've tried adding container: "body" to the datetimepicker, datepicker and timepicker options but it didn't fix it, and I tried it with a 7.3.2 snippet and that didn't fix it either.

Note that while it does throw this error, it does not actually break the component: the value is set properly in the page.

Resources (screenshots, code snippets etc.)

gif showing the problem:

snippet to test yourself: https://mdbootstrap.com/snippets/standard/ikan_nak/6153616#html-tab-view