Not sure how to handle/fix "no-this-in-template-only-components"

[boris-petrov]

test('it renders', async function (assert) {
  this.set('foo', 420);
  await render(hbs`{{some-component foo=this.foo}}`);
});

This leads to:

Usage of 'this' in path 'this.foo' is not allowed in a template-only component. Use '@foo' if it is a named argument or create a component.js for this component. (fixable)ember-template-lint(no-this-in-template-only-components)

This doesn't make sense in this case.

cc @rwjblue @dwickern

[dwickern]

I wonder why I get different results. When I test using ember-bootstrap, the rule fails on this line since there is no file path:

/Users/dwickern/code/ember-bootstrap/tests/integration/components/bs-tab/pane-test.js
  13:18  error  1 error(s): The "path" argument must be of type string. Received undefined  hbs/check-hbs-template-literals
  27:18  error  1 error(s): The "path" argument must be of type string. Received undefined  hbs/check-hbs-template-literals
  49:18  error  1 error(s): The "path" argument must be of type string. Received undefined  hbs/check-hbs-template-literals

What hbs file path is being passed for you?

[boris-petrov]

You’ve hit this issue - #34. If you disable the hbs/... rule in ESLint you’ll start hitting this issue here, at least that’s what I saw in VSCode (not sure why it continued working in VSCode after I disabled the rule - perhaps because I didn’t restart it).