Develop Reference

CreateContextualFragment not working in safari

We have a problem with a function (createContextualFragment) in safari.
We need to add some content in the body, so we use this line of code.
Code:
document.getElementsByTagName('body')[0].insertBefore(document.createRange().createContextualFragment("<div></div><script src="LINK_SOURCE"></script>"), null);
This line of code is working fine with Chrome and Firefox, but we are having some issue with createContextualFragment in Safari.
Error in Safari:
createContextualFragment —
asyncronousDocumentWrite2.html:28:115NotSupportedError: DOM Exception
9: The implementation did not support the requested type of object or
operation.

I realize that my answer is arriving a little late, but I recently ran into a similar situation.
What I found
According to https://developer.mozilla.org/en-US/docs/Web/API/Range/createContextualFragment#Browser_compatibility
Range.createContextualFragment() is not supported in Safari 9.0 or 9.1. It does work fine in Safari 10 though.
What can you do?
Since Safari does not support createContextualFragment we can delegate the responsibility of creating our document fragment to jQuery. The following illustrates two options to do this depending on what version of jQuery you are using:
jQuery 1.8 or newer use ParseHTML
document.getElementsByTagName('body')[0].insertBefore($.parseHTML("<div></div><script src='http://google.ca'></script>"), null);
Otherwise just let jQuery figure out what to do
document.getElementsByTagName('body')[0].insertBefore($("<div></div>
<script src='http://google.ca'></script>"), null);

I have found out that setting range.selectNodeContents(document.createElement('div')); fixes the issue as indirecly pointed out in this article https://grrr.tech/posts/create-dom-node-from-html-string/#range.
My example usage:
document.querySelectorAll('.container').forEach((el) => {
const range = document.createRange();
range.selectNodeContents(el);
range.deleteContents();
range.selectNodeContents(document.createElement('div')); // fix for safari
el.appendChild(range.createContextualFragment(htmlContent));
});

Type-error : network is undefined

I have the following code in a firefox app which I created (it gets network bandwidth and displays it in element with id="dynamicdata"):
//var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery;
var network = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
function getData()
{ // document.getElementById("dynamicdata").innerHTML = "The battery is at: " + battery.level*100 + "%";
document.getElementById("dynamicdata").innerHTML = "The current bandwidth is: " + network.bandwidth + "MbPs";
}
When I run my app I get on console the following error: "TypeError: network is undefined".The same thing is working correctly for the commented battery status part.Where is it going wrong?

According to the documentation navigator.connection is not supported on Desktop devices and is only supported on Mobile FF 12.0+ and Android 2.2+ (with webkit Prefix)
Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support Not supported Not supported Not supported Not supported Not supported
Feature Android Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile
Basic support 2.2 webkit 12.0[1] 1.4 Not supporte Not supported Not supported
EDIT:
If you typo an object property, JS returns undefined because the property is.... undefined.
The error that you're getting, however, is network is undefined, not network.bandwidth is undefined, difference being that
If network is undefined and you try to access network.bandwidth, that's an error
If network.bandwidth is undefined and you try to access network.bandwidth, you just get undefined (no error).
Similarly, if network exists, but you try to reference network.somerandompropertythatdoesntexist, then you get undefined but no error.

Object doesn't support property or method 'okToLaunchComposition' - issue in IE11 (Edge)

I have an embedded object that another developer created using Adobe Edge, this seems to work fine with Chrome & Firefox but IE11 doesn't (10 & 9 do.. I am not concerned for versions below this).
The error is as follows:
Object doesn't support property or method 'okToLaunchComposition'
File: Site_MAP_edgePreload.js, Line: 2, Column: 5086
Can anyone suggest the best way of fixing this to work in IE11 (while not breaking this so it still works in IE10/9 and Firefox & Chrome browsers.
This image below shows the function displayed within the console.log when I run window.AdobeEdge from within the Developer Tools console log.
http://s28.postimg.org/sqjdzu364/ie_11_adobe_edge.jpg
Full JS:
/* Modified to hard-code the paths to the required JS files */
window.AdobeEdge=window.AdobeEdge||{};if(!AdobeEdge.yepnope){(function(o,e,H){function d(){for(var a=1,b=-1;k.length- ++b;)if(k[b].s&&!(a=k[b].r))break;a&&t()}function I(a){var b=e.createElement("script"),c;b.src=a.s;b.onreadystatechange=b.onload=function(){if(!c&&(!b.readyState||b.readyState=="loaded"||b.readyState=="complete"))c=1,d(),b.onload=b.onreadystatechange=null};g(function(){c||(c=1,d())},j.errorTimeout);a.e?b.onload():l.parentNode.insertBefore(b,l)}function J(a){var b=e.createElement("link"),c;b.href=a.s;b.rel="stylesheet";b.type="text/css";if(!a.e&&(u||v)){var n=function(a){g(function(){if(!c)try{a.sheet.cssRules.length?(c=1,d()):n(a)}catch(b){b.code==1E3||b.message=="security"||b.message=="denied"?(c=1,g(function(){d()},0)):n(a)}},0)};n(b)}else b.onload=function(){c||(c=1,g(function(){d()},0))},a.e&&b.onload();g(function(){c||(c=1,d())},j.errorTimeout);!a.e&&l.parentNode.insertBefore(b,l)}function t(){var a=k.shift();p=1;a?a.t?g(function(){a.t=="c"?J(a):I(a)},0):(a(),d()):p=0}function K(a,b,c,n,P,i){function B(){if(!q&&(!h.readyState||h.readyState=="loaded"||h.readyState=="complete"))m.r=q=1,!p&&d(),h.onload=h.onreadystatechange=null,g(function(){w.removeChild(h)},0)}var h=e.createElement(a),q=0,m={t:c,s:b,e:i};h.src=h.data=b;!x&&(h.style.display="none");h.width=h.height="0";if(a!="object")h.type=c;else if(/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent))h.type="text/javascript";h.onload=h.onreadystatechange=B;if(a=="img")h.onerror=B;else if(a=="script")h.onerror=function(){m.e=m.r=1;t()};k.splice(n,0,m);w.insertBefore(h,x?null:l);g(function(){if(!q)w.removeChild(h),m.r=m.e=q=1,d()},j.errorTimeout)}function L(a,b,c){var e=b=="c"?M:C;p=0;b=b||"j";r(a)?K(e,a,b,this.i++,s,c):(k.splice(this.i++,0,a),k.length==1&&t());return this}function D(){var a=j;a.loader={load:L,i:0};return a}var s=e.documentElement,g=o.setTimeout,l=e.getElementsByTagName("script")[0],y={}.toString,k=[],p=0,v="MozAppearance"in s.style,x=v&&!!e.createRange().compareNode,w=x?s:l.parentNode,N=o.opera&&y.call(o.opera)=="[object Opera]",u="webkitAppearance"in s.style,O=u&&"async"in e.createElement("script"),C=v?"object":N||O?"img":"script",M=u?"img":C,E=Array.isArray||function(a){return y.call(a)=="[object Array]"},r=function(a){return typeof a=="string"},z=function(a){return y.call(a)=="[object Function]"},A=[],F={},G,j;j=function(a){function b(a){var a=a.split("!"),b=A.length,c=a.pop(),e=a.length,c={url:c,origUrl:c,prefixes:a},d,f;for(f=0;f<e;f++)(d=F[a[f]])&&(c=d(c));for(f=0;f<b;f++)c=A[f](c);return c}function c(a,c,e,d,g){var f=b(a),i=f.autoCallback;if(!f.bypass)if(c&&(c=z(c)?c:c[a]||c[d]||c[a.split("/").pop().split("?")[0]]),f.instead)return f.instead(a,c,e,d,g);else e.load(f.url,f.forceCSS||!f.forceJS&&/css$/.test(f.url)?"c":H,f.noexec),(z(c)||z(i))&&e.load(function(){D();c&&c(f.origUrl,g,d);i&&i(f.origUrl,g,d)})}function e(a,b){function d(a){if(r(a))c(a,f,b,0,g);else if(Object(a)===a)for(j in a)a.hasOwnProperty(j)&&c(a[j],f,b,j,g)}var g=!!a.test,i=a.load||a.both,f=a.callback,j;d(g?a.yep:a.nope);d(i);a.complete&&b.load(a.complete)}var d,i,g=this.yepnope.loader;if(r(a))c(a,0,g,0);else if(E(a))for(d=0;d<a.length;d++)i=a[d],r(i)?c(i,0,g,0):E(i)?j(i):Object(i)===i&&e(i,g);else Object(a)===a&&e(a,g)};j.addPrefix=function(a,b){F[a]=b};j.addFilter=function(a){A.push(a)};j.errorTimeout=1E4;if(e.readyState==null&&e.addEventListener)e.readyState="loading",e.addEventListener("DOMContentLoaded",G=function(){e.removeEventListener("DOMContentLoaded",G,0);e.readyState="complete"},0);o.yepnope=D()})(this,this.document);AdobeEdge.yepnope=window.yepnope}(function(compId){var htFallbacks;var testEle=document.createElement("div");function isSupported(a){var d=testEle.style,e;for(i=0;i<a.length;i++)if(e=a[i],d[e]!==void 0)return!0;return!1}function supportsRGBA(){testEle.cssText="background-color:rgba(150,255,150,.5)";if((""+testEle.style.backgroundColor).indexOf("rgba")==0)return!0;return!1}var hasTransform=isSupported(["transformProperty","WebkitTransform","MozTransform","OTransform","msTransform"]),hasSVG=!!document.createElementNS&&!!document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGRect,hasRGBA=supportsRGBA(),hasJSON=window.JSON&&window.JSON.parse&&window.JSON.stringify,readyToPlay=!1;function safeColor(a){a=""+a;if(!hasRGBA&&a.indexOf("rgba")==0){var d=a.lastIndexOf(",");d>0&&(a="rgb("+a.substring(5,d)+")")}return a}AdobeEdge._preloaders=AdobeEdge._preloaders||[];AdobeEdge._preloaders.push(function(){filesToLoad&&(loadResources(filesToLoad),filesToLoad=void 0)});function doLoadResources(){for(var a=0;a<AdobeEdge._preloaders.length;a++)AdobeEdge._preloaders[a]()}AdobeEdge._readyplayers=AdobeEdge._readyplayers||[];AdobeEdge._readyplayers.push(function(){readyToPlay&&AdobeEdge.okToLaunchComposition(compId)});function playWhenReady(){AdobeEdge._playWhenReady=!0;for(var a=0;a<AdobeEdge._readyplayers.length;a++)AdobeEdge._readyplayers[a]()}function edgeCallback(a){htFallbacks[a]&&(a=htFallbacks[a]);AdobeEdge.preload.got[a]=!0;if(a==AdobeEdge.preload.last)!AdobeEdge.bootstrapLoading||AdobeEdge._playWhenReady?AdobeEdge.okToLaunchComposition(compId):readyToPlay=!0,AdobeEdge.preload.busy=!1,AdobeEdge.preload.q.length>0&&(a=AdobeEdge.preload.q.pop(),AdobeEdge.requestResources(a.files,a.callback))}AdobeEdge.requestResources=AdobeEdge.requestResources||function(a,d){AdobeEdge.yepnope.errorTimeout=4E3;AdobeEdge.preload.busy=!0;AdobeEdge.preload.got=AdobeEdge.preload.got||{};var e,b=a.length,h=[],c;for(e=0;e<b;e++){c=a[e];if(typeof c==="string")url=c,c={load:url};else if(url=c.yep||c.load,c.callback){var k=c.callback;c.callback=function(a,b,c){k(a,b,c)&&d(a,b,c)}}if(!c.callback)c.callback=d;if(!AdobeEdge.preload.got[url])h.push(c),AdobeEdge.preload.last=url}h.length&&AdobeEdge.yepnope(h)};var filesToLoad,dlContent,preContent,doDelayLoad,signaledLoading,loadingEvt,requiresSVG,htLookup={},aLoader,aEffectors;function loadResources(a,d){AdobeEdge.preload=AdobeEdge.preload||[];AdobeEdge.preload.q=AdobeEdge.preload.q||[];d||!isCapable()?filesToLoad=a:AdobeEdge.preload.busy?AdobeEdge.preload.q.push({files:a,callback:edgeCallback}):AdobeEdge.requestResources(a,edgeCallback)}function splitUnits(a){var d={};d.num=parseFloat(a);if(typeof a=="string")d.units=a.match(/[a-zA-Z%]+$/);if(d.units&&typeof d.units=="object")d.units=d.units[0];return d}function defaultUnits(a){var d=a;if(a!=="auto"&&(a=splitUnits(a),!a||!a.units))d+="px";return d}function findNWC(a,d){if(String(a.className).indexOf(d)!=-1)return a;for(var e=a.childNodes,b=0;b<e.length;b++){var h=findNWC(e[b],d);if(h!=!1)return h}return!1}function simpleContent(a,d,e){var b=document.getElementsByTagName("body")[0],e=e||findNWC(b,compId),h,c,k,g;if(e){if(e.style.position!="absolute"&&e.style.position!="relative")e.style.position="relative"}else e=b;for(var m=0;m<a.length;m++){b=a[m];b.type=="image"?(h=document.createElement("img"),h.src=b.fill[1]):h=document.createElement("div");h.id=b.id;g=h.style;if(b.type=="text"){if(c=b.font){if(c[0]&&c[0]!=="")g.fontFamily=c[0];typeof c[1]!="object"&&(c[1]=[c[1]]);c[1][1]||(c[1][1]="px");if(c[1][0]&&c[1][0]!=="")g.fontSize=c[1][0]+c[1][1];if(c[2]&&c[2]!=="")g.color=safeColor(c[2]);if(c[3]&&c[3]!=="")g.fontWeight=c[3];if(c[4]&&c[4]!=="")g.textDecoration=b.font[4];if(c[5]&&c[5]!=="")g.fontStyle=b.font[5]}if(b.align&&b.align!="auto")g.textAlign=b.align;if(b.position)g.position=b.position;if((!b.rect[2]||b.rect[2]<=0)&&(!b.rect[3]||b.rect[3]<=0))g.whiteSpace="nowrap";h.innerHTML=b.text}if(d)h.className=d;g.position="absolute";c=b.rect[0];k=b.rect[1];if(b.transform&&b.transform[0]){var j=b.transform[0][0],f=splitUnits(j);if(f&&f.units&&(j=f.num,f.units=="%"&&b.rect[2])){var f=b.rect[2],l=splitUnits(b.rect[2]);if(l&&l.units)f=l.num,l.units=="%"&&(f=f/100*e.offsetWidth);j=j/100*f;e.offsetWidth>0&&(j=j/e.offsetWidth*100)}if(f=splitUnits(c))c=f.num;c+=j;if(!f.units)f.units="px";c+=f.units;if(b.transform[0].length>1){j=b.transform[0][1];if((f=splitUnits(j))&&f.units)if(j=f.num,f.units=="%"&&b.rect[3]){f=b.rect[3];if((l=splitUnits(b.rect[3]))&&l.units)f=l.num,l.units=="%"&&(f=f/100*e.offsetHeight);j=j/100*f;e.offsetHeight>0&&(j=j/e.offsetHeight*100)}if(f=splitUnits(k))k=f.num;k+=j;if(!f.units)f.units="px";k+=f.units}}g.left=defaultUnits(c);g.top=defaultUnits(k);g.width=defaultUnits(b.rect[2]);g.height=defaultUnits(b.rect[3]);if(b.linkURL)htLookup[h.id]=b,h.onclick=function(){var a=htLookup[this.id];a.linkTarget?window.open(a.linkURL,a.linkTarget):window.location.href=a.linkURL},g.cursor="pointer";e.appendChild(h);if(b.c)for(g=0;g<b.c.length;g++)simpleContent(b.c[g],d,h)}}var fnCycle=function(a){a?fnCycle&&setTimeout(fnCycle,20):a={event:"loading",progress:0};loadingEvt&&loadingEvt(a)},aBootcompsLoaded=[];if(!window.AdobeEdge.bootstrapListeners)window.AdobeEdge.bootstrapListeners=[];window.AdobeEdge.bootstrapCallback=function(a){window.AdobeEdge.bootstrapListeners.push(a);if(aBootcompsLoaded.length>0)for(var d=0;d<aBootcompsLoaded.length;d++)a(aBootcompsLoaded[d])};if(!window.AdobeEdge.preloadComplete)window.AdobeEdge.preloadComplete={};window.AdobeEdge.preloadComplete[compId]=function(a){AdobeEdge.$_(".edgePreload"+a).css("display","none");fnCycle=null;loadingEvt&&loadingEvt({event:"done",progress:1,reason:"complete"});aBootcompsLoaded.push(a);for(var d=window.AdobeEdge.bootstrapListeners.length,e=0;e<d;e++)try{window.AdobeEdge.bootstrapListeners[e](a)}catch(b){console.log("bootstrap error "+b)}};function isCapable(){if(hasTransform){if(requiresSVG&&!hasSVG)return!1;return!0}return!1}function onDocLoaded(){window.AdobeEdge.loaded=!0;fnCycle({event:"begin"});isCapable()?(preContent&&preContent.dom&&simpleContent(preContent.dom,"edgePreload"+compId),filesToLoad&&!signaledLoading&&(loadResources(filesToLoad),filesToLoad=void 0)):dlContent&&dlContent.dom&&(loadingEvt&&loadingEvt({event:"done",progress:1,reason:"downlevel"}),simpleContent(dlContent.dom))};window.AdobeEdge=window.AdobeEdge||{};window.AdobeEdge.framework='jquery';if(document.addEventListener){window.addEventListener("load",onDocLoaded,false)}else if(document.attachEvent){window.attachEvent("onload",onDocLoaded)}requiresSVG=true;doDelayLoad=false;htFallbacks={"edge_includes/jquery-1.7.1.min.js":"http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"};aLoader=[{load:"http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js",callback:function(result,key){if(!window.jQuery){yepnope({load:"edge_includes/jquery-1.7.1.min.js",callback:edgeCallback});return false}return true}},{load:"/js/Site_MAP/edge_includes/edge.1.5.0.min.js"},{load:"/js/Site_MAP/Site_MAP_edge.js"},{load:"/js/Site_MAP/Site_MAP_edgeActions.js"}];if(AdobeEdge.bootstrapLoading){signaledLoading=true;AdobeEdge.loadResources=doLoadResources;AdobeEdge.playWhenReady=playWhenReady}loadResources(aLoader,doDelayLoad);preContent={dom:[]};dlContent={dom:[]}})("EDGE-148673301");

I got this working following this link - in a nutshell I had to update the yepnode to the 1.5.4 version that is displayed within the Site_MAP_edgePreload.js.
Once saved & after doing a force refresh this now works in IE 11 as well as 10 & 9.
https://forums.adobe.com/thread/1242630?start=0&tstart=0

scrollBy doesn't work in Firefox and Opera

This scrollBy function works in Internet Explorer, but ignores by Firefox and Opera. Can anyone help to solve this problem?
function scrollLeft(s){
document.frames['my_iframe'].scrollBy(-s,0);
window.frames['my_iframe'].scrollBy(-s,0);
}
function scrollRight(s){
document.frames['my_iframe'].scrollBy(s,0);
window.frames['my_iframe'].scrollBy(s,0);
}
Here is an example that works in Internet Explorer browser, but doesn't work in Firefox and Opera: http://igproject.ru/iframe-scrolling/index.htm

In Firefox, etc. you need to use scrollTo() instead of scrollBy().
See: http://jsfiddle.net/4CkML/
Example:
window.scrollTo(50,50);
You cannot use scrollTo/By if the domains don't match. You can see here that a javascript error is produced:
http://jsfiddle.net/3CbZc/
Permission denied to access property 'scrollTo'
Edit - Updating answer to incorporate answer from long comment chain:
var oIF = document.getElementById('my_iframe').contentWindow; oIF.scrollBy(s, 0);

SetInterval not working fine in Chrome browsers

It's works fine for only 5 min in Chrome then the page doesn't respond; am I missing anything? This is my code. It works fine in Firefox and IE8 browsers:
function do(){
// coding
setTimeout(do,30000);
if(navigator.userAgent.toLowerCase().indexOf('chrome') > -1){
setInterval(do,20000);
}
}

do is a reserved word I believe, in Chrome ( do.. while ):
function do(){}
SyntaxError: Unexpected token do
Try naming it differently?
Wait: Why are you browser sniffing?

Thanks for Your reply . I found that setInterval method will take 100% cpu usage in chrome browser only . see the link below code.google.com/p/chromium/issues/detail?id=25892