emberjs / ember.js

Ember.js - A JavaScript framework for creating ambitious web applications

Ember.js is a JavaScript framework that greatly reduces the time, effort and resources needed to build any web application. It is focused on making you, the developer, as productive as possible by doing all the common, repetitive, yet essential, tasks involved in most web development projects.

With Ember, you get all of these things:

• A Welcoming Community - Get the help you need, when you need it.
• An Enduring Foundation for your Apps - There are apps that used the first version of Ember almost a decade ago, and successfully still use Ember today.
• Reliability & Security - With regular LTS Releases and 30 weeks of security fixes, you can rely on Ember.js to care about the stability and security of your app.
• Modern JavaScript - Use modern JavaScript features that you're already familiar with like classes, decorators and generators.
• Documentation - Rely on top-notch documentation for each Ember version and a team that is focused on the documentation and learning experience.
• HTML-first Components - Start with valid, semantic HTML in your components, and layer in the functionality that you need, as you need it.
• Routing - Ember routes respect URLs while layering in extra functionality like rendering templates, loading data models, handling actions, and conditionally redirecting.
• Data Layer - Ember Data is a powerful data management tool that comes with Ember apps by default. Want to use something else? We support that, too!
• Flexibility Use any backend stack with your Ember apps, thanks to the flexibility of adapters and serializers.
• Autotracking - Ember's reactivity model makes it easier to decide what to automatically update, and when.
• Zero Config Apps - With strong defaults, you may never need to configure anything in your app, but the options are there if you need it!
• Quality Addon Ecosystem - high-quality, rated addons with the ability to search by source code. Many require no additional configuration, making it easier than ever to supercharge your apps.

Find out more:

• Website
• Guides
• API
• Community
• Blog
• Builds

Contributions

See CONTRIBUTING.md

---

Cross-browser testing provided by Browserstack.

ember.js's Issues

Outdated "How to Run Unit Tests" Info

Hi,

I want to get the SC 2.0 unit tests up and running and the information in the readme seems outdated. Installing the spade gem doesn't add a spadepkg binary. That seems to have been superseeded by bpm. But the only package bpm seems to know about (via bpm list) is spade 0.1.2. I've also tried installing the spade-packager gem, but that doesn't work either. So before I keep trying, I thought I'd just kindly ask you to point me in the right direction and/or update the info in the Readme file.

Thanks!

Johannes

Race condition in SC.View.createElement?

I have a situation in which a child view is getting destroyed during its own createElement method.

createElement calls renderToBuffer calls SC.run.sync which destroys the view. So when control returns to createElement we try to set(this, 'element') on a destroyed object and hit an assertion.

The view in question is the child of an SC.CollectionView. It looks like two rapid changes to the contents of the collection can cause this behavior: the first change causes SC.CollectionView to create a new child and call its createElement, then the second change hits and the collection tries to destroy the new child before it has finished being created.

It's also possible that I'm only seeing these two rapid changes because I'm misusing bindings & queries in some way. If there's something inherent to sproutcore's architecture that's supposed to prevent this kind of race, I must have found a way to subvert it, so at the least there's probably an opportunity to add a new assertion.

SC fails to load in IE8 and under

The redefineProperty check in SC.platform fails with an error when IE doesn't define Object.defineProperty (<8 and older render modes). The check assumes Object.defineProperty is a function to begin with. Additionally, when it is in IE8 standards mode it also fails because the test attempts to define a property on a normal object (IE8 defineProperty only works on DOM elements).

I was able get around it with the following:
https://github.com/yozora/sproutcore20/commit/de8a783b56f22aeb6cb4fb79df3c940c12cc5607

Expected constant, MSIE8, sprout-2.0.beta.1

In IE8, sproutcore 2.0 beta 1 produces the following error:

Line: 1615
Char: 8
Error: Expected constant

Sproutcore breaks when EXTEND_PROTOTYPES==false

On platforms that can't use the native Object.defineProperty (like certain Android, see issue #85) the SC.META_KEY property becomes enumerable and the following statement causes jQuery to enter infinite recursion:

