Example #1
0
QUnit.test('The {{link-to}} helper supports bubbles=boundFalseyThing', function() {
  setTemplate('about', compile("<div {{action 'hide'}}>{{#link-to 'about.contact' id='about-contact' bubbles=boundFalseyThing}}About{{/link-to}}</div>{{outlet}}"));
  setTemplate('about/contact', compile("<h1 id='contact'>Contact</h1>"));

  App.AboutController = Controller.extend({
    boundFalseyThing: false
  });

  Router.map(function() {
    this.route('about', function() {
      this.route('contact');
    });
  });

  let hidden = 0;

  App.AboutRoute = Route.extend({
    actions: {
      hide() {
        hidden++;
      }
    }
  });

  bootApplication();

  run(() => router.handleURL('/about'));
  run(() => jQuery('#about-contact', '#qunit-fixture').click());

  equal(jQuery('#contact', '#qunit-fixture').text(), 'Contact', 'precond - the link worked');

  equal(hidden, 0, "The link didn't bubble");
});
Example #2
0
QUnit.test('The {{link-to}} helper defaults to bubbling', function() {
  setTemplate('about', compile("<div {{action 'hide'}}>{{#link-to 'about.contact' id='about-contact'}}About{{/link-to}}</div>{{outlet}}"));
  setTemplate('about/contact', compile("<h1 id='contact'>Contact</h1>"));

  Router.map(function() {
    this.route('about', function() {
      this.route('contact');
    });
  });

  let hidden = 0;

  App.AboutRoute = Route.extend({
    actions: {
      hide() {
        hidden++;
      }
    }
  });

  bootApplication();

  run(() => router.handleURL('/about'));

  run(() => jQuery('#about-contact', '#qunit-fixture').click());

  equal(jQuery('#contact', '#qunit-fixture').text(), 'Contact', 'precond - the link worked');

  equal(hidden, 1, 'The link bubbles');
});
Example #3
0
QUnit.test('The {{link-to}} helper supports multiple current-when routes', function() {
  Router.map(function(match) {
    this.route('index', { path: '/' }, function() {
      this.route('about');
    });
    this.route('item');
    this.route('foo');
  });

  setTemplate('index', compile('<h3>Home</h3>{{outlet}}'));
  setTemplate('index/about', compile("{{#link-to 'item' id='link1' current-when='item index'}}ITEM{{/link-to}}"));
  setTemplate('item', compile("{{#link-to 'item' id='link2' current-when='item index'}}ITEM{{/link-to}}"));
  setTemplate('foo', compile("{{#link-to 'item' id='link3' current-when='item index'}}ITEM{{/link-to}}"));

  bootApplication();

  run(() => router.handleURL('/about'));

  equal(jQuery('#link1.active', '#qunit-fixture').length, 1, 'The link is active since current-when contains the parent route');

  run(() => router.handleURL('/item'));

  equal(jQuery('#link2.active', '#qunit-fixture').length, 1, 'The link is active since you are on the active route');

  run(() => router.handleURL('/foo'));

  equal(jQuery('#link3.active', '#qunit-fixture').length, 0, 'The link is not active since current-when does not contain the active route');
});
Example #4
0
QUnit.test('The non-block form {{link-to}} helper moves into the named route with context', function() {
  expect(5);

  Router.map(function(match) {
    this.route('item', { path: '/item/:id' });
  });

  App.IndexRoute = Route.extend({
    model() {
      return emberA([
        { id: 'yehuda', name: 'Yehuda Katz' },
        { id: 'tom', name: 'Tom Dale' },
        { id: 'erik', name: 'Erik Brynroflsson' }
      ]);
    }
  });

  setTemplate('index', compile("<h3>Home</h3><ul>{{#each model as |person|}}<li>{{link-to person.name 'item' person}}</li>{{/each}}</ul>"));
  setTemplate('item', compile("<h3>Item</h3><p>{{model.name}}</p>{{#link-to 'index' id='home-link'}}Home{{/link-to}}"));

  bootApplication();

  run(() => jQuery('li a:contains(Yehuda)', '#qunit-fixture').click());

  equal(jQuery('h3:contains(Item)', '#qunit-fixture').length, 1, 'The item template was rendered');
  equal(jQuery('p', '#qunit-fixture').text(), 'Yehuda Katz', 'The name is correct');

  run(() => jQuery('#home-link').click());

  equal(normalizeUrl(jQuery('li a:contains(Yehuda)').attr('href')), '/item/yehuda');
  equal(normalizeUrl(jQuery('li a:contains(Tom)').attr('href')), '/item/tom');
  equal(normalizeUrl(jQuery('li a:contains(Erik)').attr('href')), '/item/erik');
});
Example #5
0
QUnit.test('The {{link-to}} helper accepts string/numeric arguments', function() {
  Router.map(function() {
    this.route('filter', { path: '/filters/:filter' });
    this.route('post', { path: '/post/:post_id' });
    this.route('repo', { path: '/repo/:owner/:name' });
  });

  App.FilterController = Controller.extend({
    filter: 'unpopular',
    repo: EmberObject.create({ owner: 'ember', name: 'ember.js' }),
    post_id: 123
  });
  setTemplate('filter', compile('<p>{{filter}}</p>{{#link-to "filter" "unpopular" id="link"}}Unpopular{{/link-to}}{{#link-to "filter" filter id="path-link"}}Unpopular{{/link-to}}{{#link-to "post" post_id id="post-path-link"}}Post{{/link-to}}{{#link-to "post" 123 id="post-number-link"}}Post{{/link-to}}{{#link-to "repo" repo id="repo-object-link"}}Repo{{/link-to}}'));

  setTemplate('index', compile(' '));

  bootApplication();

  run(() => router.handleURL('/filters/popular'));

  equal(normalizeUrl(jQuery('#link', '#qunit-fixture').attr('href')), '/filters/unpopular');
  equal(normalizeUrl(jQuery('#path-link', '#qunit-fixture').attr('href')), '/filters/unpopular');
  equal(normalizeUrl(jQuery('#post-path-link', '#qunit-fixture').attr('href')), '/post/123');
  equal(normalizeUrl(jQuery('#post-number-link', '#qunit-fixture').attr('href')), '/post/123');
  equal(normalizeUrl(jQuery('#repo-object-link', '#qunit-fixture').attr('href')), '/repo/ember/ember.js');
});
Example #6
0
QUnit.test('`triggerEvent accepts an optional options hash and context', function() {
  expect(3);

  var triggerEvent, wait, event;

  App.IndexWrapperComponent = Component.extend({
    didInsertElement() {
      this.$('.input').on('keydown change', function(e) {
        event = e;
      });
    }
  });

  setTemplate('components/index-wrapper', compile('{{input type="text" id="outside-scope" class="input"}}<div id="limited">{{input type="text" id="inside-scope" class="input"}}</div>'));
  setTemplate('index', compile('{{index-wrapper}}'));

  run(App, App.advanceReadiness);

  triggerEvent = App.testHelpers.triggerEvent;
  wait         = App.testHelpers.wait;

  return wait()
    .then(function() {
      return triggerEvent('.input', '#limited', 'keydown', { keyCode: 13 });
    })
    .then(function() {
      equal(event.keyCode, 13, 'options were passed');
      equal(event.type, 'keydown', 'correct event was triggered');
      equal(event.target.getAttribute('id'), 'inside-scope', 'triggered on the correct element');
    });
});
  run(function() {
    App = Application.create({
      name: 'App',
      rootElement: '#qunit-fixture'
    });

    App.deferReadiness();

    registry = App.__registry__;
    container = App.__container__;

    registry.register('location:test', TestLocation);

    startingURL = expectedReplaceURL = expectedPushURL = '';

    App.Router.reopen({
      location: 'test'
    });

    App.LoadingRoute = Route.extend({
    });

    setTemplate('application', compile('{{outlet}}'));
    setTemplate('home', compile('<h3>Hours</h3>'));
  });
