I'm using QUnit and trying to test if on scroll event one of the variables is modified. Simplified source example is below:
$(window).on("scroll.singleJob",function(e) {
if($(window).scrollTop()>10) mycompany.somevar=10;
});
My QUnit test is as follow:
test("should attach panel once window scrolled down past certain point", function() {
$(window).scrollTop(1000);
ok(mycompany.somevar==10,"lozenges panel is sticky");
});
Now, I believe that window should be scrolled, test ran and mycompany.somevar set to 10. The problem is that $(window).scrollTop(1000); dosen't do anything and the code runs as the window is not scrolled. I also tried QUnit.config.scrolltop = false; but with no luck.
So my question is how to scroll the fixture window so the test will run as the window was scrolled?
Use the scrollTo method with two parameters:
window.scrollTo(0,1000)
References
Working with Windows: Manipulating Windows
Events:Scroll and Mousewheel
CSSOM View Module
Related
If you open a window like:
window.open ("url","winName","location=0,width=300,height=214");
If winName is already open it just changes the URL in the window. This is ok but if that window is behind the current window most users won't realize this and think that it is just not opening.
Is there any way that if the window is already open, it brings it to the front?
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
The window.open() method returns an object that represents the new window. You just need to window.focus() it:
var w = window.open ("url","winName","location=0,width=300,height=214");
w.focus();
Or simply:
window.open("url","winName","location=0,width=300,height=214").focus();
The various answers suggesting using any form of .focus() are likely not going to work in all browsers.
This used to work back in the day but not any more, mainly due to browsers working to actively stop shady ad networks from pushing their popup ads to the foreground.
In Mozilla Firefox in particular (depending on your version) there is a configuration setting that is turned on by default that stops other windows (e.g. popups) from focusing themselves.
You can find this setting in the about:config page (tread carefully!)
dom.disable_window_flip: true
If I recall correctly this setting used to be called something like ~"allow_raise_or_lower_windows*
Other browsers may implement something similar, but quite simply if 1 of the major browsers blocks the use of .focus() by default then there's not much use in attempting to call it.
As a result, the only solution I've seen that works is to see if the window exists, and is not already closed... and if so close it, then load the window you want.
function closePopupIfOpen(popupName){
if(typeof(window[popupName]) != 'undefined' && !window[popupName].closed){
window[popupName].close();
}
}
when opening your popup if there's a chance it is already open (and burried behind other windows) then you can call this function before you attempt to open your popup.
closePopupIfOpen('fooWin');
var fooWin = window.open('someURL', 'foo', '...features...');
The drawback of course is that if there was anything "important" (e.g. a form partially filled in) in that window it will be lost.
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
Be careful, because when you open a new window, the opener window might still have some code to be executed, maybe some of this code gives it the focus. You would see how your new window opens in the front and suddenly goes to the back, so, it is a great idea in these cases, to set a timeout in order to give the focus to the new window a bit later on, when all the javascript in the opener window is executed, you can do it this way:
setTimeout(function(){window.focus();},1000);
Being 1000 the amount of miliseconds to wait, and window the name of the opened window.
You could also use this code in the opened window in the body onload for example.
I fixed this by adding
onclick="myWin = window.open('','winName','location=0,width=300,height=214'); myWin.focus()"
to the html element(button) and then change the URL via JS.
window.focus() applied to the window in question should do the trick.
You can use jQuery :
myPopup = window.open(url, "Title","menubar=no, status=no, scrollbars=no, menubar=no, width=800, height=800");
$(myPopup).focus();
Closing the window first, does the trick for me:
window.open('', 'mypopup').close();
setTimeout(function() {
window.open('', 'mypopup').focus();
}, 500);
I had the same problem, have spent a lot of time to find a solution, finally it works by this:
var singleWindow;
function openNewWindow(){
if(singleWindow){
singleWindow.close();
}
singleWindow = window.open ("url","winName","location=0,width=300,height=214");
}
This close the current window (if exist) and open a new window that will be placed on the top (default behavior)
Hope this help you !
In Chrome Devtools, you can break javascript on changing a DOM element's attributes, or on subtree modifications of an element.
I'm working on some legacy code that has some javascript that scrolls to the top of the page under certain situations, and I want to find the JS that does this.
Is there a way, in Devtools, so break on scroll events?
It could be jQuery or Prototype.js or event base JS that does it, and I've searched the codebase for .scrollTop or .animate, and I've found plenty of those, but none that are causing my issue.
I have no additional idea about actually breaking than the ones presented.
But i suspect it is not scrolling that causes the issue, but a '#' in the html.
x
is a very common pattern. when you forget (or something prevents) the "return false", the # (empty anchor) will be navigated to, which causes a scroll to top.
Check if the url has a # at the end after clicking!
You can inject this line of JS using the console to trigger the debugger when the scroll position changes programatically.
window.__defineSetter__("pageYOffset", function(){
debugger;
});
Then, view the call stack to see what triggered it.
If you don't want to activate the debugger, you can print the stack trace istead with the following code:
window.__defineSetter__("pageYOffset", function(){
console.log(new Error().stack);
});
Another option is to replace the windows scroll, scrollTo and scrollBy method with your own.
window.__defineGetter__('scroll', function(){
console.log('window.scroll getter :' + new Error().stack);
return function(x,y){
debugger; //or print stack trace
oldScroll(x,y);
}
});
Repeat for scrollTo and scrollBy.
I have the following script:
var a = window.open( "http://sitea.net" );
var b = window.open( "http://siteb.net" );
a.setFocus();
I would expect the focus to go to the first window (sitea.net), but instead the latest child opened is focused (siteb.net). How can I make the first window focus?
I tried the above code. The "window.open" causes both sites to open even without the a.setFocus.
Putting both of the variables within a function should stop the dual loading of the windows.
Here is an example:
http://jsfiddle.net/latoyale/GAKFL/28/
Also I noticed while using your original code that both windows will not open if .setFocus is declared above window.open. Maybe this problem also has something to do with the code positioning of setFocus...
If you open a window like:
window.open ("url","winName","location=0,width=300,height=214");
If winName is already open it just changes the URL in the window. This is ok but if that window is behind the current window most users won't realize this and think that it is just not opening.
Is there any way that if the window is already open, it brings it to the front?
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
The window.open() method returns an object that represents the new window. You just need to window.focus() it:
var w = window.open ("url","winName","location=0,width=300,height=214");
w.focus();
Or simply:
window.open("url","winName","location=0,width=300,height=214").focus();
The various answers suggesting using any form of .focus() are likely not going to work in all browsers.
This used to work back in the day but not any more, mainly due to browsers working to actively stop shady ad networks from pushing their popup ads to the foreground.
In Mozilla Firefox in particular (depending on your version) there is a configuration setting that is turned on by default that stops other windows (e.g. popups) from focusing themselves.
You can find this setting in the about:config page (tread carefully!)
dom.disable_window_flip: true
If I recall correctly this setting used to be called something like ~"allow_raise_or_lower_windows*
Other browsers may implement something similar, but quite simply if 1 of the major browsers blocks the use of .focus() by default then there's not much use in attempting to call it.
As a result, the only solution I've seen that works is to see if the window exists, and is not already closed... and if so close it, then load the window you want.
function closePopupIfOpen(popupName){
if(typeof(window[popupName]) != 'undefined' && !window[popupName].closed){
window[popupName].close();
}
}
when opening your popup if there's a chance it is already open (and burried behind other windows) then you can call this function before you attempt to open your popup.
closePopupIfOpen('fooWin');
var fooWin = window.open('someURL', 'foo', '...features...');
The drawback of course is that if there was anything "important" (e.g. a form partially filled in) in that window it will be lost.
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
Be careful, because when you open a new window, the opener window might still have some code to be executed, maybe some of this code gives it the focus. You would see how your new window opens in the front and suddenly goes to the back, so, it is a great idea in these cases, to set a timeout in order to give the focus to the new window a bit later on, when all the javascript in the opener window is executed, you can do it this way:
setTimeout(function(){window.focus();},1000);
Being 1000 the amount of miliseconds to wait, and window the name of the opened window.
You could also use this code in the opened window in the body onload for example.
I fixed this by adding
onclick="myWin = window.open('','winName','location=0,width=300,height=214'); myWin.focus()"
to the html element(button) and then change the URL via JS.
window.focus() applied to the window in question should do the trick.
You can use jQuery :
myPopup = window.open(url, "Title","menubar=no, status=no, scrollbars=no, menubar=no, width=800, height=800");
$(myPopup).focus();
Closing the window first, does the trick for me:
window.open('', 'mypopup').close();
setTimeout(function() {
window.open('', 'mypopup').focus();
}, 500);
I had the same problem, have spent a lot of time to find a solution, finally it works by this:
var singleWindow;
function openNewWindow(){
if(singleWindow){
singleWindow.close();
}
singleWindow = window.open ("url","winName","location=0,width=300,height=214");
}
This close the current window (if exist) and open a new window that will be placed on the top (default behavior)
Hope this help you !
I'm testing an intranet web app in an iPad but the animations to open "windows" and show message boxes are horribly slow.
I've tried setting the global Ext.enableFx to false, and confirmed that flag is still false after page load in Firebug. The animations are still occurring though so I must be doing something wrong.
Thanks...
When you show a window, the second (optional) argument to show() is the target to animate from. Omit that and you should not get the animation.
EDIT:
Not tested, but glancing at the Window code you should be able to do this (put it after your Ext includes and before your app code):
Ext.override(Ext.Window, {
animShow: function(){
this.afterShow();
},
animHide: function(){
this.el.hide();
this.afterHide();
}
});