jQuery.extend(true, {}, {a:[]})

(because it's trying to deep copy [][SC.META_KEY].source[SC.META_KEY].source))

So I assumed that I need to set ENV.EXTEND_PROTOTYPES=false to make sproutcore leave the Array prototype alone. However, there is code within sproutcore itself that breaks when EXTEND_PROTOTYPES is disabled (calls to Function.property, Function.cacheable, Array.insertAt, etc).

It wouldn't be hard to fix these issues, but I want to ask if this is a change that's likely to be accepted before I take the time to do it. Is Sproutcore committed to working under EXTEND_PROTOTYPES==false?

If so I would also recommend changing the overall unit test configuration so it's immediately apparent if somebody tries to use these methods within Sproutcore.

Issue with rendering multiple, bound nested collections

I have just updated an app to the latest version of Sproutcore2 and it's broken a few things. I don't know yet exactly what is causing the breakage but I have test case to demonstrate it, below.

I've verified that this test used to pass and that it's now failing. The commit that introduced the breaking change is 4e7bf9e

The test is failing because the structure of the html generated by the nested collections is incorrect.

In the test, there are two sets of bindings in play.

1. between TemplateTests.contentController and TemplateTests.OuterList
2. between TemplateTests.InnerList and TemplateTests.OuterListItem

if you remove either of these bindings then the test passes.

test("should render multiple, bound nested collections", function() {

  TemplateTests.contentController = SC.ArrayProxy.create({
    content: ['foo','bar']
  });

  TemplateTests.InnerList = SC.CollectionView.extend({
    tagName: 'ul',
    contentBinding: 'parentView.innerListContent'
  });

  TemplateTests.OuterListItem = SC.View.extend({
    template: SC.Handlebars.compile('{{#collection TemplateTests.InnerList class="inner"}}{{content}}{{/collection}}{{content}}'),
    innerListContent: [1,2,3]
  });

  TemplateTests.OuterList = SC.CollectionView.extend({
    tagName: 'ul',
    contentBinding: 'TemplateTests.contentController',
    itemViewClass: TemplateTests.OuterListItem
  });

  var view = SC.View.create({
    template: SC.Handlebars.compile('{{collection TemplateTests.OuterList class="outer"}}')
  });

  SC.run(function() {
    view.appendTo('#qunit-fixture');
  });

  equals(view.$('ul.outer > li').length, 2, "renders the outer list with correct number of items");
  equals(view.$('ul.inner').length, 2, "renders the correct number of inner lists");
  equals(view.$('ul.inner:first > li').length, 3, "renders the first inner list with correct number of items");
  equals(view.$('ul.inner:last > li').length, 3, "renders the second list with correct number of items");

});

Templates inside views are compiled incorrectly

Hi,

here's an example of this issue: http://jsfiddle.net/CzXMS/1 The example uses alpha 4, but the same issue is on the master branch - I just couldn't find public URL to a newer version anywhere.

If you run it, it raises Uncaught TypeError: Cannot read property 'ChildView' of undefined error in the console. It's looking for the global MyApp object in Handlebars.helpers or in currentContext, which in this case is MyApp.ParentView and of course can't find it in any of these objects.

SC.guidFor breaks when calling SC.Object.create()

If you create a new instance of an object without passing a hash, duplicate guids will be returned for that object.

For example:

var foo = SC.Object.create();
var bar = SC.Object.create();
foo === bar; // false
SC.guidFor(foo) === SC.guidFor(bar); // true

SC.RenderBuffer: elementContent is not correctly concatenated

Hey there,

I found a little issue while writing a custom render function.

Steps to replicate:

var b = new SC.RenderBuffer('div'); b.push('a'); b.push('b'); b.string()

Result:

"<div >a,b</div>" 

Expected:

"<div >ab</div>"

Reason:

Array.join uses a comma as default delimiter when no arguments are passed:

['a', 'b'].join()    =>  'a,b'

https://github.com/sproutcore/sproutcore20/blob/master/packages/sproutcore-views/lib/system/render_buffer.js#L229

"You can't insert an element into the DOM that has already been inserted" error

Hi,

I'm getting this error after switching from some older version of SC2 to the latest version on master (actually it's https://github.com/sproutcore/sproutcore20/tree/e16466cb58b87a05e45b28f572663a489619f905).

Here's a test case: http://jsfiddle.net/szimek/LbEPG/

Everything is rendered "correctly", but in the console you'll notice that it throws You can't insert an element into the DOM that has already been inserted error.

Funny thing is that if you change timeout to 0 in App.Controllers.application.connect function or remove class name bindings from App.Views.Wrapper view then it works fine and doesn't throw any error...

There's also another issue (I'm not sure if it's related) - App.Views.Wrapper binded class is displayed twice - it's class="sc-views John John". Not sure why...

.DS_Store files in code tree

There are couple of .DS_Store files in your code tree. You may want to get rid of them and adjust ".gitignore"

Parent views are removed before child views

I'm not sure if it's a bug or not, but it looks like parent views are removed before child views. Here's an example: http://jsfiddle.net/szimek/jGdgw

In the child view I have a binding which calls parentView.name, but when the parent view is destroyed, this binding function is called and becasue parentView === null it throws an error.

Should I explicitly check for parentView or this.get('state') === 'inDOM' or is it a bug?

Stopping propagation on events interferes with other delegation on a page

I ran into a bug where a library I was using in my SC app was delegating some of its events to window, but sproutcore is stopping propagation on those events before they ever get there. (This could potentially be even worse if someone declares app.rootElement)

Here's a failing test which demonstrates this: https://github.com/dmarcotte/sproutcore20/commit/c2c4db2a4556ef2af10b975fbba20e5f96d55e49#diff-1

I was playing with a couple of ways to fix this:

• is there a reason I'm missing that jquery.delegate's simulated bubbling can't take care of this? Are there situations where views can have childViews which are not contained in their div? Here's what this would look like:
  https://github.com/dmarcotte/sproutcore20/commit/c2c4db2a4556ef2af10b975fbba20e5f96d55e49#diff-0
• otherwise, I reckon events could be tagged as seen so they can be ignored appropriately:
  https://github.com/dmarcotte/sproutcore20/commit/ebbbd4f8d7dd90328461b590d5fdb363106a42f3#diff-0

Html classes repeated when binding to itemViewClass's attributes

I will try to add failing test for this, but for now here is error reproduced on jsfiddle: http://jsfiddle.net/b4RMr/10/

Both boxes have classes from bindings repeated twice. When you change classNameBinding to "parentView.foo" instead of just "foo" it starts to work correctly.

Integer property causes an error if template is fetched from head element

Hey,

there's something messed up in the current master branch (f87b064) with rendering integer values in templates.

Here's a working example when template is directly in a view: http://jsfiddle.net/szimek/9EE5M/

Here's almost the same example, but the template is fetched from a script in head element: http://jsfiddle.net/szimek/9EE5M/1/ and it raises Uncaught TypeError: Object 5 has no method 'string' error

The same thing works fine with beta 1: http://jsfiddle.net/szimek/9EE5M/2/

Looks like it's a bug in SC._RenderBuffer#string method. In https://github.com/sproutcore/sproutcore20/blob/master/packages/sproutcore-views/lib/system/render_buffer.js#L348 it tries to call buffer.string() if buffer is not a string. In this case buffer is 5 and 5 doesn't have a string method.

instructions for running unit tests

The instructions for running the unit tests appears wrong. At least for me running gem install spade does not give me a spadepkg command. I'm getting the 0.1.1.1 version of the spade gem. Which appears different than what is here:
https://github.com/strobecorp/spade

I found spade-packager which does give me a spadepkg command. So after doing
gem install spade-packager
gem install spade-core

Then I could run
spadepkg install sproutcore-preprocessor
But that then returns:
Can't find package sproutcore-preprocessor >= 0 available for install

So in summary there are 2 issues here:

• why isn't gem install spade installing spadepkg
• why can't spade find sproutcore-preprocessor

Circular Dependency between Sproutcore-Metal and Sproutcore-Runtime

The require variable is defined in sproutcore-runtime but required in sproutcore-metal. Sproutcore-Runtime list Sproutcore-Metal as a dependency.

sproutcore-runtime tests halting with error

sproutcore-runtime tests are failing with the following error:

Uncaught TypeError: Cannot call method 'extend' of undefined
(anonymous function)sproutcore-runtime/~tests/system/native_array/suite_test:7
execFactoryspade.js:230
Sp.requirespade.js:377
requirespade.js:175
(anonymous function)qunit/qunit-runner:42
execFactoryspade.js:230
Sp.requirespade.js:377
Tp.requirespade.js:966
(anonymous function)spade-boot.js:1048
Tp.readyspade.js:1106
Lp.scheduleReady.handler

SC.MutableArrayTests is the undefined it's complaining about.

Note that I'm not following the current readme instructions since bpm autocompile gives me 'You do not appear to be inside of a bpm project' and bpm preview gives me 'Could not find task "preview".' I'm running with spaderun update; spaderun preview, so apologies if that's the wrong method right now and this is a non-issue.

Also, I'm on Ubuntu 11.04 if it makes a difference.

CollectionView's EmptyView not rendering reliably

EmptyViews are giving up after they are rendered a few times.

Here's a fiddle which demonstrates: http://jsfiddle.net/GJWEh/. After emptying out the collection's content a few times, it just starts rending empty, instead of the EmptyView.

SC complains when event sender's callback tries to remove itself

I'm learning sproutcore, so maybe that's something I'm doing wrong, but after I asked in the IRC channel and no one had an answer to give me I think maybe it's a bug.

So, I modified the todo sample app to include a button that would remove the task like so:

{{#collection ... }}
     {{#view SC.Buton target="Todos.todosController" action="removeTodo" }}Remove{{/view}}
{{/collection}}

and in the controller:

removeTodo : function(btn)
{
    var todo = this.getPath('.parentView.content');
    this.removeObject(todo);
}

Although it removes the task, it gives an error doing so. Telling me that I can't set an observer in a destroyed object.

Probably because the event sender is being removed in its on callback. Using a timeout of 100ms to execute the action solved the problem, but that doesn't sound right.

Rendering nested collections

The recent changes to the way that views get rendered, ie. waiting for the bindings to synchronise first, seems to have broken the rendering of nested collections.

I have written a failing test case to illustrate the issue: https://github.com/crofty/sproutcore20/commit/2ed7a8f1866ec94ef545f31efdc6e2f502396d57

The equivalent test case passes when run against the code prior to commit that introduced the view changes (https://github.com/sproutcore/sproutcore20/commit/f62a9f1cd98c8dcf0ee1be0eacd2a67d13278248)

In my app, I'm using this form of nested collections a lot, i.e. binding the content of the view to some property of the parent view. Is this the correct way of doing it? Is the bug valid or is there a different way to do nested collections?

SC.Button is not keyboard-accessible

Steps to reproduce:Open the todos sample.Add a to-do and mark it complete.Press Tab until the edit box receives focus, then press Tab one more time. The focus is now on the "Clear Completed Todos".Press Space.Excepted behavior: The button is activated and the list is cleared.Observed behavior: Nothing.Tested in Firefox 5 and Chrome 13 beta.

rake task fails

on my setup (mac, ruby 1.9.2p180), rake fails with the following error message:

rake aborted!
invalid byte sequence in US-ASCII

So I hacked into the Rakefile this command:

Encoding.default_external = Encoding.find("UTF-8") </code/>

and it worked, but I am not sure whether this is the right approach ...

Collection view issues when content changes

Trying the todo's sample with current Master gives the following error when you mark an item complete and hit the clear completed button. This issue is showing up for me when changing the sort order of a collection but is easiest to repro using the todos sample. Add two todos, mark one complete and hit the clear completed button.

Uncaught Error: assertion failed: You cannot set observed properties on destroyed objects
sc_assertsproutcore.js:1565
SC.Descriptor.MUST_USE_SETTERsproutcore.js:2491
setsproutcore.js:2005
setsproutcore.js:2030
SC.setPathsproutcore.js:2272
Binding.SC.Object.extend._syncsproutcore.js:8966
invokesproutcore.js:7901
itersproutcore.js:7946
RunLoop.SC.Object.extend.flushsproutcore.js:7987
RunLoop.SC.Object.extend.endsproutcore.js:7921
SC.run.endsproutcore.js:8066
SC.run.runsproutcore.js:8042
SC.EventDispatcher.SC.Object.extend.setupHandlersproutcore.js:9976
Njquery-1.6.1.min.js:16
f.event.handlejquery-1.6.1.min.js:17
f.event.add.k.i.handle.k

Template bug

inside a templateview with SPAN tag I have another SPAN with a binded class attribute, which is supposed to change on custom actions. Now the problem is that the binded className gets applied to the outer SPAN (of the view itself) and not the inner SPAN where the bind attribute is defined.

I have a complete example below, which illustrates the behaviour (based on SC 2.0 a3 from starterkit)

https://gist.github.com/1006104

Computed properties do not respect SC.beginPropertyChanges()

This one surprised me: computed properties always get recalculated immediately, even within beginPropertyChanges.

Is this an intended behavior? It would be nice to be able to batch up changes to keep recalculation to a minimum.

Reading the source, I don't understand why dependent keys have a different implementation from observers. It seems like we could implement dependent keys on top of observers, and then this issue would be fixed automatically, since observers respect beginPropertyChanges.

Doc clarity: Handlebars registerHelper passed a key (a string value). Standalone Handlebars passes an object.

Perhaps this is intended (edit: it is intended, but not well documented), but it seems like in the documentation that the actual value should be passed to the helper.

Test = SC.Application.create();

Handlebars.registerHelper('simpleHelper', function( myProp, context) {
  // this logs out as : `myProp string'
  console.log( myProp, typeof myProp );

  // I would expect to have the actual object
  // myProp === { actual: 'object' } <--  true (if it was bound to something)
  return 'output';
});

This is with the template:

<script type="text/html">
  {{simpleHelper myProp}}
</script>

I know that's without data bindings for the property, so here's a more complex example with data: http://pastie.org/2117982

Exception within helperMissing

The following program correctly triggers the helperMissing handler, but instead of a nice exception we get a TypeError because options.data is undefined.

<html> 
  <body> 
    <script type="text/html">
      {{#if A.value}}
      {{no_such_helper foo}}
      {{/if}}
    </script>
    <script type="text/javascript" src="/javascripts/jquery.js"></script> 
    <script type="text/javascript" src="/javascripts/sproutcore.js"></script> 
    <script type="text/javascript">
      A = SC.Application.create();
      A.set('value', true);
    </script>
  </body> 
</html> 

SC.Buttons inside of form tags trigger form submission

Using sproutcore-2.0.a.2.js inside an existing HTML page.

I rendered a collection nested inside a form tag. A form submission is triggered when clicking on an SC.Button. If I move the collection outside of the form tag it works as expected.

type "text/x-handlebars" is not valid anymore

In the guides.sproutcore20.com, the Handlebars section uses type="text/x-handlebars" , it need to be "text/html".
Is there a repository to submit fixes on that guide ?

SC won't start on Android

The following trivial application fails to launch on Android (both 2.3.3 and 3.0.1):

<html>
  <body>
    <script type="text/html">Test</script>
    <script type="text/javascript" src="/javascripts/jquery.js"></script>
    <script type="text/javascript" src="/javascripts/sproutcore.js"></script>
  </body>
</html>

Here is a stacktrace I was able to obtain via adb with the help of stacktrace.js:

I/browser ( 3232): sc_assert (http://hasufel/javascripts/sproutcore.js:1573:38)
I/browser ( 3232): [object Object].<anonymous> (http://hasufel/javascripts/sproutcore.js:2528:7)
I/browser ( 3232): defineProperty (native)
I/browser ( 3232): [object Object].setup (http://hasufel/javascripts/sproutcore.js:2481:3)
I/browser ( 3232): Object.defineProperty (http://hasufel/javascripts/sproutcore.js:2702:10)
I/browser ( 3232): Object.unwatch (http://hasufel/javascripts/sproutcore.js:3824:20)
I/browser ( 3232): removeDependentKey (http://hasufel/javascripts/sproutcore.js:2844:6) http://hasufel/javascripts/sproutcore.js:1573
E/browser ( 3232): Console: Uncaught Error: assertion failed: Must use SC.set() to access this property http://hasufel/javascripts/sproutcore.js:1573

As you can see, the browser's native Object.defineProperty is invoking the setter which is intended to never be invoked.

I'm using sproutcore.js built from the very latest master (cc5a43b).

Nested store corrupts null values

If a string attribute on an SC.Record is set to null, it is returned as null when accessed through the base store, but returned as the string "[object Object]" when accessed through a nested store. The following program demonstrates the problem:

<html>
<body>
<script type="text/javascript" src="/javascripts/jquery.js"></script>
<script type="text/javascript" src="/javascripts/sproutcore.js"></script>
<script type="text/javascript" src="/javascripts/sproutcore-datastore.js"></script>

<script type="text/html">

<h1>From original store</h1>
name: {{A.rec.name}}<br/>
nameIsNull: {{A.rec.nameIsNull}}

<h1>From nested store</h1>
name: {{A.nrec.name}}<br/>
nameIsNull: {{A.nrec.nameIsNull}}

</script>
<script type="text/javascript">

A = SC.Application.create()
A.Rec = SC.Record.extend({
  name: SC.Record.attr(String),
  nameIsNull: function(){ return this.get('name') === null }.property('name')
})

A.store = SC.Store.create();
A.store.loadRecords(A.Rec, [{name: null}]);

A.rec = A.store.find(A.Rec).get('firstObject');
A.nrec = A.store.chain().find(A.rec)

</script>
</body>
</html>

You can view this in action here: http://b.sweetbytes.net/javascripts/test.html

No simple way of turning SC.Object into JSON hash/PoJSo

For amongst others, debugging purposes, it would be very handy to be able to easily dump a SC.Object into a JSON Hash.
.toString() isn't useful at all and there doesn't seem to be a toJSON. The closer the SC.Object is to a PoJSo object, the handier.

Unable to use #each inside #if and #with helpers

Basically, {{#with content}}{{#each releases}}Mac OS X {{version}}: {{name}} {{/each}}{{/with}} will not render anything when the view has a content property who has an array in its releases property:

var view = SC.View.create({
    template: SC.Handlebars.compile('{{#if content.releases}}{{#each content.releases}}Mac OS X {{version}}: {{name}} {{/each}}{{/if}}'),
    content: {
      releases: [ { version: '10.7',
                    name: 'Lion' },
                  { version: '10.6',
                    name: 'Snow Leopard' },
                  { version: '10.5',
                    name: 'Leopard' } ]
    }
  });

I've written a couple specs that show more detail here: https://gist.github.com/1049557

If this is a bug, and not an error on my part, I'd be happy to work on a fix.

Tests don't run in IE

Tested with IE 7, 8, and 9.

Looks like a spade related issue. Issue also filed there: https://github.com/sproutcore/spade/issues/1

computed properties on an array using @each don't properly update

window.X = SC.Object.create({  [1,2], y: function() { var sum = 0; this.get('x').forEach(function(i) { sum = sum + i }); return sum; }.property('x.@each') })

Class
window.Y = SC.Object.create({ yBinding: "X.y" })

Class
Y.get('y')
3
X.get('x').pushObject(4)
4
Y.get('y')
3

window.X = SC.Object.create({  [1,2], y: function() { var sum = 0; this.get('x').forEach(function(i) { sum = sum + i }); return sum; }.property('x.length') })

Class
window.Y = SC.Object.create({ yBinding: "X.y" })

Class
Y.get('y')
3
X.get('x').pushObject(4)
4
Y.get('y')
7

Using ".@each" instead of ".length" on an array attribute makes the computed properly not update as expected.

Improve type errors where possible

We talked about looking for opportunities to improve errors, well here's a boiled down version of something I just spent an embarrassing amount of time trying to fix in my app: http://jsfiddle.net/8yVmt/

Note the error in the console. There are no obvious clues as to what part of the code is causing the issue, nor is there much insight into what the problem might be ("unknown mixin"?).

So... yeah... I put ArrayProxy.extend rather than .create. That is clearly foolish. This issue is a request that the resulting error do more to help me track down my foolishness.

I feel like there is a strong case for putting some effort into improving this flavor of error: I effectively just typo-ed this and had trouble finding my problem; imagine how mysterious this would be for a beginner who's fuzzy on the difference between extend and create.

Observers are not triggered for parent view property when view is created

Here's an example: http://jsfiddle.net/szimek/pPSUk/6

With isValueBinding instead of toggleVisibility function it works fine. Not sure if it's a bug or not...

Outdated docs on docs.sc20.com

The docs on http://docs.sproutcore20.com are outdated. Maybe someone with access to this site can upload the current beta1 docs to this location.

Make computed properties cacheable by default

I've been fighting a bug for a few hours when I realized that my expectations of computed properties were wrong.
Basically, I was creating an array in a computed property, then I was rendering each collection element. When click on, the element view would modify itself, but the computed property was not updated which drove me crazy.

I was under the (wrong) assumption that using a computed property would NOT recreate a new object every time. The solution was of course to use cacheable() on my computed property.

Please consider using cacheable by default since it would probably save a lot of frustration.

Add @each property to all enumerables

Currently @each property is defined in SC.Array mixin. It would be great if it worked with e.g. SC.Set as well.

Instructions in README.md for running unit tests is incorrect

There is no amber directory.

Running spade update inside the repo root dir gives an error:

ejb-mbp2:sproutcore20 ebryn$ spade update
/Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/bundle.rb:79:in read': Too many levels of symbolic links - /Users/ebryn/Dev/repos/sproutcore20/.spade/packages/handlebars/package.json (Errno::ELOOP) from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/bundle.rb:79:ingen_spade_boot'
from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/bundle.rb:77:in map' from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/bundle.rb:77:ingen_spade_boot'
from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/bundle.rb:67:in update' from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/bundle.rb:66:inopen'
from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/bundle.rb:66:in update' from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/lib/spade/cli/base.rb:120:inupdate'
from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/thor-0.14.6/lib/thor/task.rb:22:in send' from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/thor-0.14.6/lib/thor/task.rb:22:inrun'
from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/thor-0.14.6/lib/thor/invocation.rb:118:in invoke_task' from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/thor-0.14.6/lib/thor.rb:263:indispatch'
from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/thor-0.14.6/lib/thor/base.rb:389:in start' from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/gems/spade-0.0.7/bin/spade:7 from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/bin/spade:19:inload'
from /Users/ebryn/.rvm/gems/ree-1.8.7-2010.02/bin/spade:19

Running spade preview works from the repo root dir, but tests aren't running when navigating to the test URL. From the web inspector ot looks like spade-boot.js is empty. Tested with Chrome 12 and Safari 5.

build problems

I regularly have ruby, gem and bundler related problems building the sroutcore20 stuff. By updating / resetting my tools and my environment things get sorted out most of the time.

right now I get the following error when trying to run "bundle exec rake"

Could not find libv8-3.3.10.2 in any of the sources

SC.Button cannot use relative paths for target proprety

Not entirely sure if this is intended behavior moving forward but SC.Button won't accept paths relative to itself as target property, e.g.

  {{#view SC.Button target="parentView" action="togglePlayState"}}
    Play
  {{/view}}

Thinking of buttons used in larger components like controls for audio/video tags. Adding this as the root argument at https://github.com/sproutcore/sproutcore20/blob/master/packages/sproutcore-handlebars/lib/controls/button.js#L21 changes the behavior to enable relative path lookup and retains global lookup.

Collection view throwing "You can't insert an element into the DOM that has already been inserted"

I've got another issue in my app relating to collection views. I've reduced it down to a failing test case which is below. I've run the test against previous versions of the code and verifed that it used to pass.

The breaking change was introduced in 0ae26af.

What I am trying to do is render a CollectionView within a view that has bindings to an object - datasetController. When I swap out the dataset for another one, I'd expect the rendered html to update to reflect the new dataset. Instead, I'm getting the following error:

You can't insert an element into the DOM that has already been inserted

Test case is:

test("should allow view objects to be swapped out without throwing an error", function() {
  var view, dataset, secondDataset;

  SC.run(function() {
    TemplateTests.datasetController = SC.Object.create();

    TemplateTests.ReportingView = SC.View.extend({
      datasetBinding: 'TemplateTests.datasetController*dataset',
      readyBinding: 'dataset.ready',
      itemsBinding: 'dataset.items',
      template: SC.Handlebars.compile("{{#if ready}}{{collection TemplateTests.CollectionView}}{{else}}Loading{{/if}}")
    });

    TemplateTests.CollectionView = SC.CollectionView.extend({
      contentBinding: 'parentView.parentView.items',
      tagName: 'ul',
      template: SC.Handlebars.compile("{{content}}")
    });

    view = TemplateTests.ReportingView.create();
  });

  SC.run(function() {
    view.appendTo('#qunit-fixture');
  });

  equals(view.$().text(), "Loading", "renders the loading text when the dataset is not ready");

  SC.run(function() {
    dataset = SC.Object.create({
      ready: true,
      items: [1,2,3]
    });
    TemplateTests.datasetController.set('dataset',dataset);
  });

  equals(view.$('ul > li').length, 3, "renders the collection with the correct number of items when the dataset is ready");

  SC.run(function() {
    secondDataset = SC.Object.create({ready: false});
    TemplateTests.datasetController.set('dataset',secondDataset);
  });

  equals(view.$().text(), "Loading", "renders the loading text when the second dataset is not ready");

});

Observing @each doesn't work properly if observed array is created after object initialization

Hi,

here are 2 examples from discussion on Google group (https://groups.google.com/d/topic/sproutcore/f5eO-f_R0c4/discussion):

• this one works: http://jsfiddle.net/ebryn/pCSGH/13 but resources array is shared among all instances of App.O
• this one doesn't work: http://jsfiddle.net/szimek/pCSGH/15 as it doesn't update the property when status attribute of element of resources array changes

observesBefore is suspended during bindings flush

When a property is changed by a binding synchronizing, observesBefore does not get called until after all bindings finish flushing. Effectively, this means that "before" observers get called at the same time as "regular" observers.

I believe this is due to the fact that observer notifications are suspended until after bindings flush.

Safari 5.0.5 throws TypeError

I tested out the Starter Kit and SC.generateGuid causes a TypeError.

"TypeError: defineProperty is not supported on DOM Objects"

This seems to be working fine on the latest version of Chrome and Firefox 5 Beta.

SC.run doesn't pass extra args to method

The SC.run documentation says that SC.run passes any extra arguments on to the method. But SC.run doesn't actually do that. Extra arguments to SC.run are ignored.

Todos Tutorial Issues

In the tutorial, you indicate to download a new css file, create the "todos.css" and link to it in the head of the index. The new css has calls to compass which do not work in the demo. Also, in the "getting things done" section - the 2nd code example - you are missing 1 handlebar at the beginning of the code.