Quantcast
Channel: Ember.JS - Latest topics
Viewing all 4748 articles
Browse latest View live

Get current model data in acceptance test

$
0
0

@JordanRDesigns wrote:

I am trying to access the model being returned after visiting a url in an acceptance test.

I am not outputting any of it to a template since I will be taking some of it and storing it to local storage using an addon. So I can't using find() to find an element on the page and check it's contents to determine if what I want is being returned.

I started a stack overflow here http://stackoverflow.com/questions/33701930/get-model-of-route-after-visiting-it-in-acceptance-test

But haven't received an answer that helps explain how to do this. I could really use some help as this is sort of blocking me from continuing (unless I drop trying to follow TDD)

So far I have tried a few things, and in the stack overflow I have tried this

test('Returns a user', function(assert) {
  // Generate a user
  var user = server.create('user',{first_name: 'Jordan'});
  // Visit the index page with the users short_url
  visit('/' + user.short_url);
  var route = this.application.__container__.lookup('route:index');

  // Assert that the model the user we created by checking the first name we passed in
  assert.equal(route.model.first_name,'Jordan','Model returns user with first name Jordan');
});

But I can't seem to get the model from that container lookup.

Can someone help me understand how I would do this?

Posts: 10

Participants: 3

Read full topic


Minimum system requirements to run Ember CLI

$
0
0

@joseph_dillon_522 wrote:

Ember CLI is unbearably slow on my machine. For example:

Build successful - 80898ms.

Slowest Trees                                 | Total               
----------------------------------------------+---------------------
ConcatWithMaps                                | 33760ms             
BroccoliMergeTrees                            | 16761ms             
ES6: App Tree                                 | 14163ms             
Addon#treeFor (ember-composability - addon)   | 4883ms              

Slowest Trees (cumulative)                    | Total (avg)         
----------------------------------------------+---------------------
ConcatWithMaps (4)                            | 33954ms (8488 ms)   
BroccoliMergeTrees (5)                        | 16786ms (3357 ms)   
ES6: App Tree (1)                             | 14163ms             
Addon#treeFor (ember-composability - a... (1) | 4883ms

Granted, I have a rather old MacBook:

My coworkers' machines have near instantaneous response when they make a change to our app. We figure my problem is a combination of:

  • low ram ( 8gb vs 16)
  • i5 processor (vs i7)
  • optical drive (vs flash memory)

It would be great if there was an accepted "minimum system requirements" listed on the Ember CLI website.

Has anyone else experienced such slow speeds? If so, did you manage to correct it without buying a new machine? I plan on getting a new MacBook soon, but until then...

Posts: 10

Participants: 5

Read full topic

Difference between initializers and instance-initializers

$
0
0

@efx wrote:

Applies to Ember in general but mostly pertains to an ember-cli application. I curious about the background to these ways to initialize parts of an Ember application.

What is the exact difference between initializers found in app/initializer versus app/instance-initializers? Are instance-initializers a subset of an initializer?

Posts: 3

Participants: 2

Read full topic

Embedded Component question

$
0
0

@gkaplan wrote:

I have a requirement where a form contains a list of compound input fields, each consisting of a text field with a checkbox add-on:

It's important to realize that each movement (flexion, extension, etc.) has a related opposite movement. For example, flexion is paired with extension, right lateral bending is paired with left lateral bending, and right rotation is paired with left rotation.

When ankylosis is NOT checked, all text fields are enabled. When ankylosis for a specific movement is checked, then its opposite movement must be disabled. For example, if the user clicked Ankylosis for flexion, then the entire extension input field and checkbox need to be disabled.

For this reason, each rom-field indicates its "opposite" control. Each rom-field is using an observer, so when a checkbox is checked, it gets notified, and I have access to all the details about the rom-field. However, when a checkbox is checked, I need somehow to notify the rom-group, so that it can look-up the opposite rom-field and disable it.

I cannot figure this puzzle out. Does anyone have any suggestions on how to send a message to the component's parent without tightly coupling them?

Thanks

Posts: 10

Participants: 2

Read full topic

Unconventional store.find with not existing model

$
0
0

@szsoppa wrote:

