We Keep Coding

Chrome - eval() in context of iframe from WebExtension

I'm working on a WebExtension that scrapes some data from a web page. The page in question dynamically loads stuff into an iframe, and the iframe contains the stuff I need. The data I need never gets written to the iframe document, it only exists in the JS objects.
From inside of my WebExtension, I'm trying to do the following:
var result = $("iframe")[0].contentWindow.eval("(function() { return $('#grid').jqxGrid('getrows'); }())");
This works flawlessly when using the extension in Firefox. No issues whatsoever.
Unfortunately, trying to do the same thing in Chrome results in the error $ is not defined on the eval.
I've been trying for the last couple of hours to figure out why and I'm at a complete loss. Would really appreciate if someone could point me in the right direction.

I'm still not sure why the eval() works in Firefox but not in Chrome, but here's what I ended up doing to get what I needed:
1) Add an event listener in my extension for a custom event.
window.addEventListener("myCustomEvent", function(e) { HandleResult(e.detail); });
2) Inject a script block with the code to fire the event, including the data I need, into the body of the iframe document.
$("body", $("iframe").contents()).append("<script>top.dispatchEvent(new CustomEvent('myCustomEvent', {detail: $('#grid').jqxGrid('getrows') }));</script>")
Shout-out to wOxxOm for pointing my brain in the right direction.

JQuery Mobile 1.4.5 does not seem to invoke javascript on ipad

Using JQuery mobile 1.4.5 (https://jquerymobile.com/)
Ironically, everything works on desktop browsers, but I cannot seem to get anything to work when testing on an iPad ...
My stripped down page (HTML) contains the following:
<div data-role="content">
<script src="test.js"></script>
<script>
$( document ).on( 'pagecreate', function( event ) { do_something(); });
</script>
</div>
The file "test.js", contains the following code:
function do_something() {
alert('here in do_something()');
}
When testing on an iPad, all I get is a grey circle with a "spinning comet" rotating around in the circle and the page never even renders (Yes, I tried rebooting the iPad, clearing browser history/data, etc).
On all other browsers, I get the alert.
Ultimately, I am trying to load google maps into the page along with the javascript I need to manipulate various DOM elements as well as manipulate the map -- which I CAN do and is working on all other browsers -- just can't seem to get anything to work when testing on an iPad (I do not know how to view source or console messages via iPad Safari, which makes debugging a nightmare).
ANY suggestions would be helpful.
Thanks in advance.

First of all, you missed some important information like, were "all other browsers" running on your desktop machine or are we talking about other mobile devices? This is extremely important.
As you can see spinner that would mean jQuery Mobile and jQuery are loaded.
If they were successfully running on your desktop computer then you may check these:
Make sure none of your content is running on or from localhost. This will work just fine on desktop computers, but if you try to test it on any other device it will fail.
Make sure you are not using an absolute path in your jQM application, this will also fail on any remote device. I presume something similar may be the case as jQM is not able to show the first page
You will need to use a remote debugging feature. As you are using an iPad I again presume you own a Mac. Follow this tutorial: https://appletoolbox.com/2014/05/use-web-inspector-debug-mobile-safari/ as it is the only fool-proof method where you will find what was wrong. Unfortunately, if you are using Windows machine then you would need to use Chrome and Android device.
There's also a chance, some of your *.js content is loading from localhost or other sources not available to your iPad. This also may be the case as you stated above alert is not triggering on iPad. Which would mean that some major JavaScript has occurred thus blocking the load of other JavaScript content.
And there's one other foolproof method you can use that always helped me in this case. Trim your code to the bare minimum, even if that means you need to remove most of your HTML content and JavaScript. Test it, if it works, start including removed content. First include remote JavaScript content, CSS and similar. Then if it still works, start including actual HTML and code. Sooner or later you will stumble on the problematic code, missing content, or content that was not loaded into your iPad.

Thanks to all who provided some insight...
Turned out it was an external javascript file that contained a try/catch block as:
try {
// code
}
catch {
// code
}
When changed to:
try {
// code
}
catch(err) {
// code
}
... after the change was made, all tests passed !!

JS Bookmarklet Not Working in IE11

long time lurker, first time poster.
The basics are this:
Inspired by this blog post, I'm attempting to create a bookmarklet for our QA team to quickly populate a form.
The bookmarklet works perfectly on my machine (TM) in Chrome, IE 10, and IE 9 compatibility mode. I've tested the bookmarklet on the QA team's machines, and while it works fine on their Chrome browsers and on IE 9, the bookmarklet doesn't work on the two machines running IE 11.
Details:
Of the two machines running IE 11, one is on Win 7, the other is on Win 8.1. The machine running IE 11 on Win 7 is updated to IE version 11.0.9600.17207IS, and will also run the bookmarklet correctly in Chrome.
I've attempted a couple different variations, the first based on the CSS-Tricks blog post mentioned above.
<a href="javascript:
(function(d) {
var body = d.getElementsByTagName('body').item(0);
var script = d.createElement('script');
script.src = 'https://company.siteurl.com/unrelated/DisclosureRegister.js';
body.appendChild(script);
}(window.document));
alert('Bookmarklet js fired!');">Disclosure Register Bookmarklet</a>
The second, based on a StackOverflow Response, is as follows:
<a href="javascript:
(function(){
var s=document.createElement('script');
s.type='text/javascript';
s.src='https://company.siteurl.com/unrelated/DisclosureRegister.js';
document.getElementsByTagName('head')[0].appendChild(s);
}());">Disclosure Register 2</a>
Both codes work on my machine in the previously mentioned browsers, neither work in IE 11 on the other machines (I don't have IE 11, can't test it directly on my machine).
I get no error message in console in the developer tools, and the DisclosureRegister.js file isn't listed in the developer tools' file list. It appears that the bookmarklet simply isn't firing.
Neither one of those bookmarklets have a Web Documents tab when I right click > properties, however, a simple javascript alert bookmarklet I provided them with does have the Web Documents tab, and it works perfectly in all browsers (including IE 11).
Click me!
I'm delivering the bookmarklets by writing the html in Codepen, emailing them a direct link to the Codepen (I don't have enough reputation points to post the link), and having them drag the link from the Codepen output to their browser favorites bar.
I came across something that gave me hope it was a bug with an older version of IE 11, but the IE version being used is even newer than the version that fixed the related bug.
Just in case there's something in the DisclosureRegister.js file that's causing IE 11 to abort the javascript, I'm including the code for that as well:
(function (win, doc, $, undefined) {
//Don't run if jQuery isn't loaded
if (typeof window.jQuery === 'undefined') {
return;
}
alert("Script is being called!");
}(window, window.document, window.jQuery));
The question:
While I'm certainly not ruling out an error with my code (and of course, please correct me if it's wrong), is there anything peculiar with IE 11 in the way it handles javascript bookmarklets that I need to account for in the code?
Thanks in advance for your time!

