We Keep Coding

IE11 function not getting passed constructor

On pageload i am firing a function that should open a lightbox. In Chrome, FF, Opera, Edge and Safari everything works as it intented. In IE11 however it is not. I am not getting a warning or error in the console so I have no clue what I am doing wrong here.
I stripped the code below to the essential. In Chrome (and other browsers) the console log goes from 1 to 3 to 2. In IE11 i am only getting 1 and I have no idea why it doesn't go to 3 or 2. I thought it had something to do with bind(), but that seems to be supported.
I have to admit I am pretty new with constructors, prototypes and bind.
constructor(el) {
this.$el = $(el);
console.log('1');
this.getLocation = getLocation.bind(this);
this.loadLB();
console.log('2');
}
loadLB() {
const url = new URL(window.location.href);
console.log('3');
this.getLocation('url');
}

Are you using ConstructorMethod? It's also not supported by IE. I don't know if you have used some polyfills to make it work in IE 11.
Besides, IE doesn't support URL() constructor. You can add this polyfill to make URL() work in IE 11:
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>

Chrome 63 for IOS throws error on javascript variable declarations with LET

I have a PWA app coded with PHP and JS. And it is working well on Chrome, Firefox, Edge and Opera on windows desktop. I also tried on Chrome for android, and it working as expected also.
But when i tried it on Ipad 2 with Chrome 63, i even couldn't login to my dashboard. When i used remote debugging, i realized that it throws error on Javascript variable declarations with let.
let usr = $('#usrInput').val();
let pwd = $('#pwdInput').val();
When i changed them to var i finally logged in to my dashboard.
But the problem is, there are a lot of variable declarations with letand it is hard and also not correct to do so. I also use a lot of Javascript Libraries, which i assume are full of let declarations.
I also do not know what kind of problems (apart from variable declarations) will still occur, even i changed all let to var.
Is it all about a compatibility issue? Or am i missing something else?
UPDATE: I changed let variable declarations to var. And finally could log in. Here is the initial and most important error log:
app.js:217 Uncaught TypeError: Cannot read property 'userChoice' of undefined
Which is triggered from:
var promtEvent;
window.addEventListener('beforeinstallprompt', (e) => {
// Prevent Chrome 67 and earlier from automatically showing the prompt
e.preventDefault();
localStorage.setItem("uygulamaYuklendimi", false);
btnAdd.removeAttribute("disabled", "");
btnAdd.innerText = 'Uygulamayı Yükle';
// Stash the event so it can be triggered later.
promtEvent = e;
// satinalmaKodu.style.display = 'block';
});
btnAdd.addEventListener('click', (e) => {
// hide our user interface that shows our A2HS button
$('#ayarlarModal').modal('hide');
$('#satinalmaKodu').collapse();
// Show the prompt
if(promtEvent) promtEvent.prompt();
// Wait for the user to respond to the prompt
promtEvent.userChoice
.then((choiceResult) => {
promtEvent = null;
});
});
I believe, chrome can't initialize beforeinstallprompt event, which is probably because of compatibility issue.
Is there a way, or some kind of library which includes this behaviour?
PS: Javascript is enabled on both Safari and Chrome for IOS.

How do I run Jasmine tests in Microsoft Edge?

I am trying to run Jasmine js tests in Microsoft Edge, but I get the following error:
Object doesn't support property or method 'initializeJasmine'
I am launching my tests from visual studio with the Chutzpah plugin.
From what I can see in the edge console, the exception is from the following code:
var currentWindowOnload = window.onload;
window.onload = function() {
if (currentWindowOnload) {
currentWindowOnload();
}
window.initializeJasmine(); // <--- Exception here
};
My tests runs in all my other browsers (Chrome, IE, FF and Opera), but it doesn't seem to work in MSEdge.
Anyone having the same issue?
How can I make them run in Microsoft Edge?

I'm using Edge for Jasmine test.
Find the directory: node_modules/karma-chrome-launcher
Change all patch chrome for edge:
var windowsChromeDirectory, i, prefix
var suffix = '\Microsoft\' + chromeDirName + '\Application\msedge.exe'
var prefixes = [process.env.LOCALAPPDATA, process.env.PROGRAMFILES, process.env['PROGRAMFILES(X86)']]
and change all getChromeExe('Chrome') -> ('Edge').
It's not efficient, but it works.img_jasmine_edge

"'localStorage' is null or not an object" Error in IE8

I have this string which i'm trying to store and get to localStorage, and retrieve from it so it could show.
Here's my code:
var datas = new Array;
if (navigator.appName !== 'Microsoft Internet Explorer'){
var qsVal = document.getElementsByClassName("val");
}
else{
var qsVal = document.querySelectorAll('.val');
}
if (navigator.appName !== 'Microsoft Internet Explorer'){
var qsKey = document.getElementsByClassName("key");
}
else{
var qsKey = document.querySelectorAll('.key');
}
var storedPlays;
var stuff = document.getElementById("stuff");
function pushArray(){
for (var i=0, len = qsVal.length; i < len; i++){
thisValue = qsVal[i].value;
thisKey = qsKey[i].value;
datas.push([thisValue,thisKey]);
}
localStorage.setItem('datas', JSON.stringify(datas));
}
function showStuff(){
storedPlays = JSON.parse(localStorage.getItem('datas'));
document.getElementById("stuff").innerHTML = storedPlays;
}
It works great with FF and Chrome, but IE8 returns "'localStorage' is null or not an object" when I call 'showStuff'.
What's interesting is that it doesn't give me an error when I call 'pushArray', which uses 'localStorage' as well.
Iv'e also tried using "window.localStorage" instead of just "localStorage", it returned the same error...
IE8 is supposed to support localStorage, according to Microsoft and W3, so does anyone has any clue as to where the problem is?
Thanks a million!
EDIT - This is a jsfiddle for the code. for some reason, it doesn't work that good but just to give you a feel of the code...

