Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Strange binding behavior with arrays in IE9 and 10 #253

Closed
RobertTheGrey opened this issue Nov 26, 2015 · 3 comments
Closed

Strange binding behavior with arrays in IE9 and 10 #253

RobertTheGrey opened this issue Nov 26, 2015 · 3 comments

Comments

@RobertTheGrey
Copy link

Not sure exactly where this issue belongs, but it's in reference to #251 where @martingust mentioned that @jdanyow had already fixed the issues related to Map()

I have created a new example here:
http://plnkr.co/edit/jLIrtn5E5ojDeq2MYIbG?p=preview

This example will run in Chrome and IE11 on the website above, but does not work on IE9 (emulated) unfortunately because plunker itself doesn't work with it and all kinds of unrelated errors appear - please ignore those.

If you use the simple code in the plunker to get something running locally in Chrome and change the index.html to allow older browser polyfills like this:

System.import('core-js').then(function () {
            return System.import('polymer/mutationobservers');
        }).then(function () {
            System.import('aurelia-bootstrapper');
        });

then you should be able to replicate the issue locally in IE9.

The behavior is supposed to allow you to move items from one <ul> to another by modifying the arrays in app.js. What happens in IE9&10 is that the arrays are getting modified behind the scenes, but the binding is not updating and seems to leave the original item behind in the first <ul> and duplicating it inside the last <ul> no matter if you tried to add it to the middle <ul> - but in actual fact, if you inspect the changed arrays, they have all the correct items in them - the binding just isn't reflecting that.

Hope all this makes sense - ask away if not.

@RobertTheGrey
Copy link
Author

I thought perhaps it was just not firing the fact that observables were changing, so I stumbled across a post by @jdanyow - http://www.danyow.net/aurelia-binding-behaviors/ and implemented a my-signal Binding Signaler to check and happy to say that they are firing correctly in all browsers. It's just that the repeat-for on the elements don't seem to register the changes in the arrays on IE9 and 10, but the observables are definitely firing as expected.

@RobertTheGrey
Copy link
Author

I manged to narrow down the potential cause of the issue. It seems that collections are being handled/observed differently in Chrome and IE9 - probably down to polyfills. So when dealing with a number of bound observable collections on the view, it looks like repeat.js was struggling to maintain the correct collection references. I managed to fix the bug locally and was looking at creating a pull request.

That is - until I saw that @jdanyow had recently made this commit which when I pulled it down and built locally just so happens to fix the IE9 & IE10 issue as well because of the way binding observation was changed.

So this issue goes away with this latest commit and the only thing left to ask is - does anyone know when the next point release is likely so that I can more easily propagate this change around the dev team?

@EisenbergEffect
Copy link
Contributor

Next patch release will be either tomorrow or Wednesday.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants