From 877dc89ddb455c9eaa72d11ca14264faccdfe43c Mon Sep 17 00:00:00 2001 From: Austin Burdine Date: Sat, 6 Aug 2016 01:04:06 -0600 Subject: [PATCH] fix cross-browser support (#164) closes https://github.com/TryGhost/Ghost/issues/7149 - fix tests in Safari - fix template tag issue in IE and edge - various IE css fixes --- ghost/admin/app/components/gh-ed-preview.js | 9 ++++++ .../app/styles/components/splitbuttons.css | 1 + .../admin/app/styles/components/uploader.css | 1 + .../tests/acceptance/ghost-desktop-test.js | 30 +++++++++++-------- .../unit/components/gh-selectize-test.js | 4 +-- .../tests/unit/services/notifications-test.js | 4 +-- .../tests/unit/validators/nav-item-test.js | 6 ++-- .../unit/validators/slack-integration-test.js | 2 +- 8 files changed, 36 insertions(+), 21 deletions(-) diff --git a/ghost/admin/app/components/gh-ed-preview.js b/ghost/admin/app/components/gh-ed-preview.js index 5ffe25a20e..625566e6d8 100644 --- a/ghost/admin/app/components/gh-ed-preview.js +++ b/ghost/admin/app/components/gh-ed-preview.js @@ -55,6 +55,15 @@ export default Component.extend({ let template = document.createElement('template'); template.innerHTML = html; let fragment = template.content; + + if (!fragment) { + fragment = document.createDocumentFragment(); + + while (template.childNodes[0]) { + fragment.appendChild(template.childNodes[0]); + } + } + let dropzones = fragment.querySelectorAll('.js-drop-zone'); let components = this.get('imageUploadComponents'); diff --git a/ghost/admin/app/styles/components/splitbuttons.css b/ghost/admin/app/styles/components/splitbuttons.css index 33c6017e4a..9769fc0cb8 100644 --- a/ghost/admin/app/styles/components/splitbuttons.css +++ b/ghost/admin/app/styles/components/splitbuttons.css @@ -33,6 +33,7 @@ } .splitbtn .btn:first-child:not(:last-child):not(.dropdown-toggle) { + height: 31px; border-top-right-radius: 0; border-bottom-right-radius: 0; } diff --git a/ghost/admin/app/styles/components/uploader.css b/ghost/admin/app/styles/components/uploader.css index 67974824bc..6a43864bbd 100644 --- a/ghost/admin/app/styles/components/uploader.css +++ b/ghost/admin/app/styles/components/uploader.css @@ -10,6 +10,7 @@ margin: 1.6em 0; min-height: 130px; width: 100%; + height: 130px; background: #f6f7f8; border-radius: 4px; color: #808284; diff --git a/ghost/admin/tests/acceptance/ghost-desktop-test.js b/ghost/admin/tests/acceptance/ghost-desktop-test.js index 3b96f384c8..86329f494a 100644 --- a/ghost/admin/tests/acceptance/ghost-desktop-test.js +++ b/ghost/admin/tests/acceptance/ghost-desktop-test.js @@ -10,23 +10,27 @@ import startApp from '../helpers/start-app'; import destroyApp from '../helpers/destroy-app'; import { authenticateSession } from 'ghost-admin/tests/helpers/ember-simple-auth'; -const originalUserAgent = window.navigator.userAgent; +const originalAgent = window.navigator.userAgent; -const _setUserAgent = function (userAgent) { - let userAgentProp = {get() { return userAgent; }, configurable: true}; - Object.defineProperty(window.navigator, 'userAgent', userAgentProp); -}; +const setUserAgent = function (userAgent) { + let userAgentProp = { + get() { + return userAgent; + }, + configurable: true + }; -const stubUserAgent = function (userAgent) { - if (window.navigator.userAgent !== userAgent) { - _setUserAgent(userAgent); + try { + Object.defineProperty(window.navigator, 'userAgent', userAgentProp); + } catch (e) { + window.navigator = Object.create(window.navigator, { + userAgent: userAgentProp + }); } }; const restoreUserAgent = function () { - if (window.navigator.userAgent !== originalUserAgent) { - _setUserAgent(originalUserAgent); - } + setUserAgent(originalAgent); }; describe('Acceptance: Ghost Desktop', function() { @@ -55,7 +59,7 @@ describe('Acceptance: Ghost Desktop', function() { }); it('displays alert for broken version', function() { - stubUserAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) ghost-desktop/0.4.0 Chrome/51.0.2704.84 Electron/1.2.2 Safari/537.36'); + setUserAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) ghost-desktop/0.4.0 Chrome/51.0.2704.84 Electron/1.2.2 Safari/537.36'); visit('/'); @@ -67,7 +71,7 @@ describe('Acceptance: Ghost Desktop', function() { }); it('doesn\'t display alert for working version', function () { - stubUserAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) ghost-desktop/0.5.1 Chrome/51.0.2704.84 Electron/1.2.2 Safari/537.36'); + setUserAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) ghost-desktop/0.5.1 Chrome/51.0.2704.84 Electron/1.2.2 Safari/537.36'); visit('/'); diff --git a/ghost/admin/tests/unit/components/gh-selectize-test.js b/ghost/admin/tests/unit/components/gh-selectize-test.js index a9bdf30b82..896a99764f 100644 --- a/ghost/admin/tests/unit/components/gh-selectize-test.js +++ b/ghost/admin/tests/unit/components/gh-selectize-test.js @@ -31,8 +31,8 @@ describeComponent( component._selectize.setValue(['item 3', 'item 2']); }); - expect(component.get('value'), 'component value').to.deep.equal(['item 3', 'item 2']); - expect(component.get('selection'), 'component selection').to.deep.equal(['item 3', 'item 2']); + expect(component.get('value').toArray(), 'component value').to.deep.equal(['item 3', 'item 2']); + expect(component.get('selection').toArray(), 'component selection').to.deep.equal(['item 3', 'item 2']); }); } ); diff --git a/ghost/admin/tests/unit/services/notifications-test.js b/ghost/admin/tests/unit/services/notifications-test.js index a2a5dda049..5633f700b6 100644 --- a/ghost/admin/tests/unit/services/notifications-test.js +++ b/ghost/admin/tests/unit/services/notifications-test.js @@ -188,7 +188,7 @@ describeModule( run(() => { notifications.showAPIError(resp); }); - expect(notifications.get('content')).to.deep.equal([ + expect(notifications.get('content').toArray()).to.deep.equal([ {message: 'There was a problem on the server, please try again.', status: 'alert', type: 'error', key: 'api-error'} ]); @@ -197,7 +197,7 @@ describeModule( run(() => { notifications.showAPIError(resp, {defaultErrorText: 'Overridden default'}); }); - expect(notifications.get('content')).to.deep.equal([ + expect(notifications.get('content').toArray()).to.deep.equal([ {message: 'Overridden default', status: 'alert', type: 'error', key: 'api-error'} ]); }); diff --git a/ghost/admin/tests/unit/validators/nav-item-test.js b/ghost/admin/tests/unit/validators/nav-item-test.js index c32b8f03af..090f525d2b 100644 --- a/ghost/admin/tests/unit/validators/nav-item-test.js +++ b/ghost/admin/tests/unit/validators/nav-item-test.js @@ -13,7 +13,7 @@ const testInvalidUrl = function (url) { validator.check(navItem, 'url'); expect(validator.get('passed'), `"${url}" passed`).to.be.false; - expect(navItem.get('errors').errorsFor('url')).to.deep.equal([{ + expect(navItem.get('errors').errorsFor('url').toArray()).to.deep.equal([{ attribute: 'url', message: 'You must specify a valid URL or relative path' }]); @@ -36,7 +36,7 @@ describe('Unit: Validator: nav-item', function () { validator.check(navItem, 'label'); expect(validator.get('passed')).to.be.false; - expect(navItem.get('errors').errorsFor('label')).to.deep.equal([{ + expect(navItem.get('errors').errorsFor('label').toArray()).to.deep.equal([{ attribute: 'label', message: 'You must specify a label' }]); @@ -49,7 +49,7 @@ describe('Unit: Validator: nav-item', function () { validator.check(navItem, 'url'); expect(validator.get('passed')).to.be.false; - expect(navItem.get('errors').errorsFor('url')).to.deep.equal([{ + expect(navItem.get('errors').errorsFor('url').toArray()).to.deep.equal([{ attribute: 'url', message: 'You must specify a URL or relative path' }]); diff --git a/ghost/admin/tests/unit/validators/slack-integration-test.js b/ghost/admin/tests/unit/validators/slack-integration-test.js index f34016e6f0..076568d0d5 100644 --- a/ghost/admin/tests/unit/validators/slack-integration-test.js +++ b/ghost/admin/tests/unit/validators/slack-integration-test.js @@ -13,7 +13,7 @@ const testInvalidUrl = function (url) { validator.check(slackObject, 'url'); expect(validator.get('passed'), `"${url}" passed`).to.be.false; - expect(slackObject.get('errors').errorsFor('url')).to.deep.equal([{ + expect(slackObject.get('errors').errorsFor('url').toArray()).to.deep.equal([{ attribute: 'url', message: 'The URL must be in a format like https://hooks.slack.com/services/' }]);