Example #8
0
QUnit.test('`triggerEvent can limit searching for a selector to a scope', function() {
  expect(2);

  var triggerEvent, wait, event;

  App.IndexWrapperComponent = Component.extend({

    didInsertElement() {
      this.$('.input').on('blur change', function(e) {
        event = e;
      });
    }
  });

  setTemplate('components/index-wrapper', compile('{{input type="text" id="outside-scope" class="input"}}<div id="limited">{{input type="text" id="inside-scope" class="input"}}</div>'));
  setTemplate('index', compile('{{index-wrapper}}'));

  run(App, App.advanceReadiness);

  triggerEvent = App.testHelpers.triggerEvent;
  wait         = App.testHelpers.wait;

  return wait().then(function() {
    return triggerEvent('.input', '#limited', 'blur');
  }).then(function() {
    equal(event.type, 'blur', 'correct event was triggered');
    equal(event.target.getAttribute('id'), 'inside-scope', 'triggered on the correct element');
  });
});
  QUnit.test('The {{link-to}} helper disregards query-params in activeness computation when current-when specified', function() {
    App.Router.map(function() {
      this.route('parent');
    });

    setTemplate('application', compile(
      "{{#link-to 'parent' (query-params page=1) current-when='parent' id='app-link'}}Parent{{/link-to}} {{outlet}}"));
    setTemplate('parent', compile(
      "{{#link-to 'parent' (query-params page=1) current-when='parent' id='parent-link'}}Parent{{/link-to}} {{outlet}}"));

    App.ParentController = Controller.extend({
      queryParams: ['page'],
      page: 1
    });

    bootApplication();
    equal(jQuery('#app-link').attr('href'), '/parent');
    shouldNotBeActive('#app-link');

    run(router, 'handleURL', '/parent?page=2');
    equal(jQuery('#app-link').attr('href'), '/parent');
    shouldBeActive('#app-link');
    equal(jQuery('#parent-link').attr('href'), '/parent');
    shouldBeActive('#parent-link');

    let parentController = container.lookup('controller:parent');
    equal(parentController.get('page'), 2);
    run(parentController, 'set', 'page', 3);
    equal(router.get('location.path'), '/parent?page=3');
    shouldBeActive('#app-link');
    shouldBeActive('#parent-link');

    jQuery('#app-link').click();
    equal(router.get('location.path'), '/parent');
  });
