IE9 & IE7 'Storage' is undefined - internet-explorer-7

In IE9 & IE7, I'm getting 'Storage' is undefined on line 2 of the following:
if (localStorage) {
Storage.prototype.setJsonItem = function(key, jsonItem) {
// code I have that sets a JSON object, irrelevant to this question
}
}
Why is IE7 even getting to line 2, since localStorage should be null because localStorage is not supported in IE7.
Why is Storage undefined in IE9?
Thanks! It would be sweet if IE just died altogether :P #jk #sorta
EDIT:
Changing it to if (localStorage && typeof Storage != 'undefined') seemed to do the trick. Any more elegant way of doing it? Thanks!

I solved this issue by using lawnchair, but any of the following storage libraries would work.

Related

Javascript: Expected result. React: "Unexpected use of 'name' no-restricted-globals"

I should preface this by saying that I know next to nothing about the difference between the project I started using npx create-react-app and the project I started using touch app.js touch app.html.
I have the following code:
var departments = {
id0: "Networking",
id1: "Video",
id2: "Desktop PCs",
}
departments.list = function () {
var output = "";
for (name in departments) {
if (typeof departments[name] == 'string') {
output=output+departments[name].valueOf()+", ";
}
}
return(output);
}
When I create a 'dumb' javascript app using the above-mentioned touch approach, invoking departments.list() returns Networking, Video, Desktop PCs, as I would expect. However, pasting this exact code into an unenclosed section of my App.js file created by npx create-react-app yields the compiler error Unexpected use of 'name' no-restricted-globals on each line containing the word name.
I was under the impression that any Javascript expressions are valid in React, as React is strictly a superset of Javascript? Why does this happen? Am I wrong?
I also recognize that I'm working with a lot of systems that I don't understand, but I don't even understand them well enough to start researching them yet. Npx, npm, webpack, nodejs and their relationships to Javascript and React are all mysterious to me.
You need the let keyword before your name variable.
for (let name in departments) {
...
}
When you assign to an undeclared variable in JavaScript, it manipulates the global scope. If you're using strict mode, trying to assign to a undeclared variable throws an error.
More info here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode/Transitioning_to_strict_mode#New_runtime_errors

MODX endless saving SyntaxError: expected expression, got '<'

I have to deal with MODX Revolution, when I edit any page and press Save, the progress bar keeps loading forever, console says SyntaxError: expected expression, got '<' ext-all.js:21
Tried to disable all extensions in package manager
Tested on Chrome 59 and Firefox 54
MODX Revolution 2.5.2-pl
Ext JS 3.4
IIS 8
OK, I solved this. In Chrome console I used beautifier to beautify ext-all.js. Then I replaced compressed javascript with beautified one. After a bit of debugging I've found this piece of code:
try {
A = r.contentWindow.document || r.contentDocument || g.frames[l].document;
if (A) {
if (A.body) {
if (/textarea/i.test((z = A.body.firstChild || {}).tagName)) {
w.responseText = z.value
} else {
w.responseText = A.body.innerHTML
}
}
w.responseXML = A.XMLDocument || A
}
}
The problem was that A.body.innerHTML returned JSON wrapped with "pre" tag. I didn't want to dig further into this, so just added
w.responseText = w.responseText.match(/\{.*\}/)[0]
This should be fixed by extjs or modix team I guess...

"SyntaxError: Unexpected token e in JSON at position 0" only on Chrome - why?

I discovered a strange error today that only appears when loading:
localhost:9000 and only on Chrome!
AND http://parke.linkpc.net:9000/ works fine on Chrome!
AND localhost:9000 works fine on Firefox.
I went back many builds and still see the same, so this has something to do with the hostname not specified? Note I have cleared chrome cache etc. but no help.
This happens when by 'Auth' service is being instantiated and calling:
$cookieStore.get('token'))
which calls:
$cookieStore.get('token'))
and then when it is attempting to parse a cookie at the code:
getObject: function(key) {
var value = this.get(key);
return value ? angular.fromJson(value) : value;
},
value: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI1NzY5ODI5Y2MyZjU5NGM0NWQwNjMxODkiLCJyb2xlIjoiYWRtaW4iLCJpYXQiOjE0NjY1MzI1NDAsImV4cCI6MTQ2NjU1MDU0MH0.Vm9GtPMxts1915J6UIzQtDDJ8LvXUKcbWrRxT8jQWzk"
It crashes with:
"Unexpected token e in JSON at position 0"
Why is this? And why only on Chrome?
NEXT: I deleted all the cookies and the problem went away. And I cannot generate it a second time. So go figure.... But it would be nice to know what could cause this issue!
Change the name of key 'token'.
Example:
$cookieStore.get('authKey'))
Instead of:
$cookieStore.get('token'))