I'm trying to fetch two model data from server: event and its participants. Endpoints look like this:

  • /events/:id for event
  • /events/:id/participants for event participants

Participants are described with user model and that's where my problem begins. By convention findAll method is trying to assign first argument - which is model name - to data returned from server. I don't need another model for that (which would be participant) because I already have User. Second of all I can't use AJAX to accomplish that because I need to paginate those participants and that's what ember-infinity component does for me. Do you know how to call such a query without declaring another model?

Posts: 1

Participants: 1

Read full topic

Index loads but ember app content does not

$
0
0

@jeffreyg wrote:

Occasionally my index page of my site loads but my app content does not. Looking at my main.js file I found the router and wondering if there is something incorrect within it to cause ember.js to sometimes not load the page.

function() {
    App.NowplayingRoute = Ember.Route.extend({
        queryParams: {
            movie: {
                refreshModel: !0
            },
            showCriticsPicks: {
                refreshModel: !0
            }
        },
        model: function(a) {
            return console.log(a.movie), App.Movie.findAll(a)
        },
        didTransition: function() {
            googletag.pubads().refresh(), console.log("now playing transitioned")
        }
    })
}(),

Posts: 4

Participants: 3

Read full topic

findAll() strange behavior

$
0
0

@Yaroslav_Poliakov wrote:

Hi all! I have the following computed property in a controller:

ingredients: function() {
    var self = this;
    this.store.findAll('ingredient').then(function() {
        var ingredients = self.get('model').get('ingredientsWithQuantities').map(function(item) {
            return {
                name: self.store.peekRecord('ingredient', item.ingredientId).get('name'), 
                quantity: item.quantity
            };
        });

        self.set('ingredients', ingredients);
    });
}.property('model.ingredientsWithQuantities')

It works fine if ingredients data was loaded earlier or if shouldReloadAll() { return true; } was added to RESTAdapter. But in second case findAll() always make new request to back-end even if data exists in store.

I want to achieve next behavior:

  • when data doesn't exist in the store - then load data and call 'then' function after it
  • when data exists in the store - then take data from cache and just call 'then' function

What the best way to implement this?

P.S. I'm using EmberJS 1.13.

Posts: 1

Participants: 1

Read full topic

Best practice modelling polymorph relationship

$
0
0

@mkconn wrote:

I've searched here and also the net, but I have to admit, that I did not really understand how to do this...

I have some models which relate to each other:

My problem is how to setup the relations in agenda, event, and location... (same would go for location - talk - event, but this would be solved when the agenda stuff will become clear...).

To explain it a bit (if not clear from the little scetch):

An agenda can either belong to an event or a location. Location and event can have many of agendas.

Do I have to declare something like:

//agenda
export default DS.Model.extend({
    event: DS.belongsTo('event', {polymorphic: true}),
    location: DS.belongsTo('location', {polymorphic: true})
});

//event
export default DS.Model.extend({
    agendas: DS.hasMany('agenda')
});

//location
export default DS.Model.extend({
    agendas: DS.hasMany('agenda')
});

If its like this - how would the json have to look like (I'm using JSON API -http://jsonapi.org ) so ember-data will build the relations correct? I think there is no documentation on this (at least I didn't find any). Or is using polymorphs the wrong approach and instead inverses are the right solution? Sorry if that's a dumb question but I really don't get it...

Posts: 1

Participants: 1

Read full topic


Extending default blueprints

$
0
0

@varblob wrote:

Does anyone know if there is a good way to extend the default blueprints. All I can see is a way to override them except they do a lot of good stuff I would prefer not to have to redo.

Posts: 1

Participants: 1

Read full topic

How to get a component's instance from within an eventManager object

$
0
0

@ctusch wrote:

When I have a component with an eventManager how can I get the instance of the component from within a handler?

The handler's second parameter contains only the component clicked on, which can be a nested component. When I define the handler directly on the component 'this' points to the component. In the eventManager it points to the eventManger.

I'd like to use the eventManager because it puts all handlers neatly in one place and passes the component from which the event originated. Is there a good solution to this problem?

Posts: 7

Participants: 2

Read full topic

