changes not being observed,

[longestdrive]

Hi
Thank you for this package - I'm hoping it's going to solve my problem but I'm unable to observe a change.

Initially I set up an observer within a class to another class - I want to look for an update to a property and then take action. Changes to the property were made but not change logged. Does this code recognise changes within a class syntax?

I then decided to create an external object that is updated from the class I was observing and observe that instead but again nothing noted when the values are updated.

I'm doing something wrong

my bare bones code:

import { Observable } from 'object-observer/dist/object-observer.js';
import {selectedAsset} from "./filemanager-ha

export let fileImageWidgetControls = class {

openFileManager = () => {

        const filemanager = new filemanagerHandler({
            images:true
        });
        filemanager.init();
        let filemanagerObserver = Observable.from(selectedAsset);
        filemanagerObserver.observe(changes => {
            changes.forEach(change => {
                console.log("filemanager change:", change);
            });
        });
}

export let filemanagerHandler = class {
   handleSelection = (element, type, callback) => {

        selectedAsset = {
            filename: element.attr('href'),
            id: element.data('id'),
            caption: element.data('caption'),
            type: type
        }
        console.log("selected:", selectedAsset);

    }
}
export let selectedAsset = {

}

so the first class interacts with the second class that after some user action updates selectedAsset but no changes notified

console logging suggests selectedAsset is being updated as expected

Any help appreciated

[Yuri Guller]

Hi, thanks for a thanks and... really sorry for the delay.
Regardless of either you solved that or moved on, i'll take a look on this and see what's going on - today.
Will update here ASAP.

[Yuri Guller]

Okay, I see what's going on.

Observation

The issue indeed with understanding of how the library works.
selectedAsset is a native JS object.
You then creating filemanagerObserver from it - i'd actually stick to the name filemanagerObservable, which is closer to the design and really descripts things:

• in itself it is not observer, but it is able to be observed - and thus you are indeed doing an .observe call on it
• we are deprated from the original selectedAsset, which is not observable but remained a simple pure object

Now, if you'd like to track a changes, you need to:

• make the changes on the filemanagerObservable and not on the original object (selectedAsset)
• you should NOT reassign the variable as a whole, like you do to the selectedAsset, since from that point you are loosing the reference to your object and getting a completely other one instead

Suggestion

Assuming, that I grasp correctly your intention here i suggest you to do the following:

• export the observable object returned from Observable.from API instead of selectedAsset
• perform the changes on the observable's properties and any-deeper but NOT on the reference self
  • NOT GOOD: observableSelectedAsset = { }
  • GOOD: observableSelectedAsset.filename = 'something'
  • GOOD: for a 'bulk' assign like the one that you show in your handleSelection method you can use Object.assign(observableSelectedAssets, { whatever })

Please, notify me if the said above makes sense and / or there is still something to clarify / help you with.

[Yuri Guller]

Closing due to non-activity, please review my answer before reopening and if not sufficient - welcome to reopen again!!!