I wrote that article. Really glad you guys are finding it useful.
It seems there a bunch of people complaining about bookmarklets not working properly in IE11. One thing I'd test is how IE11 handles same origin policy. Check out this link, and see if you can temporarily disable same origin policy. Then test.
Obviously it won't solve the problem, but it could lead you in the right direction.
Hope that helps a bit. Let me know.

I think I found what is the problem with bookmarklets in IE11. I just added a bookmarklet in IE11 and it wasn't working so I started googling and found this page. Then I found bookmarklets at Microsoft's own website where they actually recommend to use it and it works. Then I decided to check if the syntax is correct and this where I found a problem. For some reason IE cuts part of long bookmarklets when it adds it to the toolbar by draggin-dropping. My bookmarklet that I was tried to add was several brackets short of original and because of that the syntax was incorrect. I then copy-pasted full code manually and it started working.

I was able to resolve the same problem by removing all line breaks from the bookmarklet code. IE 11 apparently doesn't know how to handle them.
With line breaks in the bookmarklet code, after adding it to "Favorites" the properties showed a blank URL and nothing would happen when clicking it.
With the linebreaks removed (ran a regex to collapse all whitespace to a single space character), after adding it to the "Favorites" the properties show the correct javascript in the URL field and it runs correctly when clicked.
I wasn't able to find anything anywhere documenting this limitation.

JavaScript not working in IE?

So, I stole the script off the internet. Basically, it's supposed to resize an iframe to fit its content.
function sizeIFrame()
{
var helpFrame = jQuery("#elastic");
var innerDoc = (helpFrame.get(0).contentDocument) ? helpFrame.get(0).contentDocument : helpFrame.get(0).contentWindow.document;
helpFrame.height(innerDoc.body.scrollHeight + 35);
}
It doesn't seem to work in Internet Explorer, though! The iframe source is on the same server, so that shouldn't be the problem. Any idea what's wrong? The iframe ID is #elastic. I've tested this in Firefox, Chrome, and Safari, and it works in all three of them just like it's supposed to.
EDIT
I decided to just replace the script with another, more hefty jQuery solution. While it's not as lightweight as I was hoping, it appears to work.
See: http://sonspring.com/journal/jquery-iframe-sizing

I managed to get it working by simply replacing my solution with this larger jQuery solution. Though bigger, it works like a charm!
http://sonspring.com/journal/jquery-iframe-sizing

Firefox Bookmarklet in Chrome

I wrote a little bookmarklet that works great in firefox, trying to use it in Chrome and not having any luck. Just tried out a stub bookmarklet javascript:alert('wtf'); which works fine in Firefox but not at all in Chrome. Trying to pick apart a couple of my pre-installed Chrome Bookmarklets and can't figure out why they run and mine don't. Having a lot of trouble finding documentation on this, thought I'd ask:
The javascript that I use is pretty much identical between Firefox and Chrome, the javascript: command for the bookmarklet is identical between my firefox bookmarklets and pre-installed chrome bookmarklets, so is there something else going on here?
Here's the actual bookmarklet (not just the stub)
javascript:function(){myscript=document.createElement('SCRIPT');myscript.type='text/javascript';myscript.src='http://applegator.net/script.js';document.getElementsByTagName('head')[0].appendChild(myscript);}
Some strange formatting things happened to it when it landed in chrome, still trying to sort it out, but think its basically right.
Am pretty new to Chrome so maybe this is something to do with them, just can't figure it out.
Thanks,

I just added your bookmarklet successfully in Chrome. However, I discovered that bookmarklets will not run on certain important pages like the New Tab page or anything else that starts with chrome://.
Perhaaps your choice of test page is your issue?

You have to put a space after the javascript: alert('like so');
if you want to do anything more complex, use a closure:
javascript: a=function(){alert('poop');alert('morepoop');}();
the (); is a shortcut for self-invocation of the closure