Is event handler code "persistent" after disabling JS? - validation

I noticed something interesting while testing the client side validation on a website that used jquery document.ready event.
If I loaded the login page with js disabled its noscript tag redirects the user to a different page informing that the js support wasn't enabled on the browser.
If I loaded the login page with js enabled, and then proceed to disable it, the code attached on its document.ready event was still running and validated perfectly the empty inputs in its login and password fields.
Since I didn't see the page requesting to the server to perform such validation I wonder if its correct to assume that the fact that js was initially enabled was enough for the document.ready to run and attach the code permanently no matter how I toggle the js support afterwards? or Maybe I missed something?.
Thanks for the insight you all can give me.

"Disable javascript" would actually be closer to reality if called "Disable js from now on". Everything that was executed before disabling, well, was executed. Everything that would have happened after the disabling (such as timeouts, intervals, etc), is no longer executed.

Browsers still run JS on currently opened pages even after you disable JS in your settings. Any new pages loaded while JS is disabled will have their scripts disabled.
It's like the browser only checks that setting only on page load:
Load page -> is scipts on? -> yes -> run //changing it anywhere after
-> no -> do not run //does not affect it's status

Related

Find navigation/redirect request with DevTools after button click that executes javascript/ajax

The question is probably easily misunderstood, so I'll go into more detail:
I am trying to automate a task in a certain (very outdated) browser-based idle game that is written in PHP in order to polish my portfolio with a little more variated projects.
I used DevTools to reverse most of the requests and wrote a small C# Request wrapper to test them. I can get most of the actions I want to work, using the respective ajax get requests and the correct cookies/headers - not really part of the problem.
Example:
Attacking an enemy:
https://somebrowsergame.com/game/ajax.php?mod=location&submod=attack&location=3&stage=2&premium=0&sh=****mysessionhash****
Making a GET request to this URI with the correct headers and cookies, I can perform the in-game action programmatically and successfully from my C# console application and see that the fight has taken place when visiting the site in the browser.
The problem:
When monitoring all requests after clicking the "attack" button, via DevTools, even with preserve logs enabled, I don't see any redirects or way of determining how my browser gets told where to navigate to.
Findings
I found out that the button calls a javascript function attack() in its onClick event and tried debugging the javascript in DevTools in order to find out where somethign happens (such as setting document.href or smth), but when Debugging I ran into a seemingly infinite loop of setInterval handler and setTimeout handler in the call stack.
I also cleared the Network tab after the onClick event (and after the ajax request which I could find during Debugging) but the only request/response I got was the document GET request for the final page, no request telling my browser which site to navigate to.
Monitoring requests
The request made to initiate the action (via button click on website or ajax GET request as outlined above)
The document response / site navigated to
What I want to know is how my browser got told which site to navigate too, as the request URI for the document request (getting the html of the target page) has a parameter generated on the server side (logId)
I have also used "All" request types in DevTools, as well as negative filters when monitoring requests but never was I able to see how my browser knows which page to navigate to. I tried with source breakpoints at "beforeunload", tried inspecting the javascript source connected to the onclick event of the button (which didnt give me anything, as the js is minified and barely readable - i am not even sure if the navigation is done via window.target.href) and googled this question in all possible wordings which lead me nowhere
I am not too versed in web development, but I am sure my browser has to be told where to navigate to in some fashion after clicking that button?

jQuery mobile - after browser refresh page totally messed up

I'm developping a jqm application with spring mobile in the back-end.
Whenever I hit the browser refresh button on my mobile phone the page is completely devastated afterwards. Browsers back-button works properly.
The data are still available due prg pattern (flashAttributes in Spring) after refresh. Only the view is malformed.
Any ideas how to solve this problem?
From jQuery Mobile docs :
The simplest approach when building a jQuery Mobile site is to reference the same set of stylesheets and scripts in the head of every page. If you need to load in specific scripts or styles for a particular page, we recommend binding logic to the pageinit event (details below) to run necessary code when a specific page is created (which can be determined by its id attribute, or a number of other ways). Following this approach will ensure that the code executes if the page is loaded directly or is pulled in and shown via Ajax
So what happens is - in jQuery Mobile, the scripts and styles defined in the head are loaded only once. So, in normal conditions, it works fine, as all the pages will use the scripts loaded from the first page.
But. When you refresh a page in-between, it triggers a page-reload instead of the ajax navigation model thatjqm uses. So all the scripts and styles loaded from the first page will not be included from here on out.
What you need to do is "reference the same set of stylesheets and scripts in the head of every page", so that even if you hit refresh in the middle, the scripts and styles that had been loaded from the head of the first page are loaded again.
I recommend you read the docs from the above link fully to gain a better understanding.

Chrome Extension AJAX always caches errors

I'm working on updating an old Chrome Extension I have. It works fine if the user is already logged into Google (It's a wrapper on Google Tasks) but if the user isn't logged into Google it caches the 404 response on the AJAX and will never, for any reason, refresh it after the user logs in. Currently the only only way to make it work is to manually go to the page (just type it in the address bar) the AJAX call is trying to retrieve after which all will work fine. Reloading the extension and opening/closing Chrome will not reset it.
On the flip side, if the user begins the session logged in all is fine. When they log out the badge resets as it should but it will never reset once they log back in.
I've tried cache: false, I've tried appending a random variable to the URL. I've tried xmlHTTPRequest.abort() and everything else I can think of with no luck.
Here's the code:
https://github.com/Bit51/Better-Google-Tasks/blob/master/Src/js/utilities.js
Any thoughts?
The issue here was due to the use of "Background Scripts" instead of "Background Page." Switching to the latter allowed me to be able to reset the call.

joomla module only working when logged in as a registered user

I am using a joomla sp accordian module for displaying a set of articles on a page. However, the accordian effect only shows up when I am logged in as a registered user. It does not show the accordian effect when I am logged out. I have set all of the access levels to public.
What am i doing wrong here?
I'll take a punt on this being either:
a) some sort of cache issue (Joomla not browser)
b) a javascript error
For (a) turn off all caching - global config and system pluginand retest.
For (b) check mootools is loading. Check the browser's error console for .js errors.
If the tabs module/plugin loads jquery check for noConflict mode - and also that only one instance of jQuery's .js file loads.

Executing AJAX scripts within an AJAX response

I'm having trouble using AJAX page updates along with other AJAX scripts.
During a normal page load, the AJAX scripts (picture scrolling and picture thumbnails) work fine. But when I update a page with AJAX, these scripts (usually loaded in the header of the initial page load) stop working.
I am wondering if this is specific to these scripts and I need to look into them deeper to resolve/re-write or if I am missing something more generic in combining AJAX page updates with AJAX scripts the returned code relies on.
Embedded javascript runs fine.
Thanks for your ideas!
PS: The scripts I am using are from www.dynamicdrive.com are:
1) stepcarousel (http://www.dynamicdrive.com/dynamicindex4/stepcarousel.htm) and
23) thumbnailviewer (http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm) from the
Try doing this on Firefox, using the Firebug debugger, so you can single-step through and determine what is going on with the javascript. If you are using IE8 then you can hit F12 and bring up the debugger for that environment also.
Once you have some idea what is going on then you can explain what you are seeing, what browsers you have tried and you will get more help.

Resources