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

How to distinguish between structural changes to array made in parent element vs property changes to an item of array made in child element observer? #4385

Closed
santanubasu opened this issue Mar 7, 2017 · 7 comments

Comments

@santanubasu
Copy link

Apologies in advance if this is not a bug. I believe it is possible this is a bug, but more likely a functionality gap from 1.x to 2.0, and even more likely a knowledge gap on my part, but i have not been able to get a response on any of the other Polymer2 forums, slack channels, stackoverflow, etc.

The summary of the issue with code sample can be seen here:

https://stackoverflow.com/questions/42565640/how-to-distinguish-between-structural-changes-to-array-made-in-parent-element-vs

The code sample itself is here:

https://plnkr.co/edit/iTZqM4GwpASEqQgtRGEk

Steps to repro:

Run the code sample, open the dev console, view the output.

Expected result:

4 observed changes

Actual result:

6 observed changes

Browsers affected:

Chrome at least, probably others

Polymer versions:

2.0, the console output matches the expected result in 1.x

Please let me know if I can clarify the issue further. I really like the direction Polymer is taking and want to use 2.0, but until I can resolve the behaviour in this fairly simple scenario, I'm at a standstill

thanks

@sorvell
Copy link
Contributor

sorvell commented Mar 7, 2017

This is expected based on the current implementation of dom-repeat in 2.x. I recognize that the behavior is unexpected and we'll take a look at addressing it.

The 2.x version of dom-repeat has a simpler design than 1.x where this issue did not exist. In the 2.x version, we currently do not act on "splice" information and instead simply update rendered items. Thus, the unshift causes the existing first row to get the newly added item, the 2nd row gets the old first item, and a new 3rd row is added with the previous 2nd row (changes 4, 5, and 6).

@santanubasu
Copy link
Author

Great thank you for confirming the current expected behaviour. Pending it being addressed, is there any workaround available that can achieve the underlying goal, which is to act on an object mutation but not on the array mutation?

Ultimately i just want to be able to handle something basic like editing todo list items inside a list, and also rearranging the list, and I have no problem using some temporary code, or even a hack, to do it if I know the functionality will be addressed eventually

@santanubasu
Copy link
Author

Roughly speaking, is this issue something that will be addressed by the time 2.0 is released, or after that point? By "addressed" I mean either at the polymer level, or a workaround that can be used short term at the application level. I'm trying to figure out whether Polymer 2.0 will be usable for my projects in the next couple weeks, or if its more like a few months. Thanks, and my bug filing notwithstanding, I really do think the project is on top of things, and once a few issues like this one are addressed, it will mesh very nicely with how I think about app design.

@santanubasu
Copy link
Author

Ok I have a workaround of sorts that does the trick for now, Polymer crew can comment on whether this is kosher or not. Basically, I replace an observer such as "observeDescriptionChanged(todo.description)" with "observePropertyChanged(todo.*)". Then in the observer itself, I test if the change path is "todo". If it is, this is an indication that the observed change is the result of a mutation of the array containing the todo object, or the initial set of the todo object, or another legitimate change (referentially speaking) of the todo object, but is not a change or set of a property of an existing todo object. This gets me to where I can act on mutations of the todo object that should result in a persistence action, and ignore mutations of the todo list itself, at least from within the element that encapsulates a single todo entry. I assume this incurs some extra cost if there are a lot of properties that I don't actually need to observe, but I can live with that for now.

@kevinpschaaf
Copy link
Member

@santanubasu We have an implementation of a (long requested) restamp mode for <dom-repeat> in #4363, which puts dom-repeat in a mode that strictly ties template instances to items (by item identity, or optionally a path to a unique key in the item), and will never reuse instances with a different item. It would be great if you could try that out and provide feedback on whether that addressed your issue or not.

@stale
Copy link

stale bot commented Mar 13, 2020

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the wontfix label Mar 13, 2020
@stale
Copy link

stale bot commented Apr 16, 2022

This issue has been automatically closed after being marked stale. If you're still facing this problem with the above solution, please comment and we'll reopen!

@stale stale bot closed this as completed Apr 16, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants