Error: Invalid Argument in IE11

[IlianIliev]

When using interpolation like:

<h1 translate>Hello {{ name }}</h1>

In IE11 I get the following error:

Error: Invalid Argument
 at interpolateFnWatchAction (http://test.com:8080/bower_components/angular/angular.js:6833:15)
   at Scope.prototype.$digest (http://test.com:8080/bower_components/angular/angular.js:12332:23)
   at Scope.prototype.$apply (http://test.com:8080/bower_components/angular/angular.js:12597:13)
   at Anonymous function (http://test.com:8080/bower_components/angular/angular.js:14104:25)
   at completeOutstandingRequest (http://test.com:8080/bower_components/angular/angular.js:4297:7)
   at Anonymous function (http://test.com:8080/bower_components/angular/angular.js:4598:7) undefined

The error is shown only If there are variables in the translated text.
Any ideas what is causing it?

[slash-84]

Same problem trying to build inside WinJS app

[nikolay-tzonev]

I have the same problem in IE 8, 9, 10 and 11. Is there any development on this?

I've done some research and it seems the problem is with the nodeValue property of the TextNode object in IE. In the reference here it says "You cannot use expressions to change the nodeValue of a TextNode object.", whatever that means.

Meanwhile a possible workaround is to use the filter instead of the directive.

<h1>{{ 'Hello ' + name | translate }}</h1>

[jeffrom]

This is tested in ie9/win7 and ie10/win8

[jeffrom]

this is now also tested in ie11

<3

[nikolay-tzonev]

Great, it's working now. Thanks!

[jeffrom]

good to hear. @rubenv any interest in merging this?

[rubenv]

@jeffrom Not in its current form: it breaks CI and testing. Use $window to access navigator.

I'm also not sure that I want to introduce browser-specific behavior. User-agent sniffing is a recipe for disaster. Surely there must be a proper way to do this for everyone?

That being said, if we can't find anything better, I might accept it anyway, as there's a rewrite of the directive coming up (to fix some larger issues). Consider the current 0.4.x series in bugfix mode.

[jeffrom]

Yea I hate ua sniffing as well but in this case I'm not really sure what
feature to detect. I'll make the $window change.

On Friday, July 18, 2014, Ruben Vermeersch notifications@github.com wrote:

@jeffrom https://github.com/jeffrom Not in its current form: it breaks
CI and testing. Use $window to access navigator.

I'm also not sure that I want to introduce browser-specific behavior.
User-agent sniffing is a recipe for disaster. Surely there must be a proper
way to do this for everyone?

That being said, if we can't find anything better, I might accept it
anyway, as there's a rewrite of the directive coming up (to fix some larger
issues). Consider the current 0.4.x series in bugfix mode.

—
Reply to this email directly or view it on GitHub
#59 (comment)
.

[jeffrom]

All set. Also there is another commit now that does this without browser sniffing. Basically it does what jQuery.fn.html does, which is try/catch. I have a feeling it wont work, since if it did, .html would have worked already in the first place, but i'll test it out when i get home.

[rubenv]

Anyone experiencing issues with IE, could you please test the xss-rewrite branch?

It should fix your problems. Atleast it does for me on IE 11 (and Chrome, Safari and Firefox).

This will eventually become version 1.0, but I'd like some testing first.

[rubenv]

Version 1.0.0 has been released, which includes this fix. I'll put release notes (with migration instructions) on the website soon.

[princed]

Completely rewritten directive has the same issue :(
Why not just use element.empty().append(msgstr) instead of element.html(msgstr)?
It's even faster in all browsers (except Firefox) — http://jsperf.com/jquery-html-vs-empty-append-test

[rubenv]

I've based this on ngView (from the Angular.JS team itself): https://github.com/angular/angular.js/blob/37ba3b94936ed7381ec2fbe56b3382e7c607938e/src/ngRoute/directive/ngView.js#L267

How come it works there and not here?

[rubenv]

I've been able to reproduce this on IE11 (only on h1, not on span). Strange thing is that despite throwing errors, it did work.

Anyway, solution by @princed works, so I'll just go for that one.

Still begs the question: why does this work with ngView and not here?

[rubenv]

Fix released as 1.0.1.

[princed]

In my case it does reproduce on span.

Still begs the question: why does this work with ngView and not here?

Because of IE?

Thanks for the quick fix!

[DOrlov77]

My solution is to mark the translate directive as terminal.
See angular-translate/angular-translate#925 (comment)

[gabegorelick]

@DOrlov77 the translate directive is terminal, although there's an open PR to change that.

[R-Kurbatovvakoms]

For me it happens again in IE11.