Angular.js: Object interpolation shows [object Object] in IE11 when using babel-polyfill

[anzorb]

Do you want to request a feature or report a bug?
bug

What is the current behavior?
When babel-polyfill is included, basic object interpolation results in [object Object] in IE11

var app = angular.module('testApp', []);

app.run(['$rootScope',  function($rootScope) {
    $rootScope.object = { a: 'a', b: 'b'};
}]);

http://jsfiddle.net/nw6tekff/4/

What is the expected behavior?
Should display stringified object, instead of [object Object]

Which versions of AngularJS, and which browser / OS are affected by this issue? Did this work in previous versions of AngularJS? Please also test with the latest stable and snapshot (https://code.angularjs.org/snapshot/) versions.

• AngularJS 1.6.0+
• IE 11
• Babel-polyfill 6.22.0
• Worked up to 1.6.0, still broken in 1.6.1

Other information (e.g. stacktraces, related issues, suggestions how to fix)

• Not related to changes in preAssignBindingsEnabled (tested)

[Narretz]

This is because of the changes to the string interpolation: https://github.com/angular/angular.js/commit/a5fd2e4c0376676fa317e09a8d8be4966b82cbfe
We look for a custom toString function on the object to be interpolated, and since babel polyfill changes the toString fn of the Object prototype, this condition is triggered.
The easiest solution is to include babel polyfill before Angular is loaded: http://plnkr.co/edit/NIzDjE84JGZj7I12AXXJ?p=preview
This makes sense as babel polyfill is basically changing the JS "engine".

[nmiddendorff]

I had the same issue with Angular Fusion Charts and Babel. Adding this polyfill fixed the issue.