dimanche 30 décembre 2018

Run Ember.run.later from action triggered

I am having problem with action handling in Ember controller. I want to run some function continiously after edit button is clicked in hbs. I have tried it like this in action.

openEditWindow() {
  this.set('someChangingValue', true);
},

Here is the function that reacts to action someChangingValue change.

someChangingValue: false,    

someTestFunction: observer('someChangingValue', function(){
 var test = this.get('someChangingValue');

if(test === true){
  Ember.run.later((function() {
    this.functionThatIsRunningEachTwoSeconds();
  }), 2000);   
} else {
  console.log('this should not do anything');
}
}),

But this runs functionThatIsRunningEachTwoSeconds only once. Also tried the same functionality with changing someChangingValue to false if true and otherwise, that put me in infinite loop of observing property.

Thanks!




Empty output from JSON encoding

In Firefox the http response is shown as '{}', but the alert in the client side code prints '[object object]'. I would have expected something resembling '{logoutGoogle : "true" , logoutUrl : "/_ah/logout?continue=http%3A//localhost%3A8080/"}' in the Firefox tool that show the XHR response.

I verified that the failure is the same with 'tada' as logoutUrl instead of '/_ah/logout?continue=http%3A//localhost%3A8080/'.

Code compiles and runs and I have included comments in the client and server code below to show what the results of me trying to inspect the running code with logs and with alerts are.

Client side code inside an emberjs component:

export default Component.extend({
    userUiLanguageService : service(),
    ajax : service(),
    actions: {
        logoutOnlyWebApp(){
            alert(this.get('ajax').request('/logout',{
                method : 'GET',
                data: {
                    logoutGoogle : false
                }
            }));
        },
        logoutAllOfGoogle(){
            //alert prints [object object]
            //not undefined as I would have expected
            //from the Firefox http response tool
            // that shows '{}' as the server response
            alert(this.get('ajax').request('/logout',{
                method : 'GET',
                data : {
                    logoutGoogle : true
                }
            }));
        }
    }
});

Server side go code:

type LogoutOutput struct {
    logoutSuccessful string
    logoutUrl string
}

func logout(w http.ResponseWriter, r *http.Request){
    c := appengine.NewContext(r)
    u := user.Current(c)

    if u == nil {
        http.Redirect(w, r, "/", http.StatusSeeOther)
        return
    }

    logoutGoogle:=r.URL.Query().Get("logoutGoogle")
    //below prints 'true'
    log.Errorf(c,"%v",logoutGoogle)
    logoutGoogleBool:=false
    if logoutGoogle == "true" {
        logoutGoogleBool=true
    } else if logoutGoogle == "false" {
        logoutGoogleBool=false
    } else {
        log.Errorf(c,"Value is not true or false",logoutGoogle)
    }

    url := ""
    var err error
    if logoutGoogleBool { // LOGOUT ALL OF GOOGLE
        url, err = user.LogoutURL(c, "/")
        if err != nil {
            http.Error(w, err.Error(), http.StatusInternalServerError)
            return
        }
    }

    //below prints '/_ah/logout?continue=http%3A//localhost%3A8080/'
    log.Errorf(c,"%v",url)
    logout_output:=LogoutOutput{logoutSuccessful:"true",logoutUrl:url}
    logout_output_json,err := json.Marshal(logout_output)
    //below prints '[123 125]'
    log.Errorf(c,"%v",logout_output_json)
    if err != nil {
        http.Error(w, err.Error(), http.StatusInternalServerError)
        return
    }
    //w.Header().Set("Location", url)
    w.Header().Set("Content-Type", "application/json")
    w.WriteHeader(http.StatusOK)
    w.Write(logout_output_json)
    //fmt.Fprintf(w,logout_output_json)
}




samedi 29 décembre 2018

Why do I get "Ajax authorization fails" in my tests

I am following the ember tutorials, and specifically I'm on services.

I am 99.9% certain that I have the exact code in place -- I am copying by hand, because I believe that helps me absorb it more completely, but if anything fails I start using a diff checker to see if I made a typo. To my knowledge, no typos.

The App I have written performs identically to the screen shots in the tutorials, and the only error I get is a lint error for having a test that doesn't have an assert in it (yet).

Prior to this unit, all other tests have passed as well. But now I am getting failed tests that previously passed. They appear to all stem from the stubbed call to the map service failing. The first test that fails is integration/component/rental-listing-test.js:

hooks.beforeEach(function() {
  this.rental = {
    image: 'fake.png',
    title: 'test-title',
    owner: 'test-owner',
    type: 'test-type',
    city: 'test-city',
    bedrooms: 3
  };
});
test('should display rental details', async function(assert) {
  await render(hbs``);
  assert.equal(this.element.querySelector('.listing h3').textContent.trim(), 'test-title', 'Title: test-title');
  assert.equal(this.element.querySelector('.listing .owner').textContent.trim(), 'Owner: test-owner', 'Owner: test-owner');
});

If I remove the new line from rental-listing.hbs ( ), thus preventing the map from being used, these tests once again pass (though the new tests for the component using the service have issues).

So either I am doing something wrong that I can't find, or else the fine folk at emberjs.com have not provided complete information in this tutorial. Do I need to somehow stub the map service? that appears in the .hbs file for the above test to pass? If so, why do you think they failed to mention this?




Store a global variable from ajax call

I have a list of years in an array format [2018, 2019, 2020] that is returned from my back end. Right now, i’m using a setup controller to make the ajax call and set it as a value to be used by my ember-power-select. However, I just need this to be done once, like on application load and have it as a global variable, instead of everytime the controller loads since this array will rarely change.

How should I go about this ?




vendredi 28 décembre 2018

Why is my feature flag displaying as true?

Today we realized that our feature flag controls 2 features but we only want it to control one. I created a second feature flag called displayNewPage. I wrapped the new page under development in an if so that it will be hidden from users.

The code works locally but when I deployed it to production it doesn't work. On production when the Get request to the current user is done it receives the displayNewPage as false.

When I checked the ember data it doesn't seem to know about the new boolean even though I have added it to the frontend model. The page displays the link to the new page but I don't really understand why this is.

Does anyone have any suggestions?




jeudi 27 décembre 2018

Can't import styles from add-on after migrating to module unification structure in an ember app

I used the ember-module-migrator to migrate an Ember app to the new file structure and followed the instructions here: https://github.com/emberjs/ember.js/issues/16373.. Now when running the tests or the app i get a lot of errors of course :P but the following error is making me crazier than normal:

Error: Can't find stylesheet to import.
@import 'kci-style/addon';

but the addon is present in the node_modules folder.
I suspect that this might be related to that the addon is still using the old file structure...
I made sure that I have setup the fallback resolver correctly (as mentioned here: https://github.com/rwjblue/ember-module-migrator) but it still won't import the styles from the addon...

I even tried migrating the addon in the node_modules to the module unification structure but that also didn't help... any suggestions would be appreciated.

Thanks in advance...




mardi 25 décembre 2018

How can I pass properties of parent component to a child component without explicitly naming them?

Let's assume there is a parent component A, which has a child component B, which in turn has a sub child C.

// Template A 


// Template B


Template C will list all the params sent to it. There is no fixed length or name for the params.

My objective is (from B) is to receive params from A and send all of them into C. How could I obtain the list of params and send them to child with binding intact with A ?