Example #10
0
QUnit.test('`triggerEvent` can be used to trigger arbitrary events', function() {
  expect(2);

  var triggerEvent, wait, event;

  App.IndexWrapperComponent = Component.extend({
    didInsertElement() {
      this.$('#foo').on('blur change', function(e) {
        event = e;
      });
    }
  });

  setTemplate('components/index-wrapper',  compile('{{input type="text" id="foo"}}'));
  setTemplate('index', compile('{{index-wrapper}}'));

  run(App, App.advanceReadiness);

  triggerEvent = App.testHelpers.triggerEvent;
  wait         = App.testHelpers.wait;

  return wait().then(function() {
    return triggerEvent('#foo', 'blur');
  }).then(function() {
    equal(event.type, 'blur', 'correct event was triggered');
    equal(event.target.getAttribute('id'), 'foo', 'triggered on the correct element');
  });
});
test('Components receive the top-level view as their ownerView', function(assert) {
  setTemplate('application', compile('{{outlet}}'));
  setTemplate('index', compile('{{my-component}}'));
  setTemplate('components/my-component', compile('<div></div>'));

  let component;

  boot(function() {
    appInstance.register('component:my-component', Component.extend({
      init() {
        this._super();
        component = this;
      }
    }));
  });

  // Theses tests are intended to catch a regression where the owner view was
  // not configured properly. Future refactors may break these tests, which
  // should not be considered a breaking change to public APIs.
  let ownerView = component.ownerView;
  assert.ok(ownerView, 'owner view was set');
  assert.ok(ownerView instanceof OutletView, 'owner view has no parent view');
  assert.notStrictEqual(component, ownerView, 'owner view is not itself');

  assert.ok(ownerView._outlets, 'owner view has an internal array of outlets');
});
function setupExample() {
  // setup templates
  setTemplate('application', compile('{{outlet}}'));
  setTemplate('index', compile('<h1>Node 1</h1>'));
  setTemplate('posts', compile('<h1>Node 1</h1>'));

  App.Router.map(function() {
    this.route('posts');
  });
}
Example #13
0
    run(() => {
      sharedSetup();

      setTemplate('app', compile('{{outlet}}'));
      setTemplate('index', compile(`<h3>Home</h3>{{#link-to 'about' id='about-link'}}About{{/link-to}}{{#link-to 'index' id='self-link'}}Self{{/link-to}}`));
      setTemplate('about', compile(`<h3>About</h3>{{#link-to 'index' id='home-link'}}Home{{/link-to}}{{#link-to 'about' id='self-link'}}Self{{/link-to}}`));
      setTemplate('item', compile(`<h3>Item</h3><p>{{model.name}}</p>{{#link-to 'index' id='home-link'}}Home{{/link-to}}`));

      appInstance.unregister('router:main');
      appInstance.register('router:main', Router);
    });
