ember-pickr makes our test suite brittle

[tschoartschi]

Hey!

We just encountered that our tests which rely or render ember-pickr are brittle. We think this happens because pickr.min.js is instantiated within a requestAnimationFrame and in combination with the default parameter different timings can happen. Therefore our test suite sometimes pass and sometimes not.

I'm not sure if it's a ember-pickr issue or something else. Also I do not know how to work around it. Would be great if someone could help us 😃

Here is the stacktrace from the test:

[astronomersiva]

Hi @tschoartschi, thanks for the detailed issue write-up! Could you also help with a dummy repo with a sample test so that I can look into this?

[tschoartschi]

@astronomersiva I'll try to create one 😃 I'm not sure if I can create a reproduction because it's a timing issue. We discussed the issue in Discord as well and we thought that maybe it's a problem on the following line:

ember-pickr/addon/components/color-picker.js

Line 86 in 43a9808

this.set('_value', this.formatColor(this._pickr.getColor()));

Because of this.set is called after requestAnimationFrame the timing is not consistent and it can happen that the default param overrides an already set property.

I'm not sure if it's an issue with ember-pickr or if the ember test runner should be aware of requestAnimationFrame. Because in our test file:

        await render(hbs`
        <Some::Form::With::A::Colorpicker
            @model={{this.data}}
            @update={{this.update}}
        />`);

Because await render does not wait for ember-pickr this timing problems arise.

[tschoartschi]

@astronomersiva I tried to create a repo which has similar problems like we have. I'm not sure if it's really the same as with our code but it behaves definitely the same. It's super hard to create a repo with a reproduction because it's a timing issue and I'm also not 100% sure what causes the timing problems. You can have a look here:

https://github.com/tschoartschi/ember-pickr-test-issues

The following screencast should show how it behaves:

https://github.com/tschoartschi/ember-pickr-test-issues/blob/master/pickr.mov

[astronomersiva]

Thanks a lot @tschoartschi, that video helped me understand what this is about. I've been encountering this as well. Let me try and fix this 👍

[tschoartschi]

@astronomersiva cool 😎in case you need more information let me know. Maybe we need to write a test helper or something. I'm not sure what the best solution is but if you need something just reach out.

[astronomersiva]

Yes, this addon needs to expose a test waiter so that ember-test-helpers's wait is aware of this addon's behaviour. vertical-collection does something similar.

[tschoartschi]

Just wanted to follow up. Do you think this will be easy to fix, since we have some template from vertical-collection or do you need some help?

[tschoartschi]

@astronomersiva any update on this issue or do you need help?

[astronomersiva]

@tschoartschi, sorry I have been held up with some work of late. Would certainly appreciate help with this!