Having IE Issues When Passing Object By Ref. and Dynamically Adding Properties - javascript

So, I've created a function to do some error checking on an XML file that I recieve from an AJAX call. Part of the validation is that the function then builds out an object for easy access while I process that data into a form. In FF, works like a charm. IE dies with the error:
Object doesn't support this property or method
Here is the function (minus the un-important bits):
function checkReceiveXMLTagString( doc, messageObject, tag ) {
var tag_nodes = doc.getElementsByTagName( tag );
...do some error checking...
messageObject[tag] = tag_str; <-- error occurs on this line
return true;
}
Here is an example of how the function is call:
if ( checkReceiveXMLTagString( messageObject.Name[0], messageObject.Name[0], "First" ) ) {
...process messageObject.Name[0].First...
}
Like I said, FF has no issues. Safari loads the pages as well. IE has issues.
Thanks!

Looks like something is making messageObject be null or undefined

If the error is on this line:
messageObject[tag] = tag_str;
Then, the only two ways I know of that that can cause an error are:
messageObject is not an object that you can set properties on (null or undefined are the most likely ways that would happen)
tag is null or undefined
Since I see that your code calls this function hundreds of times so you can't effectively just break on it, I'd suggest you put in some defensive coding to check for those conditions and output something to the debug console to identify what the state is when the problem occurs. You can even trigger a conditional breakpoint with code like this:
if (!messageObject || !tag) {
debugger;
}
In the toughest cases, you can put an exception handler around it and break when the exception is thrown:
try {
messageObject[tag] = tag_str;
} catch(e) {
debugger;
}
Both of these will allow you to capture the condition in the debugger and examine all your parameters at the time of the error.

Related

vue.esm.js:649 [Vue warn]: Error in nextTick: "TypeError: Cannot convert object to primitive value" vue

I'm getting the following warning [Vue warn]: Error in nextTick: "TypeError: Cannot convert object to primitive value" followed by an error TypeError: Cannot convert object to primitive value.
This happens upon setting an object in the store. The data is set in the store correctly, the problem appear to be happening in the renderization of the page after the nextTick is happening.
The console log for the error shows:
at baseSetAttr (vue.esm.js:6811)
at setAttr (vue.esm.js:6786)
at Array.updateAttrs (vue.esm.js:6740)
at patchVnode (vue.esm.js:6312)
at updateChildren (vue.esm.js:6188)
On the file vue.esm.js:6811 I get the following:
function baseSetAttr(el, key, value) {
if (isFalsyAttrValue(value)) {
el.removeAttribute(key);
} else {
// #7138: IE10 & 11 fires input event when setting placeholder on
// <textarea>... block the first input event and remove the blocker
// immediately.
/* istanbul ignore if */
if (isIE && !isIE9 && el.tagName === 'TEXTAREA' && key === 'placeholder' && value !== '' && !el.__ieph) {
var blocker = function (e) {
e.stopImmediatePropagation();
el.removeEventListener('input', blocker);
};
el.addEventListener('input', blocker); // $flow-disable-line
el.__ieph = true;
/* IE placeholder patched */
}
el.setAttribute(key, value); <--- The error happens here
}
}
I wish I could give more details to this question but I don't have any idea where or why this error is happening directly on my code. I have two pages using the same service, one render it correctly and the other happens this error. I have looked and made sure that both pages are exactly the same but this only happens in one
The answer will seem something extremely stupid but if anyone has an answer on why this happens I will gladly accept the answer.
The problem happens on this line of code on my implemented code:
<template #results="{ items, loading, sort, onSort, orderedHeaders, onColumnOrderChange }">
<order-summary :sort="sort"/>
The component order-summary doesn't have a prop sort. Upon removing of the prop sort everything works correctly.
<template #results="{ items, loading, sort, onSort, orderedHeaders, onColumnOrderChange }">
<order-summary/>
If anyone would have an explanation on why this happens I would gladly accept the answer
I also encountered the same problem. Although I don’t know what caused the problem, I can use
JSON.parse(JSON.stringify(***))
to solved
The reason is this: when parent component pass a prop to child component, and when child component did not receive the prop by registering prop filed, vue will think call prop.toString and put the value to the child's DOM element.
sth like this:
<div sort="[object Object]"></div>
and if the sort prop does have toString method, it will throw the Error you encoutered.
eg:
var a = Object.create(null);
var b = `${a}`, // TypeError: Cannot convert object to primitive value

Xrm.Page.getControl works in IE 11 and returns an object but the same code in the Edge browser returns null

I've got a script which runs on page load and does the following.
===== start of js file======
var curFldCtrl = Xrm.Page.getControl("transactioncurrencyid");
function ResetFieldLayout() {
curFldCtrl.setVisible(false);
}
function OnLoad() {
ResetFieldLayout();
}
===========end js file==============
Funny thing is that this code works find in Chrome and IE11, but when I run it in Microsoft Edge, it throws an error.
There was an error with this field's customized event.
Field:window
Event:onload
Error:Unable to get property 'setVisible' of undefined or null reference.
Anyone come across this before or know why this is happening?
Thanks in advance.
Try placing the variable declaration inside your function.
function ResetFieldLayout() {
var curFldCtrl = Xrm.Page.getControl("transactioncurrencyid");
curFldCtrl.setVisible(false);
}
function OnLoad() {
ResetFieldLayout();
}

