# Can we have a "renderSync()" in ember-test-helpers?

**URL:** <https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348>\
**Category:** Testing\
**Created:** [August 24, 2018, 6:57am UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348 "2018-08-24T06:57:39Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![vothaison](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/vothaison/32/17013_2.png) [@vothaison](https://discuss.emberjs.com/u/vothaison)\
**Post date:** [August 24, 2018, 6:57am UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/1 "2018-08-24T06:57:39Z")

</div>

Probably a dumb question: Can we have a “renderSync()” in ember-test-helpers? (Or, can we make one?) But thanks in advance, everyone!

---

<div class="post-metadata">

**Author:** ![vothaison](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/vothaison/32/17013_2.png) [@vothaison](https://discuss.emberjs.com/u/vothaison)\
**Post date:** [August 24, 2018, 10:09am UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/2 "2018-08-24T10:09:17Z")

</div>

OK. I worked around that. QUnit has assert.async(); and render() returns Promise.

> ```
> _qunit.module('Integration | Component | the-component', function (hooks) {
> _emberQunit.setupRenderingTest(hooks);
> 
> _qunit.test('Display correct content', async function (assert) {
> var done = assert.async();
> var _self = this;
> 
> _testHelpers.render(hbs('{{the-component}}')).then(function () {
> assert.equal(_self.element.querySelector('div').innerText, ('actions'), 'Display correct content');
> done();
> });
> });
> });
> 
> ```

Hope this helps anyone still “love” working with IE like us.

---

<div class="post-metadata">

**Author:** ![NullVoxPopuli](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/nullvoxpopuli/32/18691_2.png) [@NullVoxPopuli](https://discuss.emberjs.com/u/NullVoxPopuli)\
**Post date:** [August 24, 2018, 10:44am UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/3 "2018-08-24T10:44:33Z")

</div>

What version of ember are you on?

You’re testing on IE?  
you have my sympathies

do the transpile targets not work with IE in testing?

in my version, (3.4/canary), I’d write it like this:

```auto
module('Integration | Component | the-component', function(hooks) {
  setupRenderingTest(hooks);

  test('Display correct content', async function(assert) {
    assert.expect(1);

    await render(hbs`{{the-component}}`);
     
    const text = this.element.querySelector('div').innerText;

    assert.equal(text, 'actions', 'Display correct content');
  });
});

```

---

<div class="post-metadata">

**Author:** ![ef4](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ef4/32/13470_2.png) [@ef4](https://discuss.emberjs.com/u/ef4)\
**Post date:** [August 24, 2018, 9:37pm UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/4 "2018-08-24T21:37:16Z")

</div>

The transpiled async/await version works in IE.

---

<div class="post-metadata">

**Author:** ![vothaison](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/vothaison/32/17013_2.png) [@vothaison](https://discuss.emberjs.com/u/vothaison)\
**Post date:** [August 28, 2018, 4:08am UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/5 "2018-08-28T04:08:50Z")

</div>

Thanks, guys.

We have been doing EmberJS without Ember CLI for a few years. Sorry I didn’t mention that in the question. We basically code Ember 1.1 with ember.js 3.x runtime.

So, the assessment is: Write unit tests that can run on IE11, without Ember CLI transpiling. But I am allowed to copy \dist\assets\test-support.js from a working Ember project.

---

<div class="post-metadata">

**Author:** ![ef4](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ef4/32/13470_2.png) [@ef4](https://discuss.emberjs.com/u/ef4)\
**Post date:** [August 28, 2018, 1:37pm UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/6 "2018-08-28T13:37:23Z")

</div>

In that case you can write out the promises longhand.

```nohighlight
module('Integration | Component | the-component', function(hooks) {
  setupRenderingTest(hooks);

  test('Display correct content', function(assert) {
    assert.expect(1);
    return render(hbs`{{the-component}}`).then(function() {
      var text = this.element.querySelector('div').innerText;
      assert.equal(text, 'actions', 'Display correct content');
    });
  });
});

```

`async` functions are just a nice shorthand for promises.

---

<div class="post-metadata">

**Author:** ![ef4](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/ef4/32/13470_2.png) [@ef4](https://discuss.emberjs.com/u/ef4)\
**Post date:** [August 28, 2018, 1:39pm UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/7 "2018-08-28T13:39:29Z")

</div>

Nevermind, I see above that you already figured that part out. 😛

What I’m wondering is how you got the `hbs` inline template compiler working without a any preprocessing.

---

<div class="post-metadata">

**Author:** ![vothaison](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/vothaison/32/17013_2.png) [@vothaison](https://discuss.emberjs.com/u/vothaison)\
**Post date:** [August 29, 2018, 4:36am UTC](https://discuss.emberjs.com/t/can-we-have-a-rendersync-in-ember-test-helpers/15348/8 "2018-08-29T04:36:24Z")

</div>

Hi Edward

Here is my hbs() function We have to include ember-template-compiler.js on the test page.

> ```
> function hbs(templateSrc) {
> return Ember.HTMLBars.template(JSON.parse(Ember.Handlebars.precompile(templateSrc)));
> }
> 
> ```

In the production environment, we use MSIE Script engine to execute Ember.Handlebars.precompile() to obtain the compiled template JSON. Other script engines like V8 or Jurassic also work.