JavaScript Critical Error

[RehanSaeed]

When navigating to http://mysite/elmah I get the following error:

JavaScript critical error at line 3708, column 29 in http://localhost:81/glimpse?n=glimpse_client&hash=571854de\n\nSCRIPT1028: Expected identifier, string or number

I am using the following NuGet packages

  <package id="AntiXSS" version="4.3.0" targetFramework="net45" />
  <package id="Antlr" version="3.5.0.2" targetFramework="net45" />
  <package id="Autofac" version="3.5.2" targetFramework="net45" />
  <package id="Autofac.Mvc5" version="3.3.3" targetFramework="net45" />
  <package id="Autofac.Mvc5.Owin" version="3.1.0" targetFramework="net45" />
  <package id="Autofac.Owin" version="3.1.0" targetFramework="net45" />
  <package id="elmah.corelibrary" version="1.2.2" targetFramework="net45" />
  <package id="Elmah.MVC" version="2.1.1" targetFramework="net45" />
  <package id="FontAwesome.less" version="4.2.0" targetFramework="net45" />
  <package id="Glimpse" version="1.8.6" targetFramework="net45" />
  <package id="Glimpse.AspNet" version="1.9.2" targetFramework="net45" />
  <package id="Glimpse.Elmah" version="1.1.1" targetFramework="net45" />
  <package id="Glimpse.Mvc5" version="1.5.3" targetFramework="net45" />
  <package id="jQuery" version="2.1.3" targetFramework="net45" />
  <package id="jQuery.Validation" version="1.13.1" targetFramework="net45" />
  <package id="Microsoft.AspNet.Cors" version="5.2.3" targetFramework="net45" />
  <package id="Microsoft.AspNet.Mvc" version="5.2.3" targetFramework="net45" />
  <package id="Microsoft.AspNet.Razor" version="3.2.3" targetFramework="net45" />
  <package id="Microsoft.AspNet.Web.Optimization" version="1.1.3" targetFramework="net45" />
  <package id="Microsoft.AspNet.WebPages" version="3.2.3" targetFramework="net45" />
  <package id="Microsoft.jQuery.Unobtrusive.Validation" version="3.2.3" targetFramework="net45" />
  <package id="Microsoft.Owin" version="3.0.1" targetFramework="net45" />
  <package id="Microsoft.Owin.Host.SystemWeb" version="3.0.1" targetFramework="net45" />
  <package id="Microsoft.Web.Infrastructure" version="1.0.0.0" targetFramework="net45" />
  <package id="Modernizr" version="2.8.3" targetFramework="net45" />
  <package id="Newtonsoft.Json" version="6.0.8" targetFramework="net45" />
  <package id="NWebsec" version="4.0.0" targetFramework="net45" />
  <package id="NWebsec.Core" version="1.3.0" targetFramework="net45" />
  <package id="NWebsec.Mvc" version="4.0.0" targetFramework="net45" />
  <package id="Owin" version="1.0" targetFramework="net45" />
  <package id="Respond" version="1.4.2" targetFramework="net45" />
  <package id="Twitter.Bootstrap.Less" version="3.3.2" targetFramework="net45" />
  <package id="WebGrease" version="1.6.0" targetFramework="net45" />

[CGijbels]

could you add the JS error stacktrace as well?

What browser are you using?

[avanderhoorn]

Also what is on the line in question, what code is executing?

[RehanSaeed]

I'm using IE11. The line number is listed in my comment as 3708. I would say this is no major bug because this is the elmah page and not the site itself but it is an annoyance to have to go past these errors when navigating to elmah. The line of code is shown below:

defaults: {
                                server: { title: 'Server Time', description: 'Total time on the server', visible: function(details) { return details.request; }, size: 1, position: 1, align: 1, postfix: 'ms', getData: function (details) { return details.request.data.server.duration; } },
                                action: { title: 'Action', description: 'How long root Action took to execute', visible: function(details) { return details.mvc && details.mvc.data && details.mvc.data.actionExecutionTime != null; }, size: 1, position: 0, align: 0, postfix: 'ms', getData: function(details) { return parseInt(details.mvc.data.actionExecutionTime); } },
                                view: { title: 'View', description: 'How long root View took to render', visible: function(details) { return details.mvc && details.mvc.data && details.mvc.data.viewRenderTime != null; }, size: 1, position: 0, align: 0, postfix: 'ms', getData: function(details) { return parseInt(details.mvc.data.viewRenderTime); } },
                                controller: { title: 'Controller/Action', description: 'Name of the root Controller and Action', visible: function(details) { return details.mvc && details.mvc.data; }, size: 2, position: 0, align: 0, postfix: 'ms', getLayoutData: function(details) { return '' + details.mvc.data.controllerName + '.' + details.mvc.data.actionName + '(...)'; } },
                                queries: { title: 'DB Queries', description: 'Total query duration and number of all SQL queries', visible: function(details) { return details.sql && details.sql.data; }, size: 1, position: 0, align: 0, getLayoutData: function(details) { return '' + parseInt(details.sql.data.queryExecutionTime) + 'ms/'  + details.sql.data.queryCount + ''; } },
                                connections: { title: 'DB Connections', description: 'Total connection open time and number of all SQL connections used', visible: function (details) { return details.sql && details.sql.data; }, size: 1, position: 1, align: 1, getLayoutData: function (details) { return '' + parseInt(details.sql.data.connectionOpenTime) + 'ms/' + details.sql.data.connectionCount + ''; } },
                                time: { title: 'Server Time', description: 'Time on the server', visible: function (details) { return details.environment && details.environment.data; }, size: 4, position: 2, align: 1, getLayoutData: function (details) { var diff = parseInt((new Date(details.environment.data.serverTime + ' ' + details.environment.data.serverTimezoneOffset) - new Date()) / 1000 / 60 / 60); return '' + details.environment.data.serverTime + ' GMT' + details.environment.data.serverTimezoneOffset + ' ' + (details.environment.data.serverDaylightSavingTime ? ' (w/DLS)' : '') + (diff ? ' Δ' + (diff > 0 ? '+' : '') + diff + '' : ''); } },
                                viewStateSize: { title: 'ViewState', description: 'Size of your page ViewState', visible: function (details) { return details.webforms && details.webforms.data; }, size: 1, position: 0, align: 0, postfix: 'bytes', getData: function (details) { var viewstate; return (viewstate = $('#__VIEWSTATE').val()) ? viewstate.length : 0; } },
                                loading: { title: 'Load', description: 'Time between Begin PreLoad and End LoadComplete', visible: function (details) { return details.webforms && details.webforms.data && details.webforms.data.loadingTime != null; }, size: 1, position: 0, align: 0, postfix: 'ms', getData: function (details) { return parseInt(details.webforms.data.loadingTime); } },
                                rendering: { title: 'Render', description: 'Time between Begin PreRender and End Render (including SaveState events)', visible: function (details) { return details.webforms && details.webforms.data && details.webforms.data.renderingTime != null; }, size: 1, position: 0, align: 0, postfix: 'ms', getData: function (details) { return parseInt(details.webforms.data.renderingTime); } },
                            },

[RehanSaeed]

A surefire way to recreate it is to use my Visual Studio Project Template. Open the /elmah page in IE11 and it breaks. I just tried Chrome and it seems ok.

[avanderhoorn]

Any idea of what part of this line is causing the issue, have you been able to debug it a little?

[RehanSaeed]

It's difficult because its all minified and I'm no JavaScript guru. This is the full that Visual Studio throws up while debugging:

JavaScript critical error at line 3708, column 29 in http://localhost:81/glimpse?n=glimpse_client&hash=571854de\n\nSCRIPT1028: Expected identifier, string or number

It then shows this dialog:

Unhandled exception at line 1, column 1 in http://localhost:81/glimpse?n=glimpse_metadata&hash=571854de&callback=glimpse.data.initMetadata 0x800a1391 - JavaScript runtime error: 'glimpse' is undefined

Followed by:

Unhandled exception at line 1, column 1 in http://localhost:81/glimpse?n=glimpse_request&requestId=0cba3bb5-cdee-4367-80ed-02565ee68b0c&hash=571854de&callback=glimpse.data.initData 0x800a1391 - JavaScript runtime error: 'glimpse' is undefined

[sky3913]

Hi @avanderhoorn, I've got this problem too when installed Glimpse into the project that Elmah already installed and run the application in IE 10/11 (The error doesn't appear if it run in Chrome).

I create an application using ASP.NET MVC 5 and Elmah.MVC for the exception logging. Before installed Glimpse, I can access Elmah via url http://localhost:{port_number}/elmah. After installed Glimpse, I can still access the Elmah but there is a JavaScript error. Is there any workaround or update for this error?

[avanderhoorn]

@sky3913 is it the exact same error, any chance you can debug it a little to help track down the issue?

[sky3913]

I've tried to debug it by run the application, type 'elmah' on the url (http://localhost:53154/elmah). It will display a message box, as seen below:

If I clicked 'Stop Debugging', it will stop the application and if I clicked Continue, it will display the elmah error logs.

I'm sorry I can't help you much, that's all I can do. As I said this only happens in IE browser when I access elmah error logs page.

[avanderhoorn]

Only thing I can guess that it might be is the tailing , on the line above. Have to remove it and see if it helps.

[sky3913]

Thanks for the answer, but I can't find the file, where should I have to remove the tailing ,?

[avanderhoorn]

Here you go - https://github.com/Glimpse/Glimpse.Client/blob/master/source/glimpse.hud.js#L229

[sky3913]

Ok I'll give it a try, thanks @avanderhoorn