Example #14
0
    run(function() {
      indexHitCount = 0;

      App = EmberApplication.create({
        rootElement: '#ember-testing'
      });

      App.Router.map(function() {
        this.route('posts');
        this.route('comments');

        this.route('abort_transition');

        this.route('redirect');
      });

      App.IndexRoute = EmberRoute.extend({
        model() {
          indexHitCount += 1;
        }
      });

      App.PostsRoute = EmberRoute.extend({
        renderTemplate() {
          currentRoute = 'posts';
          this._super(...arguments);
        }
      });

      setTemplate('posts', compile('<div class="posts-view"><a class="dummy-link"></a><div id="comments-link">{{#link-to \'comments\'}}Comments{{/link-to}}</div></div>'));

      App.CommentsRoute = EmberRoute.extend({
        renderTemplate() {
          currentRoute = 'comments';
          this._super(...arguments);
        }
      });

      setTemplate('comments', compile('<div>{{input type="text"}}</div>'));

      App.AbortTransitionRoute = EmberRoute.extend({
        beforeModel(transition) {
          transition.abort();
        }
      });

      App.RedirectRoute = EmberRoute.extend({
        beforeModel() {
          this.transitionTo('comments');
        }
      });

      App.setupForTesting();
    });
QUnit.test('the default resolver looks up templates in Ember.TEMPLATES', function() {
  let fooTemplate = compile('foo template');
  let fooBarTemplate = compile('fooBar template');
  let fooBarBazTemplate = compile('fooBar/baz template');

  setTemplate('foo', fooTemplate);
  setTemplate('fooBar', fooBarTemplate);
  setTemplate('fooBar/baz', fooBarBazTemplate);

  equal(locator.lookupFactory('template:foo'), fooTemplate, 'resolves template:foo');
  equal(locator.lookupFactory('template:fooBar'), fooBarTemplate, 'resolves template:foo_bar');
  equal(locator.lookupFactory('template:fooBar.baz'), fooBarBazTemplate, 'resolves template:foo_bar.baz');
});
test('the default resolver looks up templates in Ember.TEMPLATES', function() {
  function fooTemplate() {}
  function fooBarTemplate() {}
  function fooBarBazTemplate() {}

  setTemplate('foo', fooTemplate);
  setTemplate('fooBar', fooBarTemplate);
  setTemplate('fooBar/baz', fooBarBazTemplate);

  equal(locator.lookup('template:foo'), fooTemplate, 'resolves template:foo');
  equal(locator.lookup('template:fooBar'), fooBarTemplate, 'resolves template:foo_bar');
  equal(locator.lookup('template:fooBar.baz'), fooBarBazTemplate, 'resolves template:foo_bar.baz');
});
  QUnit.test('The {{link-to}} with only query params always transitions to the current route with the query params applied', function() {
    // Test harness for bug #12033

    setTemplate('cars', compile(
      "{{#link-to 'cars.create' id='create-link'}}Create new car{{/link-to}} " +
      "{{#link-to (query-params page='2') id='page2-link'}}Page 2{{/link-to}}" +
      '{{outlet}}'
    ));

    setTemplate('cars/create', compile(
      "{{#link-to 'cars' id='close-link'}}Close create form{{/link-to}}"
    ));

    Router.map(function() {
      this.route('cars', function() {
        this.route('create');
      });
    });

    App.CarsController = Controller.extend({
      queryParams: ['page'],
      page: 1
    });

    bootApplication();

    var carsController = container.lookup('controller:cars');

    run(function() {
      router.handleURL('/cars/create');
    });

    run(function() {
      equal(router.currentRouteName, 'cars.create');
      jQuery('#close-link').click();
    });

    run(function() {
      equal(router.currentRouteName, 'cars.index');
      equal(router.get('url'), '/cars');
      equal(carsController.get('page'), 1, 'The page query-param is 1');
      jQuery('#page2-link').click();
    });

    run(function() {
      equal(router.currentRouteName, 'cars.index', 'The active route is still cars');
      equal(router.get('url'), '/cars?page=2', 'The url has been updated');
      equal(carsController.get('page'), 2, 'The query params have been updated');
    });
  });
