23 Jan 2012 11:48 AM #1
Ui "stops" after some occasional dom error
I migrated to 4.1.0 beta 1 and there is an interesting error. My app has some windows. Most windows have a
tree panel to the left, tab panel to the right.
After opening and closing tabs, at some point, closing a tab results in a error. The tab closed disappears and a "hole" is created. Instead of the other tabs moving to the left to fill in the "hole", an exception is thrown instead. After that the ui is messed up.
Closing any other tab results in the same thing until at one point all the tabs just disappear. Resize the browser window and the maximized window will not even response.
If you close the window and open that window or any other window, what you see is not a window. Just some rect with the windows background. However, there is no title bar and non of the components are shown.
The only is to reload the page.
This is the 3rd time I see this error. Sorry I do not have snap shots.
Below is the error from firebug. Hope it helps
Uncaught Error: NOT_FOUND_ERR: DOM Exception 8 Ext.define.moveItem0.5:1 Ext.define.renderItems0.5:1 Ext.define.renderChildren0.5:1 Ext.define.invalidate0.5:1 Ext.define.invalidate0.5:1 Ext.define.invalidate0.5:1 Ext.define.invalidate0.5:1 Ext.define.flushInvalidates0.5:1 Ext.define.run0.5:1 Ext.define.statics.flushLayouts0.5:1 Ext.define.statics.updateLayout0.5:1 Ext.define.updateLayout0.5:1 Ext.define.doLayout0.5:1 Ext.define.remove0.5:1 Ext.define.closeTab0.5:1 Ext.define.onCloseClick0.5:1 Ext.define.onClick0.5:1 (anonymous function) c
23 Jan 2012 12:47 PM #2
- Join Date
- Mar 2007
- Gainesville, FL
- Vote Rating
When I get that error it usually has come down to trying to insert stale elements.
Sencha Inc, Senior Software Engineer
Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/
Need more help with your app? Hire Sencha Services firstname.lastname@example.org
Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!
When posting code, please use BBCode's CODE tags.
23 Jan 2012 12:58 PM #3
So what do I do about it? It happens when I'm closing tabs. I doubt I'm inserting anything at that point though I'll try and monitor which of the tabs cause that error to doo some further checks.
26 Jan 2012 9:45 AM #4
It happened again. This time, I had a tab panel with 2 tabs. I was scrolling though the content of the 2nd tab and the toolbar with the tabs disappears leaving behind just the background. I checked and it was the same DOM Exception.
Hope this helps. Will remember to take snap shots next time.
Is there any other data I should gather if it happens again to help fix the issue?
26 Jan 2012 10:31 AM #5
Are you reusing anything that has an id set on it? If you have 2 instances of something that have the same id and you remove one it can cause ux errors like this. Specifically with your tab example... If both tabs were the same component and they had the same id, closing one will break the other one...
26 Jan 2012 2:09 PM #6
That is a given but in my case, that is not. In today's issue for example, each tab has an extjs control in it. There are instances where I'm creating new dom elements but in this case, none of that was in the play.
Also, there is a function for getting ids and it uses the idea of ever increasing number, like extjs, so even in case, the ids will not repeat.
Lastly, had none of these issues in 4.0.7. Unless 4.1.0 beta 1 is sensitive all of a sudden.
I'm not really sure what the issue is but I'm guessing that some where along the line, when there is mouse move and those related events, dom element are created, destroyed, queries etc and somewhere along the line, an exception is thrown which leaves everything messed up.
29 Jan 2012 2:51 AM #7
Just upgraded to 4.1.0 beta 2 and got the error again. Looks like the stack trace is different this time. Below is the chrome output:
Uncaught Error: NOT_FOUND_ERR: DOM Exception 8