Develop Reference

How to see results of console.profile()?

According to Chrome Console API Reference and MDN Docs, using console.profile('label') to start profiling and later using console.endProfile() to end profiling, should result in a profile added to Profiles (has been since renamed to Performance) panel in Chrome.
This works for me in Firefox, but I don't get any profiles when I run my code in Chrome. Instead I get the warning:
DevTools: CPU profile parser is fixing 16 missing samples.
Am I missing something here or is this a bug in Chrome DevTools?

Turns out the profile goes into a different panel:
CPU profiles added to the JavaScript profiler panel. You can open it by clicking three dots menu (in the top right corner)
⋮-> More tools -> JavaScript Profiler.

The profiling can be observed from below code part.
function profileTest(callback) {
let i = 0;
let work = setInterval(function() {
if(i == 3) {
callback();
clearInterval(work);
return;
}
console.log('Doing some work..');
i = i + 1;
}, 1000);
}
console.profile("profileTest()");
profileTest(function(){
console.profileEnd();
});
Note: setInterval is used for simulation purpose.
As #atavakoli have already answered, created profile can be seen in 'CPU PROFILES' part in 'Javascript Profiler' tab that can be opened from Developer Tools → Three dots → More tools. For example below screenshot shows the result profile of above code part.
See following link: https://developers.google.com/web/updates/2016/12/devtools-javascript-cpu-profile-migration
For the warning message, below question link can be referred.
Chrome: CPU profile parser is fixing n missing samples

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

What is WKErrorDomain error 4 from WKWebView

fatal error: LPWebView encounters an error: Error Domain=WKErrorDomain Code=4
"A JavaScript exception occurred" UserInfo=0x79d9c700
{NSLocalizedDescription=A JavaScript exception occurred}
I encountered this error when I tried to evaluate a JavaScript function with WKWebView.
I used loadHTMLString to load a template to the webview.
let bundle = NSBundle.mainBundle()
if let editorURL = bundle.URLForResource(self.kTemplateName,
withExtension: "html") {
var error : NSError?
//get html string from editor.html
if let htmlString = String(contentsOfURL: editorURL, encoding: NSUTF8StringEncoding, error: &error){
if error != nil {
assertionFailure("error encountered reading html string for \(error)")
} else {
self.loadHTMLString(htmlString, baseURL: bundle.bundleURL)
}
}
} else {
assertionFailure("LPWebView template not found")
}
I wonder what this error code means and how to solve it?
Thank you very much!

So if we dig into the headers:
/*! #constant WKErrorDomain Indicates a WebKit error. */
#availability(iOS, introduced=8.0)
let WKErrorDomain: String
/*! #enum WKErrorCode
#abstract Constants used by NSError to indicate errors in the WebKit domain.
#constant WKErrorUnkcnown Indicates that an unknown error occurred.
#constant WKErrorWebContentProcessTerminated Indicates that the Web Content process was terminated.
#constant WKErrorWebViewInvalidated Indicates that the WKWebView was invalidated.
#constant WKErrorJavaScriptExceptionOccurred Indicates that a JavaScript exception occurred.
*/
#availability(iOS, introduced=8.0)
enum WKErrorCode : Int {
case Unknown
case WebContentProcessTerminated
case WebViewInvalidated
case JavaScriptExceptionOccurred
}
Error code 4 would corresponds to JavaScriptExceptionOccurred, or WKErrorJavaScriptExceptionOccurred.
In other words, the JavaScript function causes some error.
Probably not more here that you couldn't guess already. For resolution, I would suggest using the developer features of a web browser such as Safari, loading the HTML and debugging.
In fact, as explained in the WWDC 2014 video, "Introducing the Modern WebKit API", your desktop Safari browser can "inspect the WKWebView using the Safari web inspector, including any user scripts that you've injected."
To use this, while the WKWebView is loaded in memory in your running app on the iOS simulator, open the desktop Safari browser and access Develop on the top menu bar then iOS Simulator. That will show a drop down of the web view's document objects.
For more info on debugging JavaScript, take a look at Web Inspector: Understanding Stack Traces

Parallel.js have problems with Blob in IE

I need to execute functions in "parallel" and I use parallel.js:
var p = new Parallel(items);
var fn1 = function (item) {
doSomething(item);
};
p.map(fn1).then(function () {
otherFunction();
});
But IE shows the following error:
[Q] Unhandled rejection reasons (should be empty): (no stack) SecurityError
HTML7007: One or more blob URLs were revoked by closing the blob
for which they were created. These URLs will no longer resolve as
the data backing the URL has been freed.
How to fix this error?
I had review parallel.js page in IE and all examples work fine.
I use Durandal, Breeze and Knockout.
In Firefox shows the following error:
[Q] Unhandled rejection reasons (should be empty):
["(no stack) [Exception..... location: "<unknown>"]"]
and in Google Chrome no shows error, but parallel.js no work.

In case you're still having trouble with this, to make Parallel.js work in Internet Explorer you have to include the evalPath option, as mentioned on the website:
evalPath (optional): This is the path to the file eval.js. This is
required when running in node, and required when requiring files in
browser environments (to work around cross-domain restrictions for web
workers in IE 10).
This also applies to IE 11.
So your code will become:
var p = new Parallel(items, {evalPath: [PATH_TO_EVAL_JS]});
Where [PATH_TO_EVAL_JS] points to eval.js.

Google Maps in IE11 gives "Unspecified error"

I'm getting a very strange error when using custom Google Maps in a website of one of our clients. The map has some markers on it, and when you open the marker you can see a dialog with the address of that location. When I close this dialog (obviously by clicking the cross) in IE11, I get an "Unspecified error". For some reason, this error is being thrown from the method "getBoundingClientRect()". No other browser has this issue (not even IE8).
I am using Google Maps API version 3.14.
Does anyone know what this could be? I'm not sure if it's necessary to place any code, but I'm willing to do that if that makes everything more clear.

You can use this fix for IE (place this code on top):
HTMLElement.prototype._getBoundingClientRect=HTMLElement.prototype.getBoundingClientRect;
HTMLElement.prototype.getBoundingClientRect = function() {
try {
return this._getBoundingClientRect();
} catch(e) {
return { top : this.offsetTop, left : this.offsetLeft };
}
}