Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Setting same properties name causing tests fail #430

Open
brunoocasali opened this issue Sep 5, 2019 · 5 comments

Comments

@brunoocasali
Copy link

@brunoocasali brunoocasali commented Sep 5, 2019

Hello everyone!

After digging into an annoying problem I discovered what is causing the bugs in valid tests...
I think after we use a property name this name is invalid to be used again...

This is the helper code:

import { helper } from '@ember/component/helper';

export default helper(function truncateText([ value ], { limit }) {
  let text = '';

  if (value != null && value.length > 0) {
    text = value.substr(0, limit);

    if (value.length > limit) {
      text += '...';
    }
  }

  return text;
});

This is my helper test:

import { expect } from 'chai';
import { describe, it, beforeEach } from 'mocha';
import { setupRenderingTest } from 'ember-mocha';
import { render } from '@ember/test-helpers';

import hbs from 'htmlbars-inline-precompile';

describe('TruncateTextHelper', async function() {
  setupRenderingTest();

  beforeEach(function() {
    this.set('text', 'my awesome but very large text!!');
  });

  it('does truncate text when is greater than limit', async function() {
    await render(hbs`{{truncate-text this.text limit=10}}`);

    expect(this.element.textContent).to.be.include('my awesome...');
  });

  it('does not truncate text when lower than limit', async function() {
    await render(hbs`{{truncate-text this.text limit=100}}`);

    expect(this.element.textContent).to.be.include('my awesome but very large text!!');
  });
});

If I remove the beforeEach, and pass the same property directly the problem still happens

describe('TruncateTextHelper', async function() {
  setupRenderingTest();

  it('does truncate text when is greater than limit', async function() {
    this.set('text', 'my awesome but very large text!!');

    await render(hbs`{{truncate-text this.text limit=10}}`);

    expect(this.element.textContent).to.be.include('my awesome...');
  });

  it('does not truncate text when lower than limit', async function() {
    this.set('text', 'my awesome but very large text!!');

    await render(hbs`{{truncate-text this.text limit=100}}`);

    expect(this.element.textContent).to.be.include('my awesome but very large text!!');
  });
});

This is the error:
image

Logging the properties, we got the "my awesome but very large text!!" for the first occurrence and undefined for the second.

If I change the name of the last property from text to something it works!

I've provided a little package with the failing specs: https://github.com/brunoocasali/bookish-octo-garbanzo/blob/master/tests/integration/helpers/truncate-text-test.js

@efx

This comment has been minimized.

Copy link

@efx efx commented Sep 30, 2019

@brunoocasali what version of ember-source do you see this on?

@brunoocasali

This comment has been minimized.

Copy link
Author

@brunoocasali brunoocasali commented Sep 30, 2019

@efx I'm using the latest canary :)

Exactly the same version that breaks in the CI

@simonihmig

This comment has been minimized.

Copy link
Contributor

@simonihmig simonihmig commented Oct 4, 2019

I can confirm this, seeing it with Ember 3.13!

@HenryVonfire

This comment has been minimized.

Copy link

@HenryVonfire HenryVonfire commented Oct 11, 2019

I've found out that setting the property without set works, like this:

  beforeEach(function() {
    this.text = 'my awesome but very large text!!';
  });

  it('does truncate text when is greater than limit', async function() {
    await render(hbs`{{truncate-text this.text limit=10}}`);

    expect(this.element.textContent).to.be.include('my awesome...');
  });

  it('does not truncate text when lower than limit', async function() {
    await render(hbs`{{truncate-text this.text limit=100}}`);

    expect(this.element.textContent).to.be.include('my awesome but very large text!!');
  });
@efx

This comment has been minimized.

Copy link

@efx efx commented Oct 17, 2019

FWIW, I have verified this doesn't happen in ember-qunit's setupRenderingTest: https://github.com/emberjs/ember-qunit/compare/master...efx:bump-ember-and-test?expand=1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
4 participants
You can’t perform that action at this time.