EzDevInfo.com

es5-shim

ECMAScript 5 compatibility shims for legacy JavaScript engines

PouchDB not working in IE8

I am testing PouchDB app in IE8, but I am getting following errors. I have included pouchdb.localstorage.js and es5.shim.js file in index.html.

You can find below the errors:

  1. Expected Identifier, string or number for following line (pouchdb.localstorge.js):

Line no. 11019: , try: [

  1. Expected Identifier for following line (main.js - local js file):

}).catch(function (err) { console.log('Unable to insert into DB. Error: ' + err.name + ' - ' + err.message); });

How can I fix these issues?


Source: (StackOverflow)

When do I need shim and when do I need sham?

Why does the EC5 Shim library have two files? When do I need each one?


Source: (StackOverflow)

Advertisements

How to include es5-shim in browserify bundle

Should I do something like the following in my entry point:

var es5Shim = require('es5-shim');

That gets included properly in the bundle but it just seems like there has to be a better way and I'm missing it.


Source: (StackOverflow)

How to stop a forEach loop in Typescript - can I use .some()?

I've seen this question about stopping a ES5 forEach loop, which pretty much suggests to use .every() or .some() instead of forEach.

I believe I remember typescript uses shims for old browsers to support for example forEach. Is this correct and if so, can I use .some and .every just as well with the same kind of support as forEach?


Source: (StackOverflow)

How to set default value with an accessor value in Object.defineProperties?

I want to be able to set new name upon instanciation of a new object. But somehow I got an infinite loop to be happening. I dont know how to fix it.

function Human(opt) {
  this.name = opt.name; //this causes ranger error or infinite loop
}

Object.defineProperties(Human.prototype, {
  name : {
    set : function(val) {
      if(name === 'Einstein') {
        console.log('Hello Einstein');
      }
      this.name = val;
    },
    configurable : false
  }
});

Source: (StackOverflow)

bind polyfill for PhantomJS

I am trying to add bind polyfill in my phantomjs file using es5-shim.js.

I have tried to include es5-shim.js using require(), but I am still getting error when I execute the phantomjs file. What is the correct way to use this?


Source: (StackOverflow)

Check in javascript if es5-shim.js is loaded or not? That's for ie8

Is there a way to define if

https://cdnjs.cloudflare.com/ajax/libs/es5-shim/4.1.0/es5-shim.js

from

https://cdnjs.com/libraries/es5-shim

is loaded or not?

For AngularJS you can check in javascript:

if(!window.angular){
//not loaded
}

What's the proper way of doing that for shim?

Thank you.


Source: (StackOverflow)

How to provide ECMAScript 5 (ES 5)-shim?

ECMAScript Fifth Edition (released December 2009) introduces a bunch of new methods (see this table for details). However, there still are older browsers out there which do not implement those new methods.

Luckily, there exists a convenient script (written in JavaScript) - ES5-shim - which implements those methods manually in environments where they don't exist.

However, I am not sure how to provide ES5-shim... Should I just "give" it to all browsers, like so:

<script src="es5-shim.js"></scipt>

Or should I include a check in order to only "bother" those browsers which really need it, like so:

<script>
    if ( !Function.prototype.hasOwnProperty( 'bind' ) ) {
        (function () {
            var shim = document.createElement( 'script' );
            shim.src = 'es5-shim.js';
            var script = document.getElementsByTagName( 'script' )[0];
            script.parentNode.insertBefore( shim, script );
        }());
    }
</script>

