Error with Ext.Msg in js-test-driver tests - javascript

In my js-test-driver tests, I'm having an error from simply calling
Ext.Msg.alert('Error', 'An error occurred while trying load parameters for action with id ' + actionId);
Error Message: Uncaught TypeError: Cannot read property 'insertBefore' of null
Note that Ext.Msg.rendered is true and that Ext.Msg.el.dom.parentNode is null if I stop execution just before the error.
This error does not happen if:
The real app is running, only during tests.
If I run a single test, only if I run multiple tests that end up calling Ext.Msg.alert
Stack trace
Ext.define.insertBefore (ext-all-debug.js:13281)
Ext.define.show (ext-all-debug.js:42064)
Ext.define.sync (ext-all-debug.js:82755)
Ext.define.syncShadow (ext-all-debug.js:33992)
Ext.define.onAfterFloatLayout (ext-all-debug.js:34002)
Ext.define.afterComponentLayout (ext-all-debug.js:34374)
Base.implement.callParent (ext-all-debug.js:4455)
Ext.define.afterComponentLayout (ext-all-debug.js:38639)
Ext.define.notifyOwner (ext-all-debug.js:38067)
Ext.define.callLayout (ext-all-debug.js:125114)
Ext.define.flushLayouts (ext-all-debug.js:125283)
Ext.define.runComplete (ext-all-debug.js:125769)
callOverrideParent (ext-all-debug.js:36)
Base.implement.callParent (ext-all-debug.js:4455)
Ext.override.runComplete (ext-all-debug.js:29905)
Ext.define.run (ext-all-debug.js:125750)
Ext.define.statics.flushLayouts (ext-all-debug.js:29913)
Ext.define.statics.updateLayout (ext-all-debug.js:29947)
Ext.define.updateLayout (ext-all-debug.js:31844)
Ext.define.onContentChange (ext-all-debug.js:36116)
Ext.define.updateLayout (ext-all-debug.js:31839)
Ext.define.onContentChange (ext-all-debug.js:36116)
Ext.define.updateLayout (ext-all-debug.js:31839)
Ext.define.setTitle (ext-all-debug.js:53058)
Ext.define.setTitle (ext-all-debug.js:55155)
Ext.define.reconfigure (ext-all-debug.js:90310)
Ext.define.show (ext-all-debug.js:90476)
Ext.define.alert (ext-all-debug.js:90600)
Ext.define.onInstanceRetrievalError (BaseWorkflowActionController.js:139)
(anonymous function) (ext-all-debug.js:2265)
Ext.apply.callback (ext-all-debug.js:7437)
Ext.define.Ext.apply.inheritableStatics.load (mock.js:38)
Ext.define.onDocumentClick (BaseWorkflowActionController.js:73)
(anonymous function) (VM6566:6)
Ext.apply.createListenerWrap.wrap (ext-all-debug.js:10786)
AsyncTestCase.test_unknown_error_displays_error_dialog (WorkflowSingleActionController.Test.js:87)
Any ideas of what could be going on? Or something to try?
This question was cross-posted to http://www.sencha.com/forum/showthread.php?288372-Error-calling-Ext.Msg.alert-from-js-test-driver-tests&p=1053744#post1053744

The problem is that js-test-driver runs the following code which removes any content from the DOM at the end of each test.
var testRunnerPlugin =
new jstestdriver.plugins.TestRunnerPlugin(Date, function() {
jstestdriver.log(jstestdriver.jQuery('body')[0].innerHTML);
jstestdriver.jQuery('body').children().remove();
jstestdriver.jQuery(document).unbind();
jstestdriver.jQuery(document).die();
}, runTestLoop);
Therefore, the global Ext.Msg which was rendered onto the body becomes orphaned and it fails when trying to sync the shadow.
The solution is not to use the global Ext.Msg, always instantiate a new Ext.message.MessageBox if you want your code to be testable in js-test-driver
Here's a test case that reproduces the exact same stack trace https://fiddle.sencha.com/#fiddle/7i1

Related

Error can't redefine non-configurable property "userAgent"

