View Full Version : [FIXED] Border layout resize issue (if touchscreen is present)

11 Apr 2014, 6:37 AM
Ext version tested:

Browser versions tested against:

Chrome 34
DOCTYPE tested against:


If border layout in a viewport is resized from outside, it collapses vertically (gets zero height).
Steps to reproduce the problem:

run: sencha generate app ...
run: sencha app watch
open: http://localhost:1841
resize browser window / open dev toolbar / otherwise change the viewport size
The result that was expected:

Laoyout works as intended
The result that occurs instead:

Blue screen of death

11 Apr 2014, 7:42 AM
Not really clear on what the issue is here. See the attached screenshot, I've opened the toolbar & resized the window fairly small. Can you elaborate?

11 Apr 2014, 9:14 AM
Ok, I tried to isolate a problem a bit further. Here's what I found out so far:
- cannot reproduce in fiddle
- cannot reproduce in local "sandbox": putting unmodified MainModel.js, MainController.js and Main.js contents in a script tag with included ext-all.js and theme css works fine (no bug)
- the bug occurs with a clean project generated by "sencha generate app -ext vanilla ./vanilla" when you load a page from "sencha app watch".
- if you let "sencha app watch" do it's magic, stop it and host this folder under IIS, the bug is there too
- does not reproduce in Firefox
- can reproduce in IE11, Chrome 34 and Canary
- if I remove one of the panels and change layout to 'fit', everything works fine, so the problem is with 'border' only as it seems.

I'm totally puzzled. Console has no errors.

P.S. Yeah, I'm on Windows

Edit: Just re-read your answer, so just to be sure we talk about the same thing: You have to resize the viewport after the page was rendered. Even a 1px change of height/width will make it re-layout and collapse.

11 Apr 2014, 10:50 AM
Re: your edit, that's what I had. Started out with a maximized window, subsequently opened the devtools & then resized.

I also generated an app using Cmd, wasn't using a Fiddle. Can you post a screen grab? Also perhaps a peek at the DOM inspector.

11 Apr 2014, 11:06 AM
Sure, here's how it looks

Also, here's the project as it was generated on my machine: https://www.dropbox.com/s/etwuspfoptok7im/vanilla.zip

11 Apr 2014, 1:14 PM
I also can't reproduce it with the project you sent over. I tested it in Chrome 34, FF 27.01 & IE11.

Are you sure it's not just a bug in Canary?

11 Apr 2014, 1:33 PM
Yes, because Chrome 34 and IE 11 are also affected.
I also tried to unzip that on a different machine (WS2012 R2) under IIS and use IE 11 installed there. The issue is reproduced.

I guess you probably used "sencha app watch"? What if it is the Cmd's fault then and yours just fixed it?
Can you try my archive "as is" with some web server and not the Cmd?
If the issue will be reproduced (and I suspect it will), maybe you could generate an identical app, "watch" it and then compare the folders to see where they differ.

My Sencha Cmd is running on Windows 8.1 64-bit.

11 Apr 2014, 2:38 PM
When I tested your I did extract it as-is, didn't use watch, just loaded it up in my local Apache instance. Odd...

11 Apr 2014, 2:49 PM
Ok... a very stupid theory: what if that's because my laptop has a multitouch screen?

11 Apr 2014, 7:11 PM
That is possible. I don't have a device to test with on-hand at the moment. I'll get one of the other devs to check it out.

14 Apr 2014, 3:17 AM
I can now confirm that the issue is with touch device being present, because if I disable "HID-compliant touch screen" in device manager and restart the browser, the issue disappears.

14 Apr 2014, 11:57 PM
Thanks for the report! I have opened a bug in our bug tracker.