Let's say we have a component that yields out block params, and we want to write tests to check those block params.

<MyForm as |data|>
  {{! I want to write assertions against `data` }}
</MyForm>

One way to do this would be to render out data and write assertions using QUnit DOM. While this works in some cases, this would be tedious if there are lots of properties in data that I want to check.

As of Ember 4.5, plain old functions can be used as helpers. With this, we can write a function in our test and use it as a helper so that we can use standard QUnit assertions on block params without rendering the block params.

module("Integration | Component | my-form", function (hooks) {
  setupRenderingTest(hooks);

  test("it renders", async function (assert) {
    this.assertData = data => {
      assert.deepEqual(data, {
        foo: {
          bar: "Ember.js",
        },
      });
    };

    await render(hbs`
      <MyForm as |data|>
        {{this.assertData data}}
      </MyForm>
    `);
  });
});

This technique was helpful in the test above since it allowed me to use QUnit's deepEqual on the block param. The alternative would have been to render out all of the properties in data and write QUnit DOM assertions, which seems tedious. Also, if I wanted my test to be thorough, I'd have to ensure that all properties in data are rendered, resulting in more template logic.

This technique could have also been helpful if I had wanted to test for strict equality on the block param using QUnit's strictEqual, which wouldn't be possible had I rendered out the data and using a QUnit DOM assertion.