donnut/index.html

## index.html
<!doctype html>
<html lang="en">
  <head>
    <title>QUnit Tests</title>
    <meta charset='utf-8' />
    <link rel="stylesheet" href="./lib/qunit.css" type="text/css" media="screen" />
    <script type="text/javascript" src="./lib/jquery.js"></script>
    <script type="text/javascript" src="./lib/underscore.js"></script>
    <script type="text/javascript" src="./lib/backbone.js"></script>
    <script type="text/javascript" src="./lib/backbone-associations.js"></script>
    <!--<script type="text/javascript" src="./lib/backbone-tastypie.js"></script>-->
    <script type="text/javascript" src="./lib/qunit.js"></script>
    <script type="text/javascript" src="./main.js"></script>
  </head>
  <body>

    <h1 id="qunit-header">Backbone-associations Test Suite</h1>
    <h2 id="qunit-banner"></h2>
    <div id="qunit-testrunner-toolbar"></div>
    <h2 id="qunit-userAgent"></h2>
    <ol id="qunit-tests"></ol>
    <div id="qunit-fixture">
    </div>
    <div>
  </body>
</html>

## main.js
$(document).ready(function() {

  var MasterCollection = Backbone.Collection.extend({
    model: Master
  });

  var Master = Backbone.AssociatedModel.extend({
    defaults: {
      name: 'Meester'
    }
  });

  var Panel = Backbone.AssociatedModel.extend({
    defaults: {
      name: 'Paneel',
      master: null
    },
    relations: [{
      type: Backbone.Many,
      key: 'master',
      relatedModel: Master,
      //collectionType: 'MasterCollection'
    }]
  });

  var WebApp = Backbone.AssociatedModel.extend({
    url: '/app',
    defaults: {
      name: 'Applicatie',
      version: 0.1,
      panel: null
    },
    relations: [{
      type: Backbone.One,
      key: 'panel',
      relatedModel: Panel
    }],
    sync: function(method, model, options) {
      return options.success.call(this, {
        name: 'hoofdapp',
        panel: {
          name: 'mainpanel',
          master: [{
            name: 'boven'
          },{
            name: 'onder'
          }]
        }
      });
    }
  });

  module('basic tests', {
    setup: function() {

      app = new WebApp({
        name: 'nieuw app',
        color: 'red'
      });

      panel = new Panel({
        name: 'hoofdpaneel'
      });

      header = new Master({
        name: 'kop'
      });

      footer = new Master({
        name: 'bodem'
      });
    }
  });

  test('koppel modellen', function() {
    app.set({panel:panel});
    panel.set({master: [header, footer] });
    equal(app.get('panel').get('name'), 'hoofdpaneel');
    equal(app.get('panel').get('master').pop().get('name'), 'bodem');
    equal(app.get('panel').get('master').pop().get('name'), 'kop');
  });

  test('koppel modellen via 1 object', function() {
    var app1 = new WebApp({
      name: 'hoofdapp',
      panel: {
        name: 'mainpanel',
        master: [{
          name: 'boven'
        },{
          name: 'onder'
        }]
      }
    });
    equal(app1.get('panel').get('name'), 'mainpanel');
    equal(app1.get('panel').get('master').pop().get('name'), 'onder');
    equal(app1.get('panel').get('master').pop().get('name'), 'boven');
  });

  test('koppel modellen via 1 json object', function() {
    var app1 = new WebApp();
    app1.fetch({success: function(model, resp) {
      equal(model.get('panel').get('name'), 'mainpanel');
      equal(model.get('panel').get('master').pop().get('name'), 'onder');
      equal(model.get('panel').get('master').pop().get('name'), 'boven');
    }});
  });


});
	<!doctype html>
	<html lang="en">
	<head>
	<title>QUnit Tests</title>
	<meta charset='utf-8' />
	<link rel="stylesheet" href="./lib/qunit.css" type="text/css" media="screen" />
	<script type="text/javascript" src="./lib/jquery.js"></script>
	<script type="text/javascript" src="./lib/underscore.js"></script>
	<script type="text/javascript" src="./lib/backbone.js"></script>
	<script type="text/javascript" src="./lib/backbone-associations.js"></script>
	<!--<script type="text/javascript" src="./lib/backbone-tastypie.js"></script>-->
	<script type="text/javascript" src="./lib/qunit.js"></script>
	<script type="text/javascript" src="./main.js"></script>
	</head>
	<body>

	<h1 id="qunit-header">Backbone-associations Test Suite</h1>
	<h2 id="qunit-banner"></h2>
	<div id="qunit-testrunner-toolbar"></div>
	<h2 id="qunit-userAgent"></h2>
	<ol id="qunit-tests"></ol>
	<div id="qunit-fixture">
	</div>
	<div>
	</body>
	</html>
	$(document).ready(function() {

	var MasterCollection = Backbone.Collection.extend({
	model: Master
	});

	var Master = Backbone.AssociatedModel.extend({
	defaults: {
	name: 'Meester'
	}
	});

	var Panel = Backbone.AssociatedModel.extend({
	defaults: {
	name: 'Paneel',
	master: null
	},
	relations: [{
	type: Backbone.Many,
	key: 'master',
	relatedModel: Master,
	//collectionType: 'MasterCollection'
	}]
	});

	var WebApp = Backbone.AssociatedModel.extend({
	url: '/app',
	defaults: {
	name: 'Applicatie',
	version: 0.1,
	panel: null
	},
	relations: [{
	type: Backbone.One,
	key: 'panel',
	relatedModel: Panel
	}],
	sync: function(method, model, options) {
	return options.success.call(this, {
	name: 'hoofdapp',
	panel: {
	name: 'mainpanel',
	master: [{
	name: 'boven'
	},{
	name: 'onder'
	}]
	}
	});
	}
	});

	module('basic tests', {
	setup: function() {

	app = new WebApp({
	name: 'nieuw app',
	color: 'red'
	});

	panel = new Panel({
	name: 'hoofdpaneel'
	});

	header = new Master({
	name: 'kop'
	});

	footer = new Master({
	name: 'bodem'
	});
	}
	});

	test('koppel modellen', function() {
	app.set({panel:panel});
	panel.set({master: [header, footer] });
	equal(app.get('panel').get('name'), 'hoofdpaneel');
	equal(app.get('panel').get('master').pop().get('name'), 'bodem');
	equal(app.get('panel').get('master').pop().get('name'), 'kop');
	});

	test('koppel modellen via 1 object', function() {
	var app1 = new WebApp({
	name: 'hoofdapp',
	panel: {
	name: 'mainpanel',
	master: [{
	name: 'boven'
	},{
	name: 'onder'
	}]
	}
	});
	equal(app1.get('panel').get('name'), 'mainpanel');
	equal(app1.get('panel').get('master').pop().get('name'), 'onder');
	equal(app1.get('panel').get('master').pop().get('name'), 'boven');
	});

	test('koppel modellen via 1 json object', function() {
	var app1 = new WebApp();
	app1.fetch({success: function(model, resp) {
	equal(model.get('panel').get('name'), 'mainpanel');
	equal(model.get('panel').get('master').pop().get('name'), 'onder');
	equal(model.get('panel').get('master').pop().get('name'), 'boven');
	}});
	});


	});