AngularJS error : TypeError: Cannot read property 'toString' of undefined

Im working on a project that involves AngularJS and I am running into an error cant seem to figure out. Needless to say, I am a newbie on this hopefully you guys could help me figure this out cause I 've spent quite sometime on this issue.
here is my code
WatchboxCtrl.js
https://gist.github.com/anonymous/0c68fbd87574d61377b54981a09f66e5
and this is where the error occurs
FleetMapCtrl.js
https://gist.github.com/anonymous/9df7bc7c54a09c91dd60cd009ba9ff91
Ultimately, what i want to do is, having the app shows multiple alerts and if i click on one of the alert, the app should automatically zoom in onto the unit that the alert is originated. Previously, I have the "id" as string and it was working fine;however, I later on changed the "id" to integer and the zoom functionality no longer working. The console in gives me this error every time i click on the alert :
angular.js:11655 TypeError: Cannot read property 'toString' of undefined
at flyTo (FleetMapCtrl.js:320)
at Object.fn (FleetMapCtrl.js:287)
at Scope.$digest (angular.js:14308)
at Scope.$apply (angular.js:14571)
at HTMLButtonElement.<anonymous> (angular.js:21571)
at HTMLButtonElement.dispatch (jquery-2.0.3.min.js:5)
at HTMLButtonElement.y.handle (jquery-2.0.3.min.js:5)
It showing the error at line 320 in fleetmapCtrl.js but I cant figure out/understand why it's not working.
Please help. I searched everywhere in order to fix it but I cant seem to get it resolved. Im desperate. Thanks
As you said, the newval is no more a string and there is no zoomlevel in newVal.
When you are accessing newVal.zoomLevel it will give undefined only.
I think the below line is having issue. I coudn't see anywhere you are assigning zoomLevel to that object. Please excuse me if i missed out the same.
$scope.markers = getMarkers($scope.mapData[newVal.zoomLevel.toString()]);
You are not checking for undefined in your little method.
function isUndefinedOrNull(val) {
if (val === "" || val === null || val === "undefined") {
return true;
}
}
You are checking for the string "undefined" not undefined.
console.log(undefined==="undefined"); //false
So it should be without the quotes
function isUndefinedOrNull(val) {
return val === "" || val === null || val === undefined;
}
Now why is it undefined? You would need to track down where flyTo is being called and figure out why the watch is not returning the new value.

Angular and IE9 stupidity where native methods

In Angular 1.2.0, there is this funny comment:
// IE stupidity! (IE doesn't have apply for some native functions)
It sits on line 9835 in the functionCall function:
functionCall: function(fn, contextGetter) {
var argsFn = [];
if (this.peekToken().text !== ')') {
do {
argsFn.push(this.expression());
} while (this.expect(','));
}
this.consume(')');
var parser = this;
return function(scope, locals) {
var args = [];
var context = contextGetter ? contextGetter(scope, locals) : scope;
for (var i = 0; i < argsFn.length; i++) {
args.push(argsFn[i](scope, locals));
}
var fnPtr = fn(scope, locals, context) || noop;
ensureSafeObject(context, parser.text);
ensureSafeObject(fnPtr, parser.text);
// IE stupidity! (IE doesn't have apply for some native functions)
var v = fnPtr.apply
? fnPtr.apply(context, args)
: fnPtr(args[0], args[1], args[2], args[3], args[4]);
return ensureSafeObject(v, parser.text);
};
},
I believe it is causing me pain, but no errors are thrown so I'm having a hard time seeing exactly what native function it might be trying (and failing) to call apply on. Ever since I implemented $q library to use promises to handle async REST calls, IE9 doesn't even make an attempt to call the services (according to the network tab in dev tools). Instead, the promise is immediately rejected. I tried googling for an answer, and looking at angular's docs on using IE, but I'm getting nowhere.
Has anyone had a similar issue with getting promises to work on IE9 using angular's "q-lite"? Does anyone know what this silly comment is referring to specifically?
I believe I figured it out through a ton of trial and error. It seems the issue, in my case, was that I was using the built-in q library for promises... specifically q.all([]):
$q.all([
firstRequest.$promise,
secondRequest.$promise,
thirdRequest.$promise,
moreRequets.$promise
]).then(function() {
//do stuff
});
While I still have not found out what specific operations the angular code refers to when it says some native functions, I found that the docs for function.apply() have the following caveat:
Note: Most browsers, including Chrome 14 and Internet Explorer 9, still do not accept array-like objects and will throw an exception.
Whatever the specifics, removing my reference to $q.all solved it for me. I hope this helps anyone who has this issue in the future. If someone happens to encounter another case where this IE behavior chokes up angular, perhaps they would be so kind as to comment below or add an answer.
FYI, I am currently at angular 1.2.14.

Resources