Adding target="_blank" causes link to stop working - javascript

Up to my elbows in what is surprisingly the most elusive bug I've encountered thus far.
I've got a site I'm working on that has issues with links opening in Safari. The issue is isolated to the target appendage. To be clear, this issue is not that links do not open in a new tab, it's that they don't open at all.
For example, this will open just fine:
blaaaahh link
This, however, will do 'nothing':
blaaaahh link
Note that this is specific to PDF files. Links to any other type of resources work fine, even with the target appendage.
Note note: There is a ton of event tracking happening on this site. And the issue is resolved when JS is disabled. I've excluded all site-specific JS for testing, so that's not the issue. Anyone aware of anything with GTM or HotJar in Safari that could cause this?

Related

Using Chrome Dev Tools to find out what's causing FOUC

I have been fixing up a sites JS, moving it to the bottom, minifying, etc. And it's all gone okay except on the blog (of an e-commerce site), as the page loads it's causing the header to be un-styled for a second or so, but it isn't happening on any other part of the site, even though they share the same CSS/JS. The blog is image heavy, but with images disabled (and I've tried disabling scripts too), it still happens. It's only happened since I've made changes, which I can't revert simply, but the changes are all positive and should help if anything. I can't see any JS causing it (as I removed the scripts to see if it was in there) and it doesn't happen in FF.
I would share a link but it's behind a closed staging server. And I could provide code but I'm not sure what, and there's a lot.
So, I had hoped I could use Dev tools to figure out what's happening, possibly the timeline view or something. I just don't know how I'd go about doing that.
Any advice?
Ed: I used the network tab on both the staging and the live site, as you can see from the image, they're identical, the css is the first thing loaded after the actual page, and on the live site it's actually ga.js. So it's even more of a puzzle now...
Don't worry, figured it out... It was the Stylebot Chrome Extension.. No idea why it was causing it now after making those changes though, and why it didn't affect the live site. I had no styles defined in it for this domain. A bug I guess.
Cheers all the same :)
Timeline tab in the dev tools is for benchmarking / site performance testing. If you want to know what's happening as in what content is being loaded, when and where, you can use the network tab for that.
It's also a common practice to stuff console.log() everywhere with some relevant message so you know when some part of code is being run.

Omniture / Adobe Analytics tracking breaks external links in Safari