As per my understanding IE8 give storage to only valid domains. Try placing your example in some Web-server it should resolve the issue.
I faced the same issue when I tested it as an individual file but when i placed it in a server(Tomcat in my case) it just worked fine.

Check if you are actually in IE 8 mode - as opposed to quirks or IE 7 mode. Fastest way to do this is hit F12 to bring up the dev tools, and the browser mode is listed on the upper right of that tab.

I would give using window.localStorage as shot. See Introduction to Web Storage for IE

Can you open the developer tools in IE and check that typeof json. stringify and json.parse are functions and also localstorage. I am not sure whether native JSON exist on IE.
Also why are you setting the object inside the loop, shouldnt it be outside it?
[Edit]
Added this fiddle for your code jsfiddle.net/yrhdN/2 and everything seems to work fine. I have tested in IE9 under IE8 compatibility mode)
[Edit]
One more thing about this code, it seems innerHtml in showStuff() doesn't work with a paragraph. Changing the html from p to div and using innerText makes things a little better:
<div id="stuff">
</div>
function showStuff(){
var storedPlays = JSON.parse(localStorage.getItem('datas'));
document.getElementById("stuff").innerText = storedPlays;
}
This seems to happen only in IE. Here is an updated fiddle: http://jsfiddle.net/yrhdN/7/

Try this also if you do not wish any local server application to shoot the webpage.
Look for the code in your script : window['localStorage'] !== null
change it to : window['localStorage'] != null
It worked in my case.

How can I use console logging in Internet Explorer?

Is there a console logger for IE? I'm trying to log a bunch of tests/assertions to the console but I can't do this in IE.

You can access IE8 script console by launching the "Developer Tools" (F12). Click the "Script" tab, then click "Console" on the right.
From within your JavaScript code, you can do any of the following:
<script type="text/javascript">
console.log('some msg');
console.info('information');
console.warn('some warning');
console.error('some error');
console.assert(false, 'YOU FAIL');
</script>
Also, you can clear the Console by calling console.clear().
NOTE: It appears you must launch the Developer Tools first then refresh your page for this to work.

Since version 8, Internet Explorer has its own console, like other browsers. However, if the console is not enabled, the console object does not exist and a call to console.log will throw an error.
Another option is to use log4javascript (full disclosure: written by me), which has its own logging console that works in all mainstream browsers, including IE >= 5, plus a wrapper for the browser's own console that avoids the issue of an undefined console.

Extremely important if using console.log() in production:
if you end up releasing console.log() commands to production you need to put in some kind of fix for IE - because console is only defined when in F12 debugging mode.
if (typeof console == "undefined") {
this.console = { log: function (msg) { alert(msg); } };
}
[obviously remove the alert(msg); statement once you've verified it works]
See also 'console' is undefined error for Internet Explorer for other solutions and more details

There is Firebug Lite which gives a lot of Firebug functionality in IE.

Simple IE7 and below shim that preserves Line Numbering for other browsers:
/* console shim*/
(function () {
var f = function () {};
if (!window.console) {
window.console = {
log:f, info:f, warn:f, debug:f, error:f
};
}
}());

In his book, "Secrets of Javascript Ninja", John Resig (creator of jQuery) has a really simple code which will handle cross-browser console.log issues. He explains that he would like to have a log message which works with all browsers and here is how he coded it:
function log() {
try {
console.log.apply(console, arguments);
} catch(e) {
try {
opera.postError.apply(opera, arguments);
}
catch(e) {
alert(Array.prototype.join.call( arguments, " "));
}
}

For IE8 or console support limited to console.log (no debug, trace, ...) you can do the following:
If console OR console.log undefined: Create dummy functions for
console functions (trace, debug, log, ...)
window.console = {
debug : function() {}, ...};
Else if console.log is defined (IE8) AND console.debug (any other) is not defined: redirect all logging functions to console.log, this allows to keep those logs !
window.console = {
debug : window.console.log, ...};
Not sure about the assert support in various IE versions, but any suggestions are welcome.

You can use cross-browser wrapper: https://github.com/MichaelZelensky/log.js

For older version of IE (before IE8), it is not straight forward to see the console log in IE Developer Toolbar, after spending hours research and trying many different solutions, finally, the following toolbar is great tool for me:
http://www.my-debugbar.com/wiki/CompanionJS/Installing
The main advantage of this is providing a console for IE6 or IE7, so you can see what are the error (in the console log)
Note:
It is free
screen shot of the toolbar

I've been always doing something like this:
var log = (function () {
try {
return console.log;
}
catch (e) {
return function () {};
}
}());
and from that point just always use log(...), don't be too fancy using console.[warn|error|and so on], just keep it simple. I usually prefer simple solution then fancy external libraries, it usually pays off.
simple way to avoid problems with IE (with non existing console.log)