Background: We have used ExtJS 6 to develop our application. In one of the view we have used dataview inside Tab panel. Scrollable is enabled for this dataview. We have specified X-UA-Compatible mode to Edge. Working condition: Windows 7 + IE11 (Edge mode) + Smart Card authentication Not working condition: Windows 10, IE11(non Edge mode) + Virtual Smart Card authentication (although this condition is not sure)
Issue: This view renders perfect on Windows 7 platform on Chrome as well as IE11 (Edge mode by default). It shouts out issue while rendering on Windows 10 platform on IE 11. On this platform, IE11 doesn't have Edge mode in IE11 browser (separate Edge browser available), hence the application runs in IE11 mode itself by default. While rendering this view even before the data is loaded, it throws error as "can not access n.dom from null or undefined" (I may not have written exact error description).
Analysis: On analysis it is found that, refresh method of dataview is being called somehow, and it doesn't find its target element. Exact location of error is in refresh method of dataview at me.getTargetEl(). On troubleshooting it is found that the scroll feature (enabled by scrollable:true) is trying to refresh view even before it is rendered, hence it doesn't find the target DOM element.
Resolution: Although, we didn't find solution within ExtJS, we disabled scrollable for dataview and rendered scroll by style using overflow property. e.g. style: { overflow: 'auto'} This resolved the issue as scroll is added without scrollable being enabled.
Posting the resolution as the answer.
Analysis: On analysis it is found that, refresh method of dataview is being called somehow, and it doesn't find its target element. Exact location of error is in refresh method of dataview at me.getTargetEl(). On troubleshooting it is found that the scroll feature (enabled by scrollable:true) is trying to refresh view even before it is rendered, hence it doesn't find the target DOM element.
Resolution: Although, we didn't find solution within ExtJS, we disabled scrollable for dataview and rendered scroll by style using overflow property. e.g. style: { overflow: 'auto'} This resolved the issue as scroll is added without scrollable being enabled.