Search code examples
javascriptember.jsreverse-engineering

How to retrieve data from a model type?


I am a complete noob with Ember and I must retrieve data from an external website written in Ember.

I installed the Ember inspector plugin and I see the following:

enter image description here

What javascript command can I input in the Console debugging window to retrieve the data (Id and Number) in the list?

I cannot rely on Ember inspector for the data retrieval, the tool is only used to inspect the structure.


Update 1

Thanks to @kumkanillam, I made it here:

enter image description here

It seems that I can know the name and type of each attribute of an item in my list, but I am not able to get its value.

The happy array is the result of this call from his example : myStore.peekAll('common/following-info').toArray()


Solution

  • Have a look at this
    https://guides.emberjs.com/v2.14.0/ember-inspector/container/ https://guides.emberjs.com/v2.14.0/ember-inspector/object-inspector/#toc_exposing-objects-to-the-console

    It's explained very well images.

    You can expose objects to the console by clicking on the $E button within the Inspector. This will set the global $E variable to the chosen object.

    You can also expose properties to the console. When you hover over an object's properties, a $E button will appear next to every property. Click on it to expose the property's value to the console.


    Update 1

    You can run the below code in console.

     function getApplication() {
      let namespaces = Ember.Namespace.NAMESPACES;
      let application;
    
      namespaces.forEach(namespace => {        
        if (namespace instanceof window.Ember.Application) {
          application = namespace;
          return false;
        }
      });
      return application;
    }
    

    you can use the above function to get application instance, from there you can lookup access service:store, from there you can use peekAll required model. to view all the required data alone, I used the JSON methods like stringify and then parse.

    I actually used the LinkedIn site and used their model common/following-info for demoing. you can choose whichever model you want to view,

    var myApp = getApplication();
    var myStore = myApp.__container__.lookup('service:store')
    myStore.peekAll('common/following-info')
    myStore.peekAll('common/following-info').toArray()
    JSON.stringify(myStore.peekAll('common/following-info').toArray())
    JSON.parse(JSON.stringify(myStore.peekAll('common/following-info').toArray()))
    

    Update 2

    myStore.peekAll('common/following-info') Here it returns DS.RecordArray and it extends Ember.ArrayProxy, that means you can use methods available in ArrayProxy. forEach to iterate or to get specific index record use objectAt(index)

    In your case, You need to know the property name of the model to get the values for specific property like

    let allRecords = myStore.peekAll('common/following-info');
    allRecords.forEach(function(item){
      console.log(item);
      console.log(' Using get method to value ', item.get('propName'));
    });
    

    to get specific index value,

    let allRecords = myStore.peekAll('common/following-info');
    let firstRecord = allRecords.objectAt(0);
    console.log(' First record propName value is',firstRecord.get('propName'));
    

    In your case, you want to print the entire object without giving each property names, then there is no inbuilt way, We need to do some hacking using JSON.stringify and parse to get the perfect object you are looking for. and then you can use Object.values to get all the values.

    let arrayOfObjectWithOnlyKeysAndValuesOfModel = JSON.parse(JSON.stringify(myStore.peekAll('common/following-info').toArray()));
    arrayOfObjectWithOnlyKeysAndValuesOfModel.forEach(function(item){ 
     console.log('item',item);
     console.log(' item values alone ', Object.values(item));
    });