Viewing Javascript source in Safari Web Inspector in a UIWebView - javascript

My iOS app includes a UIWebView which runs some Javascript. I am able to attach Safari web inspector to my apps UIWebView instance and have the debugger invoked when a breakpoint is hit, however I am not able to view the actual javascript code.
I am able to see the variables and the call stack, but the source code window is blank.
Is there something that needs to be done in order to make the source code visible?
Switching to the DOM tree view does show the contents of the page, but this is not source level javascript debugging.
Is it possible to actually have the source code for the Javascript being debugged visible in the web inspector?

The reason that the code is not visible is because I was making use of the loadHTMLString method on the UIWebView.
Making use of a file URL and loadRequest to load the request allows for the code to become visible.

Related

Ajax.Updater fetched content not shown in browser debugger

I am newly working on a fairly old system, which uses ColdFusion if it matters. In various places, it uses Ajax.Updater for server requests which return new HTML (.cfm) fragments to update the specified element with. This HTML also includes JavaScript via <script>'s and inline event handlers, ie. <button onclick=...
The question is how can I go about debugging this code?
HTML (and .cfm) documents typically show up in the sources tab and can be debugged like normal JS, but in both Chrome and Firefox, the fetched HTML is not showing up. I can clearly see the new html being fetched in the network tab, the new elements are rendered and appear in the elements tab, and the actual JavaScript is clearly running as expected; it just doesn't show up in the debugger.
Does fetched code simply never go to the debugger? Is it because the fetched html is a fragment? Is there some other known way to debug code from Ajax requested HTML?

chrome development tools - JavaScript code is not complete in Element

I was doing some modifications in javascript on some website in Google Chrome to see what changes appear on the web page.
What I observed that I am not able to see the complete javascript code on the element tab in developer tools. The same code exists on the Source tab able to modify that but those modification doesn't work at it doesn't work once DOM is loaded. This is the screenshot of what I am getting:
It is in HTML edit mode and this script is part of html page.... at
the end, it is not a complete script.
ScreenShot:
Is there any way to get it complete in element tab or any other way to modify script?
If you right click on the tag and select "Edit as HTML", you'll be able to access the whole script, without the hyphenation.
You won't be able to change Javascript code through the source tab and expect it to run your new code on reload. If you want to run Javascript on a website with Google Chrome Developer Tools, I'd suggest using the console tab and adding the code you'd want to run on the website. It won't save, but it's essentially the same as injecting Javascript to run on a website.

Android WebView Javascript Issue

I'm quite new of Android and during the development of one app, I have encountered the following issue:
I'm using a WebView inside my app for viewing web sites (it does not matter what kind of site, can be Google or Reddit or anything else). I know I can use a "browser Intent" with Intent.ACTION_VIEW but for the purpose of my App I must use a WebView.
So, I have enabled javascript and DOM api storage with:
getSettings().setJavaScriptEnabled(true);
getSettings().setDomStorageEnabled(true);
My problem comes after that the page has finished loading and some Javascript automatically starts. Basically if the user has already scroll down and the Javascript tells the page to hide/show some content (example a DIV) the scroll resets to top.
My question is:
how can I avoid this behavior? I want that the Javascript loads correctly but it does not interfere with the user's navigation. Is that possible?
Thanks in advance,
Best A.

take screenshot on web page with flash element

I would like to take a screenshot of a page displayed in a WebView. The page may contains flash elements, I refer to google feedback, but when I take a screenshot all the flash parts of the page are blank.
The flash element(for example video) can not be controlled because it is not my own website.
Beside I do not want to use any extension of browser.
It's impossible to take a screenshot of Flash elements on the webpage using JavaScript embedded on the same page. All available JS solutions (more details here) are reading current DOM state and rendering (using JS render engine implementation) a web page on a canvas element. Flash object is executed by separate application - Flash Player. JS can't access its contents, there is no Flash render engine implementation in JS.
However, since you mentioned WebView and you are talking about Flash then I assume that you are working on the native Android app. Therefore, it should be fairly easy for a native app to create a screenshot (see this).

Javascript acting differently on different hosts

I'm using Lightwindow v2 in a Symfony project to create a modal window (here is the plugin I'm using). The modal window works perfectly on my local wamp server. But when I access the page from my remote AWS server, the "greyed out" background element of the lightwindow is too short--it covers the part of the screen that is initially visible but if you scroll down then the rest of the screen isn't greyed out (which makes it look quite crappy).
Using Firebug I'm able to see that the greyed out overlay is given a different height value, which explains why it's too short. But I'm puzzled by this, since one would imagine that the Javascript would render the same, regardless of the host, since it's a browser-side scripting language.
Can anyone imagine a reason this problem could be occurring?
Due to loading time differences between your local WAMP server and your remote server, the page rendering may be happening at different speeds. Your overlay may be getting rendered prematurely, before the browser fully renders the page to its maximum height.
Are you rendering the modal window as soon as the page loads? If so, can you try adding some delay to see if that helps?
I'm not sure, but maybe your JS code tries to read browser window size which could be possible for local HTML pages but not for external websites?

Categories

Resources