QUnit.test('Components without a block should have the proper content when a template is provided', function() {
  setTemplate('application', compile('<div id=\'wrapper\'>{{my-component}}</div>'));
  setTemplate('components/my-component', compile('{{text}}'));

  boot(() => {
    appInstance.register('controller:application', Controller.extend({
      'text': 'outer'
    }));

    appInstance.register('component:my-component', Component.extend({
      text: 'inner'
    }));
  });

  equal(jQuery('#wrapper').text(), 'inner', 'The component is composed correctly');
});
Example #19
0
QUnit.test('`triggerEvent` with mouseenter triggers native events with simulated X/Y coordinates', function() {
  expect(5);

  var triggerEvent, wait, evt;

  App.IndexWrapperComponent = Component.extend({
    classNames: 'index-wrapper',

    didInsertElement() {
      this.element.addEventListener('mouseenter', e => evt = e);
    }
  });


  setTemplate('index', compile('{{#index-wrapper}}some text{{/index-wrapper}}'));

  run(App, App.advanceReadiness);

  triggerEvent = App.testHelpers.triggerEvent;
  wait  = App.testHelpers.wait;

  return wait().then(function() {
    return triggerEvent('.index-wrapper', 'mouseenter');
  }).then(function() {
    ok(evt instanceof window.Event, 'The event is an instance of MouseEvent');
    ok(typeof evt.screenX === 'number' && evt.screenX > 0, 'screenX is correct');
    ok(typeof evt.screenY === 'number' && evt.screenY > 0, 'screenY is correct');
    ok(typeof evt.clientX === 'number' && evt.clientX > 0, 'clientX is correct');
    ok(typeof evt.clientY === 'number' && evt.clientY > 0, 'clientY is correct');
  });
});
  QUnit.test('The {{link-to}} helper applies active class to parent route', function() {
    App.Router.map(function() {
      this.route('parent', function() {
        this.route('child');
      });
    });

    setTemplate('application', compile(
      "{{#link-to 'parent' id='parent-link'}}Parent{{/link-to}} " +
      "{{#link-to 'parent.child' id='parent-child-link'}}Child{{/link-to}} " +
      "{{#link-to 'parent' (query-params foo=cat) id='parent-link-qp'}}Parent{{/link-to}} " +
      '{{outlet}}'
    ));

    App.ParentChildController = Controller.extend({
      queryParams: ['foo'],
      foo: 'bar'
    });

    bootApplication();
    shouldNotBeActive('#parent-link');
    shouldNotBeActive('#parent-child-link');
    shouldNotBeActive('#parent-link-qp');
    run(router, 'handleURL', '/parent/child?foo=dog');
    shouldBeActive('#parent-link');
    shouldNotBeActive('#parent-link-qp');
  });
  QUnit.test('The {{link-to}} applies active class when query-param is array', function() {
    setTemplate('index', compile(
      "{{#link-to (query-params pages=pagesArray) id='array-link'}}Index{{/link-to}} " +
      "{{#link-to (query-params pages=biggerArray) id='bigger-link'}}Index{{/link-to}} " +
      "{{#link-to (query-params pages=emptyArray) id='empty-link'}}Index{{/link-to}} "
    ));

    App.IndexController = Controller.extend({
      queryParams: ['pages'],
      pages: [],
      pagesArray: [1, 2],
      biggerArray: [1, 2, 3],
      emptyArray: []
    });

    bootApplication();

    shouldNotBeActive('#array-link');
    run(router, 'handleURL', '/?pages=%5B1%2C2%5D');
    shouldBeActive('#array-link');
    shouldNotBeActive('#bigger-link');
    shouldNotBeActive('#empty-link');
    run(router, 'handleURL', '/?pages=%5B2%2C1%5D');
    shouldNotBeActive('#array-link');
    shouldNotBeActive('#bigger-link');
    shouldNotBeActive('#empty-link');
    run(router, 'handleURL', '/?pages=%5B1%2C2%2C3%5D');
    shouldBeActive('#bigger-link');
    shouldNotBeActive('#array-link');
    shouldNotBeActive('#empty-link');
  });