(I'm using Function.prototype.bind to check if a browser implements all new ECMAScript 5 methods. According to the compatibility table which I linked above, bind is the "last bastion" when it comes to implementing ECMAScript 5 methods.)

Of course, for this shim to be effective, it has to be executed before all other scripts, which means that we want to include the above mentioned SCRIPT elements early in the page (in the HEAD, before all other SCRIPT elements).

So, would this second example be a good way to provide ECMAScript 5-shim to browsers? Is there a better way to do it?


Source: (StackOverflow)

Why doesn't MDN's `Object.create` polyfill set `prototype.constructor`?

Considering MDN's Object.create polyfill:

if (typeof Object.create != 'function') {
  (function () {
    var F = function () {};
    Object.create = function (o) {
      if (arguments.length > 1) { throw Error('Second argument not supported');}
      if (o === null) { throw Error('Cannot set a null [[Prototype]]');}
      if (typeof o != 'object') { throw TypeError('Argument must be an object');}
      F.prototype = o;
      return new F();
    };
  })();
}

Focusing particularly on these two lines:

F.prototype = o;
return new F();

I was wondering, why isn't it appropriate to set F.prototype.constructor = F;?

F.prototype = o;
F.prototype.constructor = F;  // why not?
return new F();

Source: (StackOverflow)

es5-shim and underscore.js?

I have both es5-shim.js and underscore.js in my JavaScript project.

es5-shim.js just add some javascript native functions like reduce and some on arrays for Internet Explorer and some old browsers. underscore.js add the same thing (but with a different syntax) and many more thing (utility functions on objects and arrays).

But, if the functions added by es5-shim exists, underscore.js use them.

So, on a "recent" browser like Firefox or Chrome, underscore.js use the native functions of the browser. I think it's better than a pure javascript function. But on Internet Explorer, underscore.js use the es5-shim functions. If I remove es5-shim.js, underscore.js use its own functions.

Any advice on that ? Should i remove es5-shim from my project and only use underscore.js ? Or should i let underscore.js use es5-shim's functions ?


Source: (StackOverflow)

Injecting a javascript polyfill onto a page with Selenium & PhantomJS

There has been a lot of discussion here and elsewhere about PhantomJS's lack of a Function.prototype.bind method, and a lot of helpful philanthropists have written shims/polyfills or pointed others to those resources. I'm implementing PhantomJS via Selenium Webdriver with Python bindings. I've tried a few ways to make use of this polyfill, to no avail. Currently I'm using the following code in my webdriver-inheriting tester class:

    bindShim = """var script = document.createElement('script');
    script.src = '/home/dunkin/scripts/es5-shim.js';***
    script.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(script);
    """
    self.execute_script(bindShim)

I execute this code every time I visit a new page. In fact, this method worked for ensuring that jQuery variables were understood by PhantomJS. However, I'm still seeing the following in my PhantomJS driver log:

[ERROR - 2015-02-10T17:43:44.068Z] Session [fd37e5c0-b14b-11e4-b9e3-5bbebfaf3f9d] - page.onError - msg: TypeError: 'undefined' is not a function (evaluating 'arguments.callee.bind(this,e)')
[ERROR - 2015-02-10T17:43:44.069Z] Session [fd37e5c0-b14b-11e4-b9e3-5bbebfaf3f9d] - page.onError - stack:
  (anonymous function) (https://jsta.sh/media/all.js?1459:16)
  t (https://jsta.sh/media/all.js?1459:16)
  (anonymous function) (https://jsta.sh/media/all.js?1459:17)
  (anonymous function) (https://jsta.sh/media/all.js?1459:8)
  (anonymous function) (https://jsta.sh/media/all.js?1459:8)
  (anonymous function) (https://jsta.sh/media/all.js?1459:8)
  I (https://jsta.sh/media/all.js?1459:2)

etc.

My hope is that in spite of being closely related to other questions about this .bind() issue, my question is useful to those who generally want to add functionality to their out-of-the box Selenium PhantomJS implementation. I would love it if I could amend the JavaScript library implemented by my Ghostdriver-PhantomJS-Selenium stack, rather than directly add the es5 shim to every page I visit, but I'm not sure how I can do that or if. Beginning to feel that such things would be simpler had I just built this tester on bare PhantomJS instead of filtering it through another framework.

My specs: I'm using Selenium version 1.43 with PhantomJS 1.98 via Python 2.7 on Ubuntu 14.04 LTS (GNU/Linux 3.17.1-elastic x86_64).

*** the es5-shim produces the following promising result when i use it in the phantomjs console:

phantomjs> console.log(Object.keys)
function keys() {
    [native code]
}
undefined
phantomjs> var shim = require("/home/dunkin/scripts/es5-shim.js")
undefined
phantomjs> console.log(Object.keys)
function keys(object) {
        if (isArguments(object)) {
            return originalKeys(ArrayPrototype.slice.call(object));
        } else {
            return originalKeys(object);
        }
    }
undefined
phantomjs> 

Source: (StackOverflow)

Return all the values of an array in json

I have a json with all posts my blog and I wanna to return all the values of "tags" array. So, see the json example below:

"posts":[
  {
     "id":"89319077059",
     "title":"Post Title 01",
     "tags":[
        "Politcs",
        "Science",
     ]
  },
  {
     "id":"89318918989",
     "title":"Post Title 02",
     "tags":[
        "Football",
        "Soccer",
     ]
  },
]

So, I need to get the only tags values in loop, for example:

for (var i = 0; i < posts.length; i++) {
    console.info("Here [i = 0] should be show the Politcs and Science and after [i = 1] show Football and Soccer");
}

I tried to create a other loop to search tags and using tags[1], tags[2], etc but don't works.

var tags = [];

for (var tag in posts[i].tags) {
     tags.push(tag);
}

Any idea?


Source: (StackOverflow)

Object.defineProperty polyfill

I am currently writing a JavaScript API which is based on new features in ES5. It uses Object.defineProperty quite extensively. I have wrapped this into two new functions, called Object.createGetSetProperty and Object.createValueProperty

I am however experiencing problems running this in older browsers (such as the dreaded, IE8)

Consider the following code:

Object.createGetSetProperty = function (object, property, get, set, enumerable, configurable) {
    if (!Object.defineProperty) throw new Error("Object.defineProperty is not supported on this platform");
    Object.defineProperty(object, property, {
        get: get,
        set: set,
        enumerable: enumerable || true,
        configurable: configurable || false
    });
};

Object.createValueProperty = function (object, property, value, enumerable, configurable, writable) {
    if (!Object.defineProperty) {
        object[property] = value;
    } else {
        Object.defineProperty(object, property, {
            value: value,
            enumerable: enumerable || true,
            configurable: configurable || false,
            writable: writable || false
        });
    }
};

As you can see, there is a graceful fallback under Object.createValueProperty, but I've no idea how to fallback gracefully with Object.createGetSetProperty.

Does anyone know of any solutions, shims, polyfills for this?


Source: (StackOverflow)

React IE8 works locally, not in production

We started introducing React to our large Django project to handle frontend complexity. So far, so good, but we ran into a problem.

React does not work in production on IE8. Locally it works fine on IE8. I've included es5-shim and es5-sham and I do see them in dev tools in production (included in the header, before React and code that's using React). But still, I get this error, like there's no shim:

SCRIPT438: Object doesn't support property or method 'isArray' 

I also got:

SCRIPT438: Object doesn't support property or method 'bind'

after which I included script mentioned in this post:

How to handle lack of JavaScript Object.bind() method in IE 8

However, after that I get:

SCRIPT5023: Function does not have a valid prototype object 

And I'm still getting the old errors. Again, locally it's working fine in IE8 so I'm guessing it's not the code itself that is the problem. Our app uses AWS CloudFront (but I do see the static .js files included in the html).

Any ideas what might be happening here?


Source: (StackOverflow)