{"action":"created","issue":{"url":"https://api.github.com/repos/ember-cli/ember-cli-qunit/issues/33","labels_url":"https://api.github.com/repos/ember-cli/ember-cli-qunit/issues/33/labels{/name}","comments_url":"https://api.github.com/repos/ember-cli/ember-cli-qunit/issues/33/comments","events_url":"https://api.github.com/repos/ember-cli/ember-cli-qunit/issues/33/events","html_url":"https://github.com/ember-cli/ember-cli-qunit/pull/33","id":56077237,"number":33,"title":"Improved test runner ui - Moves preview window side-by-side with tests","user":{"login":"kategengler","id":444218,"avatar_url":"https://avatars.githubusercontent.com/u/444218?v=3","gravatar_id":"","url":"https://api.github.com/users/kategengler","html_url":"https://github.com/kategengler","followers_url":"https://api.github.com/users/kategengler/followers","following_url":"https://api.github.com/users/kategengler/following{/other_user}","gists_url":"https://api.github.com/users/kategengler/gists{/gist_id}","starred_url":"https://api.github.com/users/kategengler/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kategengler/subscriptions","organizations_url":"https://api.github.com/users/kategengler/orgs","repos_url":"https://api.github.com/users/kategengler/repos","events_url":"https://api.github.com/users/kategengler/events{/privacy}","received_events_url":"https://api.github.com/users/kategengler/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-01-30T19:55:38Z","updated_at":"2015-02-14T23:25:24Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/ember-cli/ember-cli-qunit/pulls/33","html_url":"https://github.com/ember-cli/ember-cli-qunit/pull/33","diff_url":"https://github.com/ember-cli/ember-cli-qunit/pull/33.diff","patch_url":"https://github.com/ember-cli/ember-cli-qunit/pull/33.patch"},"body":"I've been attempting to improve the test runner in `ember-cli` so that its less annoying. I've had problems with modals blocking out the test runner and with styles from my app affecting QUnit and vice versa. This is my least hacky attempt, by far, and I hope someone can push me in the right direction to make it even better. \r\n\r\nThis pr makes the app container an iframe and give's half the screen to the runner and half to the app container.  An example:\r\n\r\n![Image of improved runner](https://www.dropbox.com/s/nz3suhf2mxph4m9/Screenshot%202015-01-30%2014.27.36.png?dl=1)\r\n\r\nContrasted with before:\r\n![Image of before improvement](https://www.dropbox.com/s/mbiyfl591pccmwb/Screenshot%202015-01-30%2014.54.43.png?dl=1)\r\n\r\nIn addition to the code in this pr, in my app, in `startApp`, I had to do this to set my app's `rootElement` to the iframe's body:\r\n```js\r\n  attributes.rootElement = document.getElementById('ember-testing-container').contentWindow.document.body;\r\n```\r\nIs there a way this can be done from `ember-cli-qunit`? \r\n\r\nTo get the styles available in the app container iframe, it's coping the entire `head` of the main test index.html into the iframe as the `head`. To me this is pretty questionable and I hope we can find another solution. \r\n\r\nLimitations: \r\n* The app css still affects the look of the runner. You may notice in my screenshot that the QUnit options at the top look different than normal, it's because generic elements are styled in a framework my app is using."},"comment":{"url":"https://api.github.com/repos/ember-cli/ember-cli-qunit/issues/comments/74396544","html_url":"https://github.com/ember-cli/ember-cli-qunit/pull/33#issuecomment-74396544","issue_url":"https://api.github.com/repos/ember-cli/ember-cli-qunit/issues/33","id":74396544,"user":{"login":"krisselden","id":61024,"avatar_url":"https://avatars.githubusercontent.com/u/61024?v=3","gravatar_id":"","url":"https://api.github.com/users/krisselden","html_url":"https://github.com/krisselden","followers_url":"https://api.github.com/users/krisselden/followers","following_url":"https://api.github.com/users/krisselden/following{/other_user}","gists_url":"https://api.github.com/users/krisselden/gists{/gist_id}","starred_url":"https://api.github.com/users/krisselden/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/krisselden/subscriptions","organizations_url":"https://api.github.com/users/krisselden/orgs","repos_url":"https://api.github.com/users/krisselden/repos","events_url":"https://api.github.com/users/krisselden/events{/privacy}","received_events_url":"https://api.github.com/users/krisselden/received_events","type":"User","site_admin":false},"created_at":"2015-02-14T23:25:24Z","updated_at":"2015-02-14T23:25:24Z","body":"Using a frame may cause other issues, does it affect event delegate? does using a frame without an origin cause cross domain issues?  Maybe it would be better to put the app code and styles into a separate html that loads in the frame?"}}