Интеграционные тесты Ember: `link-to` href empty

Я пытаюсь написать тест интеграции компонентов, как этот пост в блоге, но мой компонент имеет link-to к динамическому маршруту и ​​тому href свойство не заполняется. Вот упрощенная версия того, что я пытаюсь сделать.

Шаблон моего компонента:

{{#link-to "myModel" model}}

И вот соответствующая часть моего теста:

this.set('model', {
  id: 'myId',
  name: 'My Name'
});

this.render(hbs`
{{my-component model=model}}
`);

assert.equal(this.$('a').attr('href'), '/myModel/myId'); // fails

link-to отображается только без href приписывать. Если я регистрирую HTML в тесте, это выглядит так:

<a id="ember283" class="ember-view">My Name</a>

Есть ли что-то, что мне нужно сделать с моей "моделью", чтобы получить link-to иметь HREF? Я пытался посмотреть на тесты для link-to в Ember, и нашел эту часть тестов, что в основном то, что я делаю - предоставить POJO с id набор ключей. Есть идеи?

Редактировать:

DEBUG: -------------------------------
DEBUG: Ember      : 1.13.8
DEBUG: Ember Data : 1.13.10
DEBUG: jQuery     : 1.11.3
DEBUG: -------------------------------

3 ответа

Решение

Оказывается, вы можете просто найти маршрутизатор и сказать ему, чтобы он начал маршрутизацию в вашей тестовой настройке, и он будет работать. Из этого коммита от @rwjblue:

// tests/helpers/setup-router.js

export default function({ container }) {
  const router = container.lookup('router:main');
  router.startRouting(true);
}


// tests/integration/components/my-component-test.js

import { moduleForComponent, test } from 'ember-qunit';
import hbs from 'htmlbars-inline-precompile';
import setupRouter from '../../helpers/setup-router';

moduleForComponent('my-component', 'Integration | Component | my component', {
  integration: true,
  setup() {
    setupRouter(this);
  }
});

Вот как это сделать в Ember > 3

import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';

module('Integration | Component | my-component', function (hooks) {
  setupRenderingTest(hooks);

  test('it has a link', async function (assert) {
    this.owner.lookup('router:main').setupRouter();
    await render(hbs`{{my-component}}`);
    assert.equal(this.element.querySelector('a').getAttribute('href'), 'some-url');
  });
});

Если вы просто хотите проверить href хорошо, это может быть лучше использовать setupRouter вместо startRouting, startRouting пытается обработать начальный переход к начальному URL, и это может быть проблематично.

// tests/helpers/setup-router.js
export default function({ container }) {
const router = container.lookup('router:main');
   router.setupRouter();
}

https://github.com/emberjs/ember.js/blob/d487061228a966d8aac6fa94a8d69abfc3f1f257/packages/ember-routing/lib/system/router.js#L202

Какую версию Ember вы используете? Я помню, как видел это раньше, и теперь, похоже, работает в моем приложении (хотя я использую 1.13.8).

Кажется, что я добавляю href в мое приложение, и на основе этого вычисленного свойства оно должно быть привязано к представлению, если tagName это".

Помимо обновления Ember, вероятно, лучше создать ember-fiddle или repro и сообщить об ошибке, если она не исчезнет.

Вы также можете посмотреть на https://github.com/intercom/ember-href-to.

Другие вопросы по тегам