0

I am having issues with Knockout (v3.2) in IE8. Binding expressions such as 

<div data-bind="text: $data.Property"></div>

-where Property is an observable- causes the actual text of knockout's observable function to display instead of the value Property is supposed to represent.

Looking at the specs (jasmine tests for knockout) I've found that they explicitly don't support text node bindings for IE < 9 (line 442) https://github.com/knockout/knockout/blob/master/spec/bindingAttributeBehaviors.js#L442

Adding parentheses seems to fix this for IE8 text: $data.Property() but, the concern is: will that have an adverse effect in other browsers? My initial assumption is no for a number of common sense reasons but I'm wondering if anyone knows of workarounds for this or if adding parentheses is it?

UPDATE 1: Thank you all for the comments at this point. After further investigation it seems the issue is that there are duplicate javascript files being loaded.

More specifically, while others are duplicated too the duplicate knockout library is causing the ViewModel's observables to be a different instance meaning they are not properly unwrapped for display.

This was proven by adding a condition around the knockout library like what was suggested here: Stop IE from loading dynamically included script twice. Adding the condition made the preferred binding approach (dependent on knockout unwrapping observables) work in IE8.

None of the questions/answers I found so far will suffice in my circumstance so I'll be asking a new question about how to keep multiple knockout libraries from loading twice.

UPDATE 2: The new question is posted for those that would like to follow along: How to stop Knockout 3.2 library loading twice

Community
  • 1
  • 1
metaomniliquant
  • 178
  • 10
  • Adding parentheses is it. I've never liked how knockout magically decides between whether to display the value of a binding or to invoke it then display the return value. Now I have a concrete reason for my distrust! I always place parenths so there's no confusion. There shouldn't be any significant difference between the two, and you won't be introducing any x-browser issues. – spender Apr 23 '15 at 13:57
  • I've tested the parens in Chrome (current ver), IE9, 10, and 11 and have been successful if that helps. – Mark C. Apr 23 '15 at 15:10
  • you should be able to skip the parens if you omit the `$data` prefix, just `text: Property` – dfperry Apr 23 '15 at 15:50

1 Answers1

0

I updated the question but, since technically this question is answered I'm adding it here so it can continue it's lifecycle on SO.

After further investigation it seems the issue is that there are duplicate javascript files being loaded.

I began by running the Live Examples from knockout in IE8. These worked with the preferred non-parentheses syntax. Obviously knockout is handling things properly there so I deep-dived into the library, from my problematic page, stepping through each line. I confirmed that the observables of the viewmodel were not being unwrapped.

The logic for unwrapping observables includes a check to see whether the instance to unwrap is actually an observable. The method is ko.isObservable. This check was saying that the viewmodel's observables were not actually observables. The ko.isObservable method checks the functions that each instance represent and if the references match, then the method returns true. This told me that the instances of the two functions were different. This also indicated that duplicate ko instances were likely to exist.

Looking at the Network tab of IE, the knockout library is being loaded twice. This would explain why the viewmodel's observables and the ko.observable instances are different. The viewmodels use the first instance of ko.observable. Then the entire ko instance is overwritten by the second load of the knockout library (when the library loads, it is executed).

This was proven by adding a condition around the knockout library like what was suggested here: Stop IE from loading dynamically included script twice. Adding the condition made the preferred binding syntax (dependent on knockout unwrapping observables) work in IE8.

That said, the answer is that simply adding parentheses is not a sufficient workaround in this case and that there is either an actual solution or a workaround for the duplicate file load -which is a separate issue.

Community
  • 1
  • 1
metaomniliquant
  • 178
  • 10