Loading Multiple Models with Ember.RSVP and $.getJSON

$
0
0

@Koala wrote:

I am trying to load multiple models with Ember $.getJSON. Initially i created the models objects successfully in separates routes but i need now to create them in the same route. I am using Github API

I came with the conclusion to use Ember.RSVP.hash and that's how i try to achieve it

I am getting two JSON

    userurl = 'https://api.github.com/users/user';
    reposurl = 'https://api.github.com/users/user/repos';

I create the model objects for the repositories and the user git information to find them later in the store with Ember.RSVP.hash

Here the Route code ( sorry for the length :smiley: )

model: function(params) {
    var userurl, reposurl, self, git, repoListProxy, usersPromise, repositoriesPromise;
    self = this;
    git = this.store.createRecord('git',{});
    userurl = 'https://api.github.com/users/user';
    reposurl = 'https://api.github.com/users/user/repos';
    repoListProxy = Ember.ArrayProxy.create({
        content: []
    });
    usersPromise  = function(){
		return Ember.$.getJSON(userurl, function(data) {
	        var item = [];
	        git.setProperties({
	            name: data.name,
	            login: data.login,
	            location: data.location,
	            company: data.company,
	            followers: data.followers,
	            following: data.following
	        });
	    });
        item.pushObject(git);
        return resolve(item);
	};
	repositoriesPromise = function(){
        return Ember.$.getJSON(reposurl, function(repos) {
            if (repos.length) {
                repos.toArray().forEach(function(item, index, arr){
                    var repo;
                    repo = self.createReposList(item, repoListProxy);
                });
                repos = repoListProxy.get('content');
                return resolve(repos);
            }
        });
    };
    return Ember.RSVP.hash({
        git: this.store.find('git'),
        repo: this.store.find('repo')

    });
},

createReposList: function(repo, arr){
    var record
    record = this.store.createRecord('repo',{}),
    record.setProperties({
        name: repo.name,
        description: repo.description
    })
    arr.pushObject(record);
    return record;
},

Here my console log error

I can not really understand where it is my error but assume that i am not using Ember.RSVP.hash as it should, or there is a better way to load these multiple models?

Posts: 4

Participants: 3

Read full topic

Should I start a new project in 1.13 (or 1.10) or 2.2?

$
0
0

@andrew1 wrote:

I'm about to start my next Ember project and I was looking for a little guidance on which version to start with.

I first started playing with 1.13 and quickly got a test app up to look at different tools for creating tables (it's not sexy but tables make the money so they're very important to this app). I found the ember-collection addon and integrated it into the test app and was really psyched to see that I could handle 10,000 rows.

My next thought was to go with 2.2 and keep up-to-date with new releases (this time will be different ;0). But, I've run into a problem using the ember-collection addon. It's now complaining that it can't find a helper defined in the addon:

Uncaught Error: Assertion Failed: A helper named 'fixed-grid-layout' could not be found

