I sat down this morning with the intention of migrating my application from ExtJS 2.2.1 to ExtJS 3.0. Although I’ve been playing with version 3.0 for some time, I was a bit worried that my application (containing more than 20,000 lines of code and many custom objects/extensions) would all but explode. Granted, ExtJS 3.0 didn’t change so dramatically from 2.0 – but with so much custom code I simply wasn’t looking forward to today.
Also, due to the massive CSS changes in 3.0, I have to create a brand new skin to match the “Slickness” we had been using. That’s a task unto itself and I won’t worry about that for now. Expect a follow-up post on that subject.
After importing the 3.0 source code, I logged into my application. I was happy to find that all but one screen rendered and functioned normally (minus one annoying “targetNode is undefined” error). Fantastic! The only page that didn’t render hit an error on one of my Ext.Toolbar objects, giving me a “toolbar.items.itemAt(0).items is undefined” error. ExtJS did change the way Toolbars and Menus behave slightly in 3.0, so I wasn’t surprised to find an issue like this. A quick edit to that one line of code fixed the problem.
. . .and that was it. I’m utterly floored by how nothing broke.Kudos to you ExtJS!
Next up will be going through each custom over-ride and user extension (UX) to see if they’re still necessary.
Last but not least will be a new skin. Seeing how there’s a lack of 3.0 skins (aka “themes”) available on the message boards I’ll probably offer mine to the community when complete. Hopefully that will be done by the end of next week.






so you never even told us what you changed ?!?!
Doug,
You are correct in pointing out that I didn’t say what exactly I had to fix to complete the upgrade from 2.2.1 to 3.0.0
To fix the “toolbar.items.itemAt(0).items is undefined” error, it’s simply a matter of using the updated API references. That line should have been (in my particular case) “toolbar.items.itemAt(0).menu”.
As for the “targetNode is undefined” error I saw, my problem was that I attempted to expand all nodes in my tree before the nodes had finished loading. I moved my “tree.expandAll()” call into the “render” event to avoid that issue.
That was it for my application. Like I said, I didn’t have to do much to get things working.