-
Notifications
You must be signed in to change notification settings - Fork 109
Description
I've recently found that using the @tracked decorator is causing coverage issues. The odd thing is our project has many files containing @tracked, and yet only one particular file seems to be affected by this issue.
We're using:
"ember-cli": "3.24.0"
"ember-source": "3.24.7"
"ember-cli-code-coverage": "1.0.3"
"istanbul": "0.4.5"
The issue is that the line after the @tracked property will show as having no coverage. What's ever weirder is that if I /* istanbul ignore next */ the allegedly uncovered line, the ignore comment itself will show as being uncovered - and yet comments cannot have coverage.
Our project is private, so I can't link to it... but I've managed to reproduce the issue on an out-of-the-box 3.24.0 install, with the addition of the ember-cli-code-coverage and istanbul versions mentioned above.
If I generate the following class-backed component, add it to the application.hbs file, and then run COVERAGE=true ember s, opening the coverage report shows the constructor line as not having coverage - even though it has to have run in order for the test to pass.
covered-component.js:
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
export default class extends Component {
@tracked
foo = null;
constructor() {
super(...arguments);
this.foo = 'bar';
}
}covered-component.hbs:
this.foo: {{this.foo}}covered-component-test.js:
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { render } from '@ember/test-helpers';
import { hbs } from 'ember-cli-htmlbars';
module('Integration | Component | covered-component', function(hooks) {
setupRenderingTest(hooks);
test('it renders', async function(assert) {
await render(hbs`<CoveredComponent />`);
assert.equal(this.element.textContent.trim(), 'this.foo: bar');
});
});The coverage report for the code above shows this:

If I update the constructor line to be ignored...:
/* istanbul ignore next */
constructor() {
super(...arguments);
this.foo = 'bar';
}...re-running the tests and refreshing the coverage report shows the coverage comment is uncovered:

The only way I've found to prevent this issue is to put the ignore directive before the @tracked decorator, but we'd rather not do this on our project as it gives a false impression that covered code is not covered.
It's also worth noting that exactly the same behaviour happens if I update to "ember-cli-code-coverage": "2.0.2" - the same pink marks show in the reports in the same places.