How to find if message is already printed to the console

Assume I run my Javascript project in a browser and I'm inside a specific module, can I check whether is already message printed to the console ? i.e. read message from the console...
For example I'm inside my js.file inside function want to check if already printed hello world in the console.
jthanto's answer gave me an idea. I don't think it's good practice, but if you must, you can define your own console class:
var MyConsole = function(oldConsole) {
// store all messages ever logged
this.log = [];
// keep a pointer to oldConsole
this.oldConsole = oldConsole;
}
MyConsole.prototype.log = function(args) {
// push the message into log
this.log.push(Array.prototype.join.call(args));
// call oldConsole.log to actually display the message on the console
if (this.oldConsole)
this.oldConsole.log.apply(this.oldConsole, args);
}
// TODO: implement all other console methods in this fashion (apply for all console API methods)
MyConsole.prototype.<method> = function(args) {
if (this.oldConsole)
this.oldConsole.<method>.apply(this.oldConsole, args);
}
// method to check if something was printed
MyConsole.prototype.wasLogged(message) {
return this.log.indexOf(message)!==-1;
}
// replace console with an instance of MyConsole, pointing to the old console
console = new MyConsole(console);
Save it in a file and load it first (right at the top of your tags)
Use it like:
if (console.wasLogged("Hello World"))
doStuffz();
Hope it helps. Mind it's not tested, but should give you some pointers :)
You could always define your own function for "console.logging" one or more messages (if this is what you are doing), and have a boolean in this function to handle this sort of thing.
I would bet it's not "best practice", but it would solve your problem in some degree.
var messageSent = false;
var myConsoleLog = function($strMessage){
if (!messageSent) {
console.log($strMessage);
messageSent = true;
} else {
// Do whatever you feel like
}
};
Of course if you need to check for more cases you will need to alter the function to actually keep track of more messages. :)
Normally it can't be done. Look at Chrome console's API:
https://developer.chrome.com/devtools/docs/console-api
But this experimental Chrome feature can solve your problem: https://developer.chrome.com/extensions/experimental_devtools_console
Unfortunately it looks like other browsers doesn't have tools like this.

Firefox "Bad NPObject" error with swf only when using Function.apply()

I am struggling with flash and firefox (latest, 35.0.1) and can't find any solution.
I want to call an ActionScript function with javascript, using ExternalInterface.
So I wrote this simple javascript function (App is just an object to wrap my functions):
App.swfCall = function(callbackName, params) {
var callback = $('#swf object, #swf embed')[0][callbackName];
if(typeof(callback) === "function") {
callback.apply(null, params); // executed but throws NPObject error...
}
}
And Firefox throws an error:
Bad NPObject as private data!
The only help I found about this error is not relevant with my issue, as:
Everything is ready at this moment; actually the action is first initiated by a user action on the swf itself
There is no cross-domain issues (everything on the same domain)
Actually, if I do not use the Function javascript object (either with call() or apply()), everything works fine. So this is working:
App.swfCall = function(callbackName, data) {
var swf = $('#swf object, #swf embed')[0];
if(typeof(swf[callbackName]) === "function") {
swf[callbackName](data);
}
};
Anyway there are many problems with this:
I can just pass a single argument to the function
...And I have to check if the parameter is the "data" parameter is not null
I cannot pass null parameters beacause of that (not the biggest issue)
So all I need is to be able to pass parameters to the swf (0, one or more!)
And I'd really like to understand what is happening, too.
I said there is no cross-domain issues, actually it is an iframe within facebook. But obviously everything is inside it and on the same domain, so it shouldn't be a problem.. should it?
Thank you!
If you want to put you parameters as an array to your function you can try it with the new in ECMA6 defined Spread Operator:
App.swfCall = function(callbackName, data) {
var swf = $('#swf object, #swf embed')[0];
if(typeof(swf[callbackName]) === "function") {
swf[callbackName](....data);
}
};
A description of the operator can be found here:
https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Operators/Spread_operator

Internet explorer Object doesn't support this property or method

I've got this code throwing an error from an iframe:
function parentIframeResize()
{
var height = getParam('height');
// This works as our parent's parent is on our domain..
parent.parent.resizeIframe(height);
}
Not concerned about the error at all. The problem is it stops other scripts from running. Firefox, chrome or any decent browser just keeps running the rest of the scripts.
I need to suppress the error or make sure parent.parent exists before running the code.
In php I would write something like if(!empty(parent.parent) { //do stuff with parent.parent } to check if the object exists.
Yes, nested iframes is ugly O_o
Try,
if (parent.parent && parent.parent.resizeIframe) {
// parent.parent exists and supports resizeIframe
parent.parent.resizeIframe(height);
}
That should work and stop the errors.
You could wrap it up in a try/catch block:
function parentIframeResize() {
try {
var height = getParam('height');
parent.parent.resizeIframe(height);
} catch(err) {
// do something to recover from the problem, or nothing to suppress it
}
}

Categories