The Omniture tracking code is breaking all external links on our site in desktop and mobile Safari. When we click or tap on any link with an href outside our own domain, Safari won't open the page requested - or it does once, but then not again. Here's a very basic example of the kind of link that breaks:
Test
This is a weird bug that only affects Safari. We know it's the Omniture code because the links start working as soon as we comment out the link to the SiteCatalyst JS file, or when we set the s.trackExternalLinks option in the Omniture config to false.
SiteCatalyst has a linkInternalFilters variable where we set the domain of our site: a function called s.exitLinkHandler uses this. We thought it might be the source of the issue, but even when we redefine it as an empty function our external links are still blocked.
Has anyone else come across this crazy problem? We can work around it for the moment by removing the href attributes of external links and handling clicks callbacks that use window.open, but it's a total pain that normal external links on our site now don't work on iPads, iPhones and desktop Safari.
(We're using version H.25.2.05feb2013 of SiteCatalyst.)
Looks like you'll simply want to update your H code. There are several link tracking issues resolved in later code versions:
http://microsite.omniture.com/t2/help/en_US/sc/appmeasurement/release/index.html#JavaScript_H_code_Legacy
If you're using manual link tracking, you'll also want to slightly modify your implementation to accommodate recent browser updates:
http://microsite.omniture.com/t2/help/en_US/sc/implement/index.html#Manual_Link_Tracking_Using_Custom_Link_Code

Whitescreen issue in IE9 - Removing iframe

I"m wondering if anyone can give me some insight into a really strange IE9 issue I've been struggling with.
I'm finishing up production of a site for work - it works well in ff/chrome/ie7/ie8 with no script errors.
On IE9 the last step of the application causes the entire tab to whitescreen with no script errors or warnings. (changing the document mode to ie8 will fix the problem but is obviously unsuitable for production)
Unfortunately the site pretty complex with a ton of ajax, and in-page scripts so I can't really post the relevant code easily. I'm more trying to figure out how to diagnose this.
I've checked the IE error logs and they are empty. Web developer tools tells me nothing. The site is not using any plugins (Flash/Silverlight, Ect. ) just javascript w/jQuery.
There is a PDF being displayed in an iframe around the step where it fails - but a nearly identical pdf is displayed in the previous step (using the same method) without problem. The code fails around a call to the jquery UI window but I can't seem to get the exact line.
If anyone has a clue how to try to diagnose this further I'd really appreciate it. I can keep hunting for the bug but I've never seen this kind of behavior before and just am not sure what I am looking for.
Thanks for all the input on this. Sorry I got completely overwhelmed by a few projects at once so I wasn't able to post updates on the debugging steps.
It took forever but I finally realized that everything was crashing when I closed the dialog containing the first PDF.
One of my helper functions was opening the dialog and automatically destroying the contents on close. Normally this works fine as I'm either removing a div containing the page fragment, or the iframe.
In this situation I had a page fragment loaded into the dialog which contained some buttons and the pdf iframe. I called the .remove() method on the parent element containing the iframe rather than the iframe itself. For some reason this seems to work fine in every other browser - but in IE9 it pretty much kills the page rendering without any warning or message.
I strongly suspect that the culprit is the adobe plugin but I'm not entirely sure.
Here is the fix-
Html:
<div id="container">
<iframe src="loremipsum.pdf"></iframe>
</div>
Javascript:
//Ruins my entire week
$("#container").remove();
//Works as the pdf is removed directly
$("#container").find("iframe").remove().end().remove();
I ran into the same issue on IE11 while trying to remove an iframe in a div with AngularJS. Removing the iframe first would just cause the same issue, so I navigated the iframe src to a new page (about:blank) first, then removed the div which worked. Hopefully this helps someone with a similar problem.
Pseudo-code below:
$ctrl.iframeUrl = 'about:blank'; // change the iframe url here
$timeout(function(){
$ctrl.removeIframe(); // remove the iframe here
});
As a thing to try - see what's in the IE9 DOM viewer after it whitescreens. There's a decent chance that most of the stuff is there and just not rendering properly (or having something else rendered over it). At the very least, knowing whether it's losing a ton of stuff out of the DOM or not should give you some useful data.

Certain JavaScript doesn't work in IE9 but there is no JS error

I'm doing some maintenance work on somebody else's site and there's an IE 9 problem. They're using what appears to be a Lightbox to an image gallery. When you click on a certain image on the page, the Lightbox appears, but in IE 9, the Lightbox doesn't show up at all. There's no error or anything - it just silently fails - so I'm kind of at a loss as to how to troubleshoot.
I'm not the best at these kinds of problems. Can someone point me in the right direction?
Here's a link to what I'm working on: http://www.aquilacommercial.com/wlproperties/view/1300-Guadalupe
#Jaitsu, I confirmed that this occurs. For me, IE9 begins to open Lightbox and then immediately opens the image on it's own page. All with no errors.
I'm still unsure on IE9's issue but this might help with an alternate solution:
Most Compatible JQuery Lightbox Plugin, Works in All Current Browsers?
Finally, have you upgraded to Lightbox v2.05. Changelog indicates it didn't work on IE9 till 3/18/11. You might need to upgrade some files.
I confirmed that the Lightbox website is using Prototype v1.7. Your site is using Prototype v1.6.0.2.

Facebook Canvas JavaScript Links Don't Work

We are using ASP.NET for our Canvas Page, however none of the link buttons (JavaScript Post Backs) work when using FireFox.
After a bit of investigation it appears that any javascript link i.e. <a href="javascript:..."> will not run.
When viewing the iFrame outside of Facebook the links work as expected.
Bizarrely javascript on an "onclick" event does work correctly.
Facebook Canvas: http://apps.facebook.com/ukflive/test.aspx
Any thoughts on why this is happening, and how to resolve this? Other browsers such as Safari and Chrome do not have this issue.
Many Thanks,Ady
In some versions of firefox i've met same problem but i wasn't able to find out reason of problem since i've seen your question. thank you for this :). In my opinion it is a firefox bug working with iframes, and it is related with security concerns.
i've changed all <a href="javascript:anyJSFunction()"> codes to <a href="javascript:;" onclick="anyJSFunction"> and it works for my application.

Categories

Resources