If I remove that function and just use {{#ember-collection items=model as |item index|}} then it can't find the ember-collection component:

Uncaught Error: Assertion Failed: A helper named 'ember-collection' could not be found

It looks like there's some issue with loading addons in 2.2 (maybe it's just because it's a local repo???) but I don't know if the issue is that addon developers aren't supporting 2.2 yet or there's a but or something else. So, I thought I'd ask for advice here.

Thanks!

P.S. There aren't any features in the 2.0 series that I'm dying to have yet (when routable components drop it will be another story) but a more stable version would definitely be appreciated by me and my team.

Posts: 8

Participants: 3

Read full topic

Using {{yield}} for multiple nested components

$
0
0

@bttf wrote:

If a component has two or three levels of descendant components, it can get a little annoying when having to pass down a parameter that is only needed by the last descendant all the way through the chain.

Using the {{yield}} helper can eliminate some of the cruft by allowing me to declare the nested component within the scope of the parent container. The only problem I am having now is that I cannot have multiple yield 'outlets' ... If I wanted to nest multiple components in different parts of the containing component's template I would be unable to (AFAIK).

The new contextual component feature in 2.3 seems like it might make things easier with the (hash and (component helpers but I am still limited by only having one {{yield}} "outlet" in a template. Does anyone have advice for this predicament and or a better way of seeing things? Thanks in advance.

Posts: 2

Participants: 2

Read full topic

Is it still ok/desirable to use DS.Store.filter in Ember Data 2+?

$
0
0

@ozzyoli wrote:

The Ember (+Ember Data) guides no longer seem to discuss using Store.filter for V2.0+.

I was wondering if it is no longer considered good practice to use?

I use Websockets and periodic data pulls to maintain the latest set of records across my app, using Store.filter extensively to have live reloading arrays across my application.

Posts: 2

Participants: 2

Read full topic

Component to controller one-way communication

$
0
0

@valo wrote:

Hi,

I am working on a fairly complex Ember application and I am trying to split the app into separate components for better maintainability and also to move away from controllers as much as possible. I am quite new to ember, stiff fighting with some issues and I am not completely sure how to tackle some tasks.

The problem I am facing at the moment is a bottom-up communication between a component and the controller and specifically around validations. I have a component with some validations defined in it and input fields. I want to have a property in the controller, which resembles if the underlying component has valid data. Here is a jsbin with an example: http://jsbin.com/boyovitawi/9/edit?html,js,output

After quite a bit of experimenting I convinced myself that I need to use the mut helper and use an observer to update the controller's property. A better solution will be to have a one-way binding from the component to the controller, but I couldn't find a way to do that. Is that possible?

Also I had to explicitly update the mut property in the init of the component, which is really strange. Any ideas why is that needed? You can try to remove the init in the component and you will see how the binding breaks (controller no longer knows when the inputs are valid).

I will be thankful for any pointers and suggestions.

Thanks, Valentin

Posts: 4

Participants: 2

Read full topic


Ember as an addon

$
0
0

@scudco wrote:

I was just listening to Ember Weekend and they mention that Ember Data had been pulled out into an Ember addon https://github.com/emberjs/data/pull/3907

They also expressed excitement about Ember becoming an addon.

Can anyone explain why Ember Data as an addon is a cool thing, and what exactly is meant by "Ember as an addon"?

Posts: 4

Participants: 2

Read full topic

Testing Ember.Logger.error assertions

$
0
0

@nullnullnull wrote:

I'm using Ember.Logger.error:

if (isInvalid) {
  Ember.Logger.error('this is invalid');
}

I want to test it in qunit:

assert.throws(() => myFunction(), /this is invalid/, 'error was thrown');

But assert.throws doesn't catch the error. It does if I replace Ember.Logger.error with a simple throw statement, but surely there's a way to test for logged Ember errors. Anyone know the way?

Posts: 1

Participants: 1

Read full topic

Ajax request to port 80

$
0
0

@ioanszabo wrote:

Hi,

I am using ember-cli, so I use port 4200 to launch the application. Anyway my backend is an apache with php mysql. My question is: can I launch application on port 4200 and ajax request on port 80?

Defining host in adapter didn't solved the issue.

Thanks.

Posts: 2

Participants: 2

Read full topic

How to fix DEPRECATION Using Application.registry.resolve

$
0
0

@gkaplan wrote:

I am using Ember 2.2, Ember Data 2.1, and just updated to ember-cli 1.13.12.

My app is still in infancy - I added a mock http service today and now I'm getting the following deprecation warning. I tried updating npm dependencies to newer version, but I cannot figure out what is causing this. Can someone help me get rid of this deprecation?

Thank you

UPDATE: I may have solved this - it seems that I needed to also update all the bower components to newer versions. Once I did that, it seems that the deprecation isn't showing up anymore.

Posts: 1

Participants: 1

Read full topic

Testing a facebook application

$
0
0

@sergio_101 wrote:

I am wondering how to go about testing a Facebook application using the included testing framework.

The idea is that a Facebook application is just a web app (ember app in this case) inside an iframe on the Facebook page.

The trick is, if a use goes to this page from outside Facebook, they will be immediately directed back to the Facebook url for this application.

All this being said, how would i go about running tests? How would i address the DOM inside the iframe?

Thanks!

Posts: 1

Participants: 1

Read full topic

Viewing all 4748 articles
Browse latest View live




Latest Images