When using KendoUI widgets with ES6 modules, those widgets' pop-up elements become detached from their respective controls as you scroll down the web page, making them pretty well useless. The issue happens on IE 11 and Firefox, but not Chrome.
I'm using Babel to transpile the ES6 code and modules into ES5-compatible code, and Webpack for my module loader. I've tried to follow the Telerik documentation athttp://docs.telerik.com/kendo-ui/third-party/webpack, although that uses CommonJS style requires rather than ES6/Babel. Is that the problem, maybe?
I thought, at first, that it might be a problem with Webpack, so I tested it a second time with SystemJS, again following theTelerik documentation athttp://docs.telerik.com/kendo-ui/third-party/systemjs, although again, that uses CommonJS style requires rather than ES6/Babel.
I've set up Github repositories that demonstrate the problem here:
Follow the Readme instructions to install (requires Node/npm). The readme files for both repositories show screenshots of the problem. For convenience, the examples in the two repositories use the open source version of Kendo, but the same problem occurs in the Pro version. The examples use the Kendo DatePicker control, but it happens in other controls too, such as the Kendo DropDown control, and the filter boxes that you get at the top of the Kend Grid.
If I can't find a solution to this, then I may have to rewrite my current project to abandon the use of ES6 and modules altogether, and go back to dumb script tags with everything in global scope. Needless to say, that will not be a happy time for me, so any assistance will be gratefully received!!!