We Keep Coding

Problems when trying to get datasnapshot into the class i want

I'm trying to retrieve the data sent from my android app that is formed like this.
I'm trying to do it on JavaScript. I originally did this on Java and it was something like this
for (DataSnapshot postSnapshot : snapshot.getChildren()) {
Chat chat = postSnapshot.getValue(Chat.class);
I want to do the same thing on JavaScript but failed when I'm trying to. What I have now is this
class Chat{
constructor(detail,file_name,is_phone,type,user_id){
this.detail = detail;
this.file_name = file_name;
this.is_phone = is_phone;
this.type = type;
this.user_id = user_id;
}
detail(){ return this.detail;}
file_name(){ return this.file_name;}
is_phone(){ return this.is_phone;}
type(){ return this.type;}
user_id(){ return this.user_id;}
}
//Sync obj changes
dbRefObj.on('child_added',snap => {
myChat = new Chat (snap.val());
console.log(myChat);
});
But what I got is everything being set to detail...

The issue here seems to be that you want to spread the values, instead you're just assigning to the first parameter:
In the current implementation snap.val() is assigned to the detail param
class Chat{
constructor(detail, file_name, is_phone, type, user_id){
// ...
}
}
The following implementation will take the corresponding values from inside the snap.val()
class Chat{
constructor({ detail, file_name, is_phone, type, user_id}) {
// The difference is the use of the deconstructive syntax
}
}

Watching Firebase query in angularjs

I'm building an application in Angular with Firebase and one aspect of it is one-to-one chat. I'm querying Firebase to see if a chat room exists already between the user currently accessing the application and the user they are attempting to chat with. If it exists, I am trying to apply that room to the scope as the selected room. I'm using "Messages" service to run the query.
this.roomQuery = function(user1ID, user2ID) {
roomsRef.orderByChild("user1").equalTo(user1ID).on("child_added", function(snapshot) {
if (snapshot.val().user2 == user2ID) {
self.selectedRoom = snapshot.key();
console.log(self.selectedRoom);
} else {
self.selectedRoom = null;
}
})
}
and in my controller I am using:
$scope.$watch(
function(){ return Messages.selectedRoom },
function(newValue, oldValue) {
$scope.selectedRoom = newValue;
}
)
This $scope.$watch method has worked for me with everything else and it seems to sometimes work in this case. The console log always prints out the correct value for Messages.selectedRoom, but the $scope.selectedRoom sometimes does not update. Any idea what is happening here? I'm very confused. If it's logging to the console properly, shouldn't it be updated in the scope?

Angular's $digest is unaware of when a your Firebase query completes. You might find it easier to use AngularFire in this case.
this.roomQuery = function(user1ID, user2ID) {
var query = roomsRef.orderByChild("user1").equalTo(user1ID);
return $firebaseObject(query).$loaded();
};
this.roomQuery("1", "2")
.then(function(data) {
// do your check here
});
The $firebaseObject() takes in a ref or a query and knows when to call digest on your behalf.
You might want to check out using resolve in the router to inject the roomQuery into the router, since it returns a promise with .$loaded().

David got me to the solution I needed. For anyone with a similar issue, here is how I implemented it:
this.roomQuery = function(user1, user2) {
var query = roomsRef.orderByChild("user1").equalTo(user1ID)
return $firebaseArray(query).$loaded();
}
I used $firebaseArray instead of Object and in my controller:
$scope.getRoom = function() {
Messages.roomQuery($scope.user1.id, $scope.user2.$id).then(function(data)
{
$scope.data = data;
for(var i=0, len = data.length; i < len; i++){
if (data[i].user2 == $scope.user2.$id) {
$scope.selectedRoom = data[i].$id;
}
}
}
)
}
Apologies for the variable names being a little confusing. I altered them for the sake of this post.

EmberJS is not loading up the model correctly

At a loss on this one.
I'm using Ember and Ember data. I've got this extra implementation of ic-ajax to make GET, POST and PUT calls. Anyway, i'm trying to make a GET call then turn those results into model instances.
return this.GET('/editor')
.then((data) => {
return data.drafts.map((draftData) => {
let draft = this.store.find('draft',draftData.id);
console.log(draft.get('type'));
return draft;
});
});
My API returns proper data as data.drafts. This map is supposed to return an array of promises that resolve to draft models. It does not. It resolves to a draft model that has id, date, and title. But that's it. I have 25 others attributions.
In another part of the application i'm getting drafts using findAll on the model. And those models look fine. But when I try store.findRecord('draft',id) i get these fake objects.
-- edit
This is what my ReOpenClass method looks like for getting an array of objects from the server and turning them into ember objects
search(critera) {
let query = { search: critera };
let adapter = this.store.adapterFor('application');
let url = adapter.buildURL('article','search');
return adapter.ajax(url,'GET', { data: query }).then(response => {
let articleRecords = response.articles.map((article) => {
let record;
try {
record = this.store.createRecord('article', article);
} catch(e) {
record = this.store.peekRecord('article', article.id);
}
return record;
});
return articleRecords;
});
},
So far I can't find a better way to pull this off.

Casper JS waitForResource with a restful API

We are having a little problem with a functional test with casper.js.
We request the same resource twice, first with the GET and then with POST method.
Now when waiting for the second resource (POST) it matches the first resource and directly goes to the "then" function.
We would like to be able to check for the HTTP method in the "test" function, that way we can identify the resource properly. For now we use the status code (res.status), but that doesn't solve our problem fully, we really need the http method.
// create new email
this.click(xPath('//div[#id="tab-content"]//a[#class="button create"]'));
// GET
this.waitForResource('/some/resource',
function then() {
this.test.assertExists(xPath('//form[#id="email_edit_form"]'), 'Email edit form is there');
this.fill('form#email_edit_form', {
'email_entity[email]': 'test.bruce#im.com',
'email_entity[isMain]': 1
}, true);
// POST
this.waitForResource(
function test(res) {
return res.url.search('/some/resource') !== -1 && res.status === 201;
},
function then() {
this.test.assert(true, 'Email creation worked.');
},
function timeout() {
this.test.fail('Email creation did not work.');
}
);
},
function timeout() {
this.test.fail('Email adress creation form has not been loaded');
});
Or maybe there is a better way to test this scenario? Although since this is a functional test we need to keep all those steps in one test.

You can try to alter the form action url to add some query string, therefore generating a new resource appended to the stack. Could be done this way:
casper.thenEvaluate(function() {
var form = __utils__.findOne('#email_edit_form');
form.setAttribute('action', form.getAttribute('action') + '?plop');
});
That's a hack though, and functional testing should never be achieved that way. Let's hope more information will be added to the response objects in the future.

The res parameter that is passed to the test function has an ID. I created a helper that tests against this ID and blacklists it, so the same resource won't get accepted a second time.
var blackListedResourceIds = [],
testUniqueResource = function (resourceUrl, statusCode) {
return function (res) {
// check if resource was already loaded
var resourceFound = res.url.search(resourceUrl) !== -1;
// check statuscode
if (statusCode !== undefined) {
resourceFound = resourceFound && res.status === statusCode;
}
// check blacklisting
if (!resourceFound || blackListedResourceIds[res.id] !== undefined) {
return false;
} else {
blackListedResourceIds[res.id] = true;
return true;
}
};
};

Designing code work flow

Im making some code to interact with an API,
In order to use the API you need to get a session-key that you use for the rest of the requests, the session-key will become invalid after a while, so the code also needs to be prepared to reauth.
The code itself is not relevant nor the API since its a question about how to design the flow of the code, I'm looking for the best way to do it.
I don't have the code (javascript/node.js) here but here is basicly how it looks in pseudocode:
function getResult {
data = foobar
return getData(data, callback)
}
function getData(data, callback) {
*building query (including the session-key) and getting data via http*
if error == noauth
auth()
// What should happen here, I need to rerun the query
else
callback(result)
}
function auth {
data = foobar
getData(data, callback(?))
// it returns a session-key to use
//What should happen here?
}

I'd do something like:
function GetAuth(auth_params)
{
// get session key
return session key;
}
function MyAPIWorker(auth_params)
{
this._auth_params = auth_params;
this._current_auth = null;
}
MyAPIWorker.prototype.do(action)
{
if (this._current_auth == null)
{
this._current_auth = GetAuth();
}
var result = action(this._current_auth);
if (result == no_auth_error)
{
this._current_auth = GetAuth();
result = action(this._current_auth);
}
return result;
}
then to use it you do:
worker = new MyAPIWorker(/* auth params here */);
worker.do(function (sessionKey) { /* do something with session key */});
/** blah blah **/
worker.do(function (sessionKey) { /* do other something with session key */});
The worker will handle all the heavy lifting for you...