ember-qunit icon indicating copy to clipboard operation
ember-qunit copied to clipboard

Published 20 hours ago • verified publisher icon emberjs

App styles leak into QUnit test runner UI

Open broldak opened this issue 5 years ago • 8 comments

Because the test runner's UI and the UI of the rendered component/app are not isolated, the app styles leak into the QUnit test runner's UI. The example below shows a case where the inputs for Hide passed tests, Check for Globals, etc are rendered with no checkboxes due to some app styles. Screen Shot 2019-05-06 at 2 44 43 PM

Ideally QUnit's styles would not affect the rendered UI in the tests and vice versa.

broldak avatar May 06 '19 21:05 broldak

Thank you for reporting @broldak! I'm not 100% sure of the right solution here, but this is definitely quite annoying and we should try to figure out a good path forward.

rwjblue avatar May 14 '19 16:05 rwjblue

I addressed a similar problem with other styles leaking here https://github.com/qunitjs/qunit/pull/1395

mfeckie avatar Jun 20 '19 07:06 mfeckie

Hmm, @mfeckie do you think that this fixes the issue @broldak reported?

rwjblue avatar Jun 20 '19 19:06 rwjblue

@rwjblue I don't think it fixes the specific issue, but could be used as inspiration for an approach to resolve their issue

mfeckie avatar Jun 21 '19 00:06 mfeckie

Perhaps a combination of CSS all and CSS unset or CSS revert could be of use here. I'd be open to accepting such a patch in QUnit upstream.

Krinkle avatar Aug 01 '20 20:08 Krinkle

Thanks @Krinkle!

rwjblue avatar Aug 02 '20 16:08 rwjblue

Been quite a while, but the behavior still persists it seems. Any news on the issue?

spuxx-dev avatar Sep 13 '22 08:09 spuxx-dev

@spuxx1701 Which QUnit version do you see in the browser when you encounter this issue?

Krinkle avatar Sep 14 '22 10:09 Krinkle