Example #22
0
test('invoking `{{view}} from a non-view backed (aka only template) template provides the correct controller to the view instance`', function(assert) {
  var controllerInMyFoo, indexController;

  setTemplate('index', compile('{{view "my-foo"}}', { moduleName: 'my-foo' }));

  registry.register('view:my-foo', EmberView.extend({
    init() {
      this._super(...arguments);

      controllerInMyFoo = this.get('controller');
    }
  }));

  registry.register('controller:index', Controller.extend({
    init() {
      this._super(...arguments);

      indexController = this;
    }
  }));

  run(App, 'advanceReadiness');
  handleURL('/');

  assert.strictEqual(controllerInMyFoo, indexController, 'controller is provided to `{{view}}`');
});
Example #23
0
QUnit.test('`fillIn` fires `input` and `change` events in the proper order', function() {
  expect(1);

  var fillIn, visit, andThen, wait;
  var events = [];
  App.IndexController = Controller.extend({
    actions: {
      oninputHandler(e) {
        events.push(e.type);
      },
      onchangeHandler(e) {
        events.push(e.type);
      }
    }
  });

  setTemplate('index', compile('<input type="text" id="first" oninput={{action "oninputHandler"}} onchange={{action "onchangeHandler"}}>'));

  run(App, App.advanceReadiness);

  fillIn = App.testHelpers.fillIn;
  visit = App.testHelpers.visit;
  andThen = App.testHelpers.andThen;
  wait = App.testHelpers.wait;

  visit('/');
  fillIn('#first', 'current value');
  andThen(function() {
    deepEqual(events, ['input', 'change'], '`input` and `change` events are fired in the proper order');
  });

  return wait();
});
Example #24
0
QUnit.test('{{render}} works with dot notation', function() {
  var template = '{{render "blog.post"}}';

  var ContextController = EmberController.extend();
  var contextController = ContextController.create({
    [OWNER]: appInstance
  });

  var controller;
  var id = 0;
  var BlogPostController = EmberController.extend({
    init() {
      this._super(...arguments);
      controller = this;
      this.uniqueId = id++;
    }
  });
  appInstance.register('controller:blog.post', BlogPostController);

  view = EmberView.create({
    [OWNER]: appInstance,
    controller: contextController,
    template: compile(template)
  });

  setTemplate('blog.post', compile('{{uniqueId}}'));

  runAppend(view);

  var singletonController = appInstance.lookup('controller:blog.post');
  equal(singletonController.uniqueId, view.$().html(), 'rendered with correct singleton controller');
});
Example #25
0
QUnit.test('{{render}} helper should render with given controller', function() {
  var template = '{{render "home" controller="posts"}}';
  var Controller = EmberController.extend();
  let model = {};
  let controller = Controller.create({
    [OWNER]: appInstance
  });
  var id = 0;

  appInstance.register('controller:posts', EmberController.extend({
    init() {
      this._super(...arguments);
      this.uniqueId = id++;
      this.set('model', model);
    }
  }));

  view = EmberView.create({
    [OWNER]: appInstance,
    controller,
    template: compile(template)
  });

  setTemplate('home', compile('{{uniqueId}}'));

  runAppend(view);

  let renderedController = appInstance.lookup('controller:posts');
  let uniqueId = renderedController.get('uniqueId');
  let renderedModel = renderedController.get('model');
  equal(uniqueId, 0, 'precond - first uniqueId is used for singleton');
  equal(uniqueId, view.$().html(), 'rendered with singleton controller');
  equal(renderedModel, model, 'rendered with model on controller');
});
Example #26
0
QUnit.test('The {{link-to}} helper refreshes href element when one of params changes', function() {
  Router.map(function() {
    this.route('post', { path: '/posts/:post_id' });
  });

  let post = EmberObject.create({ id: '1' });
  let secondPost = EmberObject.create({ id: '2' });

  setTemplate('index', compile('{{#link-to "post" post id="post"}}post{{/link-to}}'));

  App.IndexController = Controller.extend();
  let indexController = appInstance.lookup('controller:index');

  run(() => indexController.set('post', post));

  bootApplication();

  run(() => router.handleURL('/'));

  equal(normalizeUrl(jQuery('#post', '#qunit-fixture').attr('href')), '/posts/1', 'precond - Link has rendered href attr properly');

  run(() => indexController.set('post', secondPost));

  equal(jQuery('#post', '#qunit-fixture').attr('href'), '/posts/2', 'href attr was updated after one of the params had been changed');

  run(() => indexController.set('post', null));

  equal(jQuery('#post', '#qunit-fixture').attr('href'), '#', 'href attr becomes # when one of the arguments in nullified');
});
Example #27
0
    .each(function() {
    // Get a reference to the script tag.
    var script = jQuery(this);

    // Get the name of the script, used by Ember.View's templateName property.
    // First look for data-template-name attribute, then fall back to its
    // id if no name is found.
    var templateName = script.attr('data-template-name') || script.attr('id') || 'application';
    var template, compile;

    if (script.attr('type') === 'text/x-raw-handlebars') {
      compile = jQuery.proxy(Handlebars.compile, Handlebars);
      template = compile(script.html());
    } else {
      template = htmlbarsCompile(script.html(), {
        moduleName: templateName
      });
    }

    // Check if template of same name already exists.
    if (hasTemplate(templateName)) {
      throw new EmberError('Template named "' + templateName  + '" already exists.');
    }

    // For templates which have a name, we save them and then remove them from the DOM.
    registerTemplate(templateName, template);

    // Remove script tag from DOM.
    script.remove();
  });
