emberjs / emberjs/ember-qunit

test-support styles causes component tests to fail

Open
#521 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
258
Forks
156
PR merge metrics
No merged PRs in 30d

Description

I have a component needs to get the parent element's `height` and `width` during its `didInsertElement` phase, so I set up a test case renders a template snippet:

``` javascript
await render(hbs`




`);
```

then I got a weird result like below:

![image](https://user-images.githubusercontent.com/1104018/61308747-78789180-a823-11e9-8925-59c1a7b84e48.png)

As we saw in this screenshot, the wrapper element renders only half of width and height compares to its styles, it causes the test to fail even its implementation is actually correct.

I found the root cause is the default styles in:

https://github.com/emberjs/ember-qunit/blob/633f7c2a44cc5559697ab767d59a91253e0fbe2c/vendor/ember-qunit/test-container-styles.css#L23-L25

but I'm not confident to remove it at all. I use this temporary solution currently:

``` javascript
await render(hbs`
// reset styles only for this test case:

#ember-testing { width: initial; height: initial; transform: initial; }




`);
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.