From 54e50f48e5585147813689c927cc834c958ab2f0 Mon Sep 17 00:00:00 2001 From: Justin Willis Date: Fri, 17 Feb 2017 11:01:34 -0600 Subject: [PATCH] chore(platform): resize works correctly * chore(platform): resize works correctly * chore(platform): height correct after resize * test(platform): add new dimensions unit tests * chore(platform): works with keyboard too * chore(platform): store values * chore(platform): change const to var --- src/platform/platform.ts | 31 +++++++++--------- src/platform/test/platform.spec.ts | 50 ++++++++++++++++++++++++++++++ 2 files changed, 67 insertions(+), 14 deletions(-) diff --git a/src/platform/platform.ts b/src/platform/platform.ts index 2fd0c33d042..93adc1d3b30 100644 --- a/src/platform/platform.ts +++ b/src/platform/platform.ts @@ -574,40 +574,43 @@ export class Platform { if (this._isPortrait === null || this._isPortrait === false && this._win['innerWidth'] < this._win['innerHeight']) { var win = this._win; + var innerWidth = win['innerWidth']; + var innerHeight = win['innerHeight']; + // we're keeping track of portrait and landscape dimensions // separately because the virtual keyboard can really mess // up accurate values when the keyboard is up if (win.screen.width > 0 && win.screen.height > 0) { - if (win['innerWidth'] < win['innerHeight']) { + if (innerWidth < innerHeight) { // the device is in portrait - if (this._pW <= win['innerWidth']) { + // we have to do fancier checking here + // because of the virtual keyboard resizing + // the window + if (this._pW <= innerWidth) { console.debug('setting _isPortrait to true'); this._isPortrait = true; - this._pW = win['innerWidth']; + this._pW = innerWidth; } - if (this._pH <= win['innerHeight']) { + + if (this._pH <= innerHeight) { console.debug('setting _isPortrait to true'); this._isPortrait = true; - this._pH = win['innerHeight']; + this._pH = innerHeight; } } else { - if (this._lW > win['innerWidth']) { - // Special case: keyboard is open and device is in portrait - console.debug('setting _isPortrait to true while keyboard is open and device is portrait'); - this._isPortrait = true; - } // the device is in landscape - if (this._lW <= win['innerWidth']) { + if (this._lW !== innerWidth) { console.debug('setting _isPortrait to false'); this._isPortrait = false; - this._lW = win['innerWidth']; + this._lW = innerWidth; } - if (this._lH <= win['innerHeight']) { + + if (this._lH !== innerHeight) { console.debug('setting _isPortrait to false'); this._isPortrait = false; - this._lH = win['innerHeight']; + this._lH = innerHeight; } } diff --git a/src/platform/test/platform.spec.ts b/src/platform/test/platform.spec.ts index 596298efc74..99237eaf32b 100644 --- a/src/platform/test/platform.spec.ts +++ b/src/platform/test/platform.spec.ts @@ -173,6 +173,56 @@ describe('Platform', () => { }); }); + describe('dimensions', () => { + it('should return the correct width of the window', () => { + expect(plt.width()).toEqual(window.innerWidth); + }); + + it('should return the correct height of the window', () => { + expect(plt.height()).toEqual(window.innerHeight); + }); + + it('should return the correct width of the window after resize', () => { + + // start with default window + expect(plt.width()).toEqual(window.innerWidth); + + let resizedWindow: any = { + innerWidth: 200, + innerHeight: 300, + screen: { + width: 200, + height: 300 + } + }; + + // resize to smaller window + plt.setWindow(resizedWindow); + + expect(plt.width()).toEqual(resizedWindow.innerWidth); + }); + + it('should return the correct height of the window after resize', () => { + + // start with default window + expect(plt.height()).toEqual(window.innerHeight); + + let resizedWindow: any = { + innerWidth: 200, + innerHeight: 300, + screen: { + width: 200, + height: 300 + } + }; + + // resize to smaller window + plt.setWindow(resizedWindow); + + expect(plt.height()).toEqual(resizedWindow.innerHeight); + }); + }); + it('should set core as the fallback', () => { plt.setDefault('core'); plt.setQueryParams('');