Example #28
0
/**
@module ember
@submodule ember-templates
*/

/**
  Find templates stored in the head tag as script tags and make them available
  to `Ember.CoreView` in the global `Ember.TEMPLATES` object.

  Script tags with `text/x-handlebars` will be compiled
  with Ember's template compiler and are suitable for use as a view's template.

  @private
  @method bootstrap
  @for Ember.HTMLBars
  @static
  @param ctx
*/
function bootstrap(context = document) {
  let selector = 'script[type="text/x-handlebars"]';

  let elements = context.querySelectorAll(selector);

  for (let i = 0; i < elements.length; i++) {
    let script = elements[i];

    // Get the name of the script
    // First look for data-template-name attribute, then fall back to its
    // id if no name is found.
    let templateName = script.getAttribute('data-template-name') || script.getAttribute('id') || 'application';
    let template;

    template = compile(script.innerHTML, {
      moduleName: templateName
    });

    // Check if template of same name already exists.
    if (hasTemplate(templateName)) {
      throw new EmberError('Template named "' + templateName  + '" already exists.');
    }

    // For templates which have a name, we save them and then remove them from the DOM.
    registerTemplate(templateName, template);

    // Remove script tag from DOM.
    script.parentNode.removeChild(script);
  }
}
Example #29
0
QUnit.test('{{render}} helper with a supplied model should not fire observers on the controller', function () {
  var template = '<h1>HI</h1>{{render \'post\' post}}';
  var post = {
    title: 'Rails is omakase'
  };
  let controller = EmberController.create({
    [OWNER]: appInstance,
    post: post
  });

  expectDeprecation(() => {
    view = EmberView.create({
      [OWNER]: appInstance,
      controller,
      template: compile(template)
    });
  }, /Please refactor [\w\{\}"` ]+ to a component/);

  var PostController = EmberController.extend({
    modelDidChange: observer('model', function() {
      modelDidChange++;
    })
  });

  appInstance.register('controller:post', PostController);

  setTemplate('post', compile('<p>{{title}}</p>'));

  var modelDidChange = 0;
  runAppend(view);
  equal(modelDidChange, 0, 'model observer did not fire');
});
Example #30
0
QUnit.test('`fillIn` focuses on the element', function() {
  expect(2);
  var fillIn, find, visit, andThen, wait;

  App.ApplicationRoute = Route.extend({
    actions: {
      wasFocused() {
        ok(true, 'focusIn event was triggered');
      }
    }
  });

  setTemplate('index', compile('<div id="parent">{{input type="text" id="first" focus-in="wasFocused"}}</div>'));

  run(App, App.advanceReadiness);

  fillIn = App.testHelpers.fillIn;
  find = App.testHelpers.find;
  visit = App.testHelpers.visit;
  andThen = App.testHelpers.andThen;
  wait = App.testHelpers.wait;

  visit('/');
  fillIn('#first', 'current value');
  andThen(function() {
    equal(find('#first').val(), 'current value');
  });

  return wait();
});