View Full Version : [1.1.0] Ext.regApplication is not compatible with application profiles

8 Aug 2011, 8:34 AM
If you are using application profiles and Ext.regApplication there is a bug in Ext.Contoller.render()...
The bug is in setting a local variable profile as either the current profile string or the current application instance.
It then calls profile.getRenderTarget() which will obviously fail when the profile is set to a string!

See attached code (renamed to .js.txt for the uploader) for an example of the bug.

Work around if you still want to use profiles, use either:

MyApp = new Ext.Application({ ... });


MyAppDefinition = Ext.extend(Ext.Application, { ... });
MyApp = new MyAppDefinition();




25 Oct 2011, 7:06 AM

I have the same problem and I'm interested to know if there is any solution to keep the "Ext.regApplication" (for MVC) and still use "profiles:".

If I use any of your suggestions (new Ext.Application - or - Ext.extend(Ext.Application...)) then I will not be able to keep the current MVC structure of the application since I get the following error:

"Uncaught TypeError: Cannot read property 'viewport' of undefined"

I guess this means my viewport is not visible in Controllers anymore.


26 Oct 2011, 12:53 AM
It's the controller that is missing a reference to the app.

You set it manually as follows:

In the Application

launch: function() {

// load styles by device
Ext.Mobile.log('app launched ... ');

controller: 'MainController',
action: 'doLaunch',
app: this


Then in the Controller method

doLaunch: function(params){

// set up reference to application since we can't use regApplication
this.app = params.app;

// etc etc ....


26 Oct 2011, 1:20 AM
Hello Cathy,

I tried the solution you suggested but I get the same error, maybe is something that I'm doing wrong or maybe my application structure is different, here you may see it:

File: App.js

name: 'MyApp',
defaultUrl: 'Home/index',

launch: function()
// Init the Viewport
this.viewport = new MyApp.views.Viewport();

profiles: {
portraitPhone: function() {
return Ext.is.Phone && Ext.orientation == 'portrait';
landscapePhone: function() {
return Ext.is.Phone && Ext.orientation == 'landscape';
portraitTablet: function() {
return !Ext.is.Phone && Ext.orientation == 'portrait';
landscapeTablet: function() {
return !Ext.is.Phone && Ext.orientation == 'landscape';

File: HomeController.js

Ext.regController('Home', {
// Index action
index: function(options) {
if (!this.indexView) {
this.indexView = this.render({
xtype: 'HomeIndex'

this.application.viewport.setActiveItem(this.indexView, options.animation);

I have changed in "App.js" the "Ext.regApplication" to "new Ext.Application" and added your code to "launch:" (of course changing the controller name).

Then, in "HomeController.js" I have added your code for "doLaunch" and I still get the same error after I access the application in Google Chrome:

Uncaught TypeError: Cannot read property 'viewport' of undefined (HomeController.js:10)

This line here:

this.application.viewport.setActiveItem(this.indexView, options.animation);

28 Oct 2011, 1:37 AM

Try changing theses lines in the controller doLaunch method

// set up reference to application since we can't use regApplication
this.app = params.app;


// set up reference to application since we can't use regApplication
this.application = params.app;

You can see in the error message you get that in the Controller (this) it is failing to find a reference to this.application not this.app as I had in my snippet.

Hint - in Chrome debugger in the Script panel you can set a break point to trigger before an exception is thrown - allowing you to inspect the relevant objects.

G (http://code.google.com/chrome/devtools/docs/scripts-breakpoints.html#js_exceptions)ood luck!


28 Oct 2011, 1:49 AM
Hey Cathy,

Thanks for your time, help and hint. I will give it a shot later this afternoon and I will let you know if it works.

Thank you again for your time,


Philip Murphy
9 Nov 2011, 9:38 AM
Hi Luigi - facing the same problem. Did this work for you in the end? I tried to change over to new Ext.Application, but I still see the problem.

As pointed out, in the Sencha render method the following code is broken as profile is a string at this point.

render: function(config, target) {
profileTarget = profile ? profile.getRenderTarget(config, application) : target;



PS thanks for posting work-around Cathy.

6 Dec 2011, 12:00 PM
Does anyone have any update on this, the work around didn't work for me. Perhaps we could modify the root of the problem itself?

Has anyone submitted a bug?

Sencha team, thoughts?

20 Dec 2011, 11:00 AM

3 Jan 2012, 9:01 AM
Can the Sencha team please acknowledge this bug?

28 Feb 2012, 6:13 AM

I'm facing the same problem. Any news here??

Does anyone have a working example?

5 Mar 2012, 8:03 AM
It's the controller that is missing a reference to the app.

I suspect that other controllers will miss the reference too?

5 Mar 2012, 8:18 AM
There is no update, I believe this was abandoned in favor of ST2 which btw does not implement setProfile. You really need to roll your own solution with this. I'd recommend that you go the route of ST2 which handles the orientation change better. See: http://www.sencha.com/forum/showthread.php?182950-MVC-Profiles-amp-Orientation-Change

5 Mar 2012, 9:14 AM
Thank you jnotti, i believe you are right and 1.x branch is abandoned.