Lately we have been getting a lot of javascript errors "can't redefine non-configurable property "userAgent"".
We don't attempt to redefine userAgent in our code. We barely even reference userAgent. The only places would be in code like the following:
var browser_msie = (navigator.userAgent.match(/msie/i) || navigator.userAgent.match(/trident/i)) ? true : false;
I am wondering if this error is rather coming from some bad browser behavior. It only started showing up recently.
Last evening we got over 20,000 of such error messages, and all from the same member of our service.
EDIT
The error information is as follows:
Error Message:
Message: TypeError: can't redefine non-configurable property "userAgent"
URL: https://www.rephunter.net/member-home.php
Line:1
Column:130
Stack:#https://www.rephunter.net/member-home.php:1:130
Error Traceback:
#0 Called backtrace in file /var/www/rephunter/www/webroot/include/error-handler-inc.php as line #68
#1 Called error_handler in file as line #
#2 Called trigger_error in file /var/www/rephunter/www/webroot/ajax/javascript-error.php as line #14
Unfortunately this offers no help, as line 1 of the page is just <!DOCTYPE html>. I don't see how to get to that part of the code. Of course if that were possible it might be easy to see the cause of the issue.
I recall in the past the Dev Tools might have given a "spiders view" of the page, but now I only see the DOM on the Elements tab, and Sources. Both of these are formatted and their is no way to see what "line 1 char 130" means.

'Failed with: TypeError: Cannot call method 'replace' of undefined' when running Parse background job

Whenever I run my Parse background job, it fails and I get the error below:
Failed with: TypeError: Cannot call method 'replace' of undefined
at Object.b.Query._quote (Parse.js:3:14236)
at Object.b.Query.contains (Parse.js:3:14337)
at main.js:1488:40
This is the area causing the problem, line 1488 is the 2nd line:
var MCI_Results_Update_Query = new Parse.Query(MCI_Results);
MCI_Results_Update_Query.contains('searchTerm', searchTermList[i]);
MCI_Results_Update_Query.equalTo('parent', parentUser);
All I'm doing here is setting the parameters for a query, there's no replace method involved at all. What's causing it to state that as the error? I triple checked, and I'm almost positive this is the line it's referring to.

Strange Meteor Error: [Log] Exception from Deps recompute function: NotFoundError: DOM Exception 8

