AngularDart 1.0.0 has issues in IE 11 and Safari 7 and below

Issue

I had AngularDart 1.0.0 throw errors in Safari 7.0 and below and IE 11 when rendering my page component. It seems to die inside the ng-repeat loop when trying to access one of the widgets (the variable it is looping over). Another one of my components (the menu) works fine. I’m not really sure what about my component caused it. An excerpt of the error is NoSuchMethodError: Cannot call "get$widget" ('undefined' is not a function (evaluating 'o.get$widget()')).

I haven’t had much experience debugging an AngularDart app once it is compiled to JS but here’s the context:

closure215: {
    "^": "Closure:14;",
    call$1: [function(o) {
      return o.get$widget();
    }, "call$1", null, 2, 0, null, 86, "call"],
    $isFunction: true
  },

It seems to work perfectly on most other browsers. It also worked fine with AngularDart 0.14.0 before upgrading to 1.0.0

Here’s a call stack from IE 11 using source maps (I didn’t know IE had that feature):

Anonymous function [Line: 96, Col: 18], main_static_expressions.dart
DirtyCheckingRecord._getter$1 [Line: 398, Col: 3], dirty_checking_change_detector.dart
DirtyCheckingRecord.check$0 [Line: 464, Col: 25], dirty_checking_change_detector.dart
_FieldHandler.acceptValue$1 [Line: 631, Col: 5], watch_group.dart
FieldReadAST.setupWatch$1 [Line: 167, Col: 5], watch_group.dart
FieldReadAST.setupWatch$1 [Line: 158, Col: 5], watch_group.dart
FieldReadAST.setupWatch$1 [Line: 158, Col: 5], watch_group.dart
CollectionAST.setupWatch$1 [Line: 175, Col: 5], watch_group.dart
WatchGroup._addEvalWatch$7 [Line: 233, Col: 25], watch_group.dart
PureFunctionAST.setupWatch$1 [Line: 87, Col: 59], ast.dart
WatchGroup.watch$2 [Line: 140, Col: 3], watch_group.dart
Scope.watchAST$3$canChangeModel [Line: 271, Col: 5], scope.dart
Anonymous function [Line: 38, Col: 9], mustache.dart
NodeAttrs.listenObserverChanges$2 [Line: 79, Col: 5], directive.dart
AttrMustache.AttrMustache$4 [Line: 34, Col: 5], mustache.dart
AttrMustache.static.AttrMustache$ [Line: 28, Col: 3], mustache.dart
Anonymous function [Line: 259, Col: 7], element_binder.dart
ViewFactory._bindTagged$7 [Line: 77, Col: 17], view_factory.dart
ViewFactory._link$4 [Line: 119, Col: 13], view_factory.dart
ViewFactory.call$3 [Line: 58, Col: 5], view_factory.dart
ViewFactory.call$2 [Line: 62, Col: 3], view_factory.dart
Anonymous function [Line: 111, Col: 13], transcluding_component_factory.dart
Anonymous function [Line: 899, Col: 30], zone.dart
_ZoneDelegate.runUnary$3 [Line: 506, Col: 5], zone.dart
VmTurnZone__onRunUnary_closure.call$0 [Line: 122, Col: 43], zone.dart
VmTurnZone._onRunBase$4 [Line: 102, Col: 28], zone.dart
Anonymous function [Line: 121, Col: 39], zone.dart
Anonymous function [Line: 2, Col: 28], Function code (1189)
_CustomZone.runUnary$2 [Line: 801, Col: 5], zone.dart
_Future__propagateToListeners_handleValueCallback.call$0 [Line: 494, Col: 9], future_impl.dart
_Future.static._Future__propagateToListeners [Line: 578, Col: 15], future_impl.dart
_Future.static._Future__propagateMultipleListeners [Line: 431, Col: 7], future_impl.dart
_Future.static._Future__propagateToListeners [Line: 458, Col: 9], future_impl.dart
_Future._completeWithValue$1 [Line: 339, Col: 5], future_impl.dart
Anonymous function [Line: 401, Col: 7], future_impl.dart
Anonymous function [Line: 888, Col: 30], zone.dart
_ZoneDelegate.run$2 [Line: 499, Col: 5], zone.dart
Anonymous function [Line: 127, Col: 30], zone.dart
_FunctionChain.fn$0 [Line: 1181, Col: 42], scope.dart
RootScope._runAsyncFns$0 [Line: 923, Col: 9], scope.dart
Anonymous function [Line: 810, Col: 7], scope.dart
Anonymous function [Line: 315, Col: 7], scope.dart
Anonymous function [Line: 319, Col: 3], scope.dart
Anonymous function [Line: 768, Col: 7], scope.dart
Anonymous function [Line: 890, Col: 14], zone.dart
_ZoneDelegate.run$2 [Line: 499, Col: 5], zone.dart
VmTurnZone._finishTurn$2 [Line: 168, Col: 9], zone.dart
VmTurnZone._onRunBase$4 [Line: 111, Col: 32], zone.dart
Anonymous function [Line: 121, Col: 39], zone.dart
Anonymous function [Line: 2, Col: 28], Function code (1189)
_CustomZone.runUnary$2 [Line: 801, Col: 5], zone.dart
_CustomZone.runUnaryGuarded$2 [Line: 707, Col: 3], zone.dart
Anonymous function [Line: 735, Col: 20], zone.dart
invokeClosure_closure0.call$0 [Line: 1841, Col: 43], js_helper.dart
Anonymous function [Line: 443, Col: 5], isolate_helper.dart
_callInIsolate [Line: 35, Col: 1], isolate_helper.dart
Anonymous function [Line: 1841, Col: 5], js_helper.dart
Anonymous function [Line: 1861, Col: 37], js_helper.dart

Solution

I finally figured it out and details are here: https://github.com/angular/angular.dart/issues/1572

I guess dart2js outputted code where IE 11 and Safari 7 tried to evaluate the template on its own before it was included in the ng-include. Where the <template> was located, one of the variables from the ng-repeat that was used in it was out of scope but was in scope where the ng-include was.

Answered By – Scotty Waggoner

Answer Checked By – Dawn Plyler (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *