A few useful notes for those who are about to migrate from ExtJS 4.2.x to Extjs 5.0.0.
Important: There is a detailed upgrade guide from Sencha. This blog post is intended to point out my subjective experience while following Sencha instructions.
Replace direct config access with appropriate get/set methods
If you have been using direct access to for example extraParams property on proxy, switch to using getExtraParams()/setExtraParams() in ExtJS 5.
Always declare model for the store
In ExtJS 4, it was possible to create stores without explicitly declared models. This is useful in a situation when you define grid’s fields and columns in the backend and then use reconfigure method on grid to apply the metadata. Fortunately, this is possible with ExtJS 5 as well, but there is a small change: if you create store without model in ExtJS 5, you’ll run into problems – for example when using sorting.
Solution is to create “generic” model class with no fields, and declare it as a model of the store which had no model declared before (the store bound to the grid for which you have been using the reconfigure method).
Parsing error when using index.xhtml (instead of index.html)
If you serve your ExtJS application from Java webserver, chances are that you use index.xhtml with some JSP/JSF tags. This worked fine with ExtJS 4, however, after upgrade to ExtJS 5 with default settings, you’ll run into something like this (in case of JBoss server):
JBWEB000065: HTTP Status 500 - Error Parsing /index.xhtml: Error Traced The entity name must immediately follow the '&' in the entity reference.
This is caused by the fact that ExtJS 5 uses microloader (like Sencha Touch), and this code is by default embedded into page. What we need is to have manifest as a separate resource, so that JBoss have his peace of mind again. Navigate to the src/main/webapp/.sencha/app/defaults.properties and change following line to “false”:
# whether to include the page's manifest.json code with the
# microloader content. Production.properties files should set this to
# false to have app.json exist as a server resource.
build.enable.embedded.manifest=truefalse
Developing with ExtJS 4 and ExtJS 5 on one machine
If you are maintaining ExtJS 4.2.x and ExtJS 5.0.0 apps on the same machine and you have upgraded to Sencha CMD 5, I recommend to keep Sencha CMD 4 and build your ExtJS 4.2.x app with it (until you migrate all apps to ExtJS 5). I had couple of issues when building ExtJS 4.2.1 app with Sencha CMD 5, for example grid loading mask did not dissappear after store load.
Finally, don’t forget to fix these messages:
[W] [Ext.Loader] Synchronously loading 'Ext.chart.series.Bar'; consider adding Ext.require('Ext.chart.series.Bar') above Ext.onReady
by using require.
Have fun and share a link to your ExtJS 5 application in comments!