This is such a random error message? What are good troubleshooting tips to track where this is coming from?
SAFARI Console:
[Log] Exception from Deps recompute function: NotFoundError: DOM Exception 8 (meteor.js, line 741)
insertBefore#[native code]
_insertNodeWithHooks#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:349:24
_insert#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:318:36
attach#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:395:23
_insert#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:313:13
attach#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:395:23
_insert#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:313:13
attach#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:395:23
setMembers#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:438:18
doMaterialize#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:1877:32
nonreactive#http://10.0.0.9/packages/deps.js?02d2ad4c6472ce004db73ba12c99864ab9acb468:397:13
doRender#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:1868:23
http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:1813:20
withCurrentView#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:2046:16
viewAutorun#http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:1812:33
_compute#http://10.0.0.9/packages/deps.js?02d2ad4c6472ce004db73ba12c99864ab9acb468:229:36
_recompute#http://10.0.0.9/packages/deps.js?02d2ad4c6472ce004db73ba12c99864ab9acb468:243:22
flush#http://10.0.0.9/packages/deps.js?02d2ad4c6472ce004db73ba12c99864ab9acb468:337:24
Chrome Debug:
Exception from Deps recompute function: Error: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.
at Error (native)
at Function.DOMRange._insertNodeWithHooks (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:349:12)
at Function.DOMRange._insert (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:318:16)
at DOMRange.attach (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:395:16)
at Function.DOMRange._insert (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:313:7)
at DOMRange.attach (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:395:16)
at Function.DOMRange._insert (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:313:7)
at DOMRange.attach (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:395:16)
at DOMRange.setMembers (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:438:12)
at doMaterialize (http://10.0.0.9/packages/blaze.js?cf9aea283fb9b9d61971a3b466bff429f9d66d7d:1877:22)
Based on the Chrome error, you have a jQuery insertBefore statement that’s referencing something invalid. Search your code for insertBefore and comment them out one at a time until you make the error message disappear. If you don’t have any insertBefores in your code, it’s being called by a plugin or something lower-level.
I don't know what is it, but after restarting meteor app, exception is gone.

Stack traces that utilise source mapping

Overview:
The stack trace output in the browser console is not the same trace that is returned when Error.stack is called. The console stack trace seems to take into account sourcemaps whereas the Error.stack stack trace does not.
Console Output
Here is the default stack trace that is output to the console.
Uncaught TypeError: Cannot set property 'y' of undefined source.js:4
(anonymous function) source.js:4
(anonymous function) source.js:4
(anonymous function) (index):17
Error.stack Output
Here is the stack trace from Error.stack:
TypeError: Cannot set property 'y' of undefined
at <anonymous>:1:37
at <anonymous>:1:60
at http://localhost:63342/source-map-example/example2/:17:23 (index):12
Source Code:
Here is the code that I used for this experiment:
<script>
window.onerror = function() {
console.log(arguments[4].stack);
}
var script = document.createElement('script');
script.textContent = '(function(){var person={};person.x.y="Throws an error..."})();//# sourceMappingURL=source.min.map';
document.body.appendChild(script);
</script>
Question:
Is it possible to programmatically obtain a stack trace that includes references to files & lines based on the associated sourcemap?
Edit: console.trace and new Error().stack
note: I didn't use window.onerror for these examples, instead I wrapped the embedded JS in a try...catch and attempted to utilise these approaches within the catch. The reason for this was because the stack trace didn't provide any trace into the embedded JS for either method when used within window.onerror.
console.trace() works the best, but of course the output can't be captured. Even still, this does not work as expected. The output contains a stack trace that points to the console.trace() line, and little else.
console.trace() source.js:9
(anonymous function) source.js:9
(anonymous function) source.js:9
(anonymous function)
new Error().stack does not work as expected either. It does contain a stack trace, but it's not using the sourcemap.
Error
at <anonymous>:1:85
at <anonymous>:1:105
at http://localhost:63342/source-map-example/example2/:18:23 source.js:18
Unfortunately, this is browser-specific feature is not currently supported in either Firefox or Chrome (and I am unfamiliar with its support in other browsers).
In Chrome, you can follow feature request currently being implemented at https://code.google.com/p/chromium/issues/detail?id=357958
Depending on your use case and if you have some means of capturing the sourcemaps themselves, Mozilla has an excellent sourcemapping tool that will let you map your sources/stacktraces at https://github.com/mozilla/source-map/.

Ember.js: How to track down deferred action runtime errors?

I occasionally get the following runtime error.
Assertion failed: Error while loading route: TypeError: Cannot call method 'get' of undefined ember.js?body=1:3226
(anonymous function) ember.js?body=1:3226
defaultActionHandlers.error ember.js?body=1:32032
triggerEvent ember.js?body=1:31884
trigger ember.js?body=1:30910
Transition.trigger ember.js?body=1:30131
handleError ember.js?body=1:31244
invokeCallback ember.js?body=1:8377
(anonymous function) ember.js?body=1:8431
EventTarget.trigger ember.js?body=1:8200
(anonymous function) ember.js?body=1:8502
DeferredActionQueues.flush ember.js?body=1:5674
Backburner.end ember.js?body=1:5765
Backburner.run ember.js?body=1:5804
executeTimers ember.js?body=1:6056
(anonymous function) ember.js?body=1:5914
The problem is that the entire call stack is ember code. But the error must be caused by my code.
What is a generic approach to determine the original code that is causing the problem?
Set your debugger to stop on all exceptions, then walk up the stack trace and find out what code of yours is firing it.
This particular error looks like you were transitioning to another route and it blew up. There are only a few things (major understatement) that happen during the transition, I'll point out the biggins that would break the transition, they are all located on the route.
overridden model hook
overridden setupController hook
overridden serialize hook
You'll want to look through your code and add either add some validation that an item exists before you call get on it, or switch to using Ember.get(obj, property), but that just pushes off your exception until later.
I see this error a lot in the setupController and serialize hook.
serialize: function(model){
// good spot to fail
return { custom_id: model.get('some_id') };
}
setupController: function(controller, model){
// good spot to fail
var something = model.get('something');
}
These particular areas speak to a bigger issue, your model hook (or transitionTo/transitionToRoute code) is passing a null/empty model.

Categories

Resources