Positioning issue

[Armen Janamyan]

Hi to All.
We have a product, and there is issue, which i can not find where comes from.
Issue exists only in Firefox.
All components we have, are rendering in viewport. So there is no scrolling need in body. Also there are many windows, which we create on button clicks, and those windows are requiring other files, for its needs. And there is one window, which requires about 20 files. And if internet connection is slow, on window creation first time, when files are not in browser cache, issue is reproduced.
Window is opening in incorrect position. Window should be opened in center of screen, where cordinates are, for instance x: 200, y :150, but it is opened in bottom of the screen, where cordinates are x: 200, y: 1100. I dig into issue some days, and find that when window are creating, there is scrollTop coordinate, which should be 0, but it is big number, about 800 - 1000. Also i find the reson of this. When we are creating window, ExtJs creates it in bottom of the screen, and then correcting the position. But in firefox, when window creates in bottom of the page, browser scrolles the screen to down, in reason of which, emerge this scrollingTop.
So, which class, function is responsible to scrolling the screen to down? Or if i don't go in correct way, where can i look, for find the issue?
If in two words, window is opened in bottom of the screen, but should be oppened in the center.

[joel.watson]

Hi--

Can you create a test case to demonstrate this issue (https://fiddle.sencha.com)? If so, I'll be happy to test this along with you.

Thanks!
Joel

[Armen Janamyan]

Hi Joel. At first thank you for quick response.
Problem is, that i can't imitate this situation on fiddle. We have lots of code in client and server side, and i don't know which part of code brings this issue.
In globally, we are creating the window by create method, which requires files it need, those files can require other files also, Files are classes, which extends ExtJs base components, some of them loading data from server, by AJAX request, masking before load, and then unmask.
And after create method, we call show method, like this...
var window = Ext.create("myWindowClassName", {some configs here});
window.show();
Window is modal.
I think this can be masking issue, For instance we are creating the window, at first step window creates in bottom of the screen, after that some component in this window starting to load some data from server, and masking itself, and as mask is in bottom of the screen, some method scrolls screen down, supposing that this is active component, which should be visible. Or maybe all this happens when we are calling show method.
And as screen scrolled down, positioner method aligns window to center. And when mask disappears, screen scrolls to top, and window stays in bottom part of the screen.

So, can you help me to find method, which is responsive for scrolling, where i will try to find the issue? Or maybe you think i'm in wrong way, and maybe there is something more plausible?

[joel.watson]

Based on your description, I would start by simplifying your test case. Instead of trying to figure out what's happening from the perspective of your entire application, start by disabling parts of your application until you find the culprit. For example, if you suspect it's related to the content that's loading within the modal, maybe start by preventing the load from happening, and ensure that the basic act of showing the modal itself works as expected. Once you confirm that this is or is not contributing to the issue, you can continue to drill in until you identify precisely where the issue is coming from.

Thanks
Joel

[Armen Janamyan]

Yes, i did this steps, but ineffective, so i start to dig in ExtJs codes.

But, now i fixed this issue, simply by positioning this window after render, on show event. Maybe not best solution, but in any case it works as expected.