tylerjpeterson/ios-inner-height

userAgent.match(/iphone|ipod|ipad/i) for iPad Pro fails

Opened this issue · 0 comments

Hey there, super useful module!

I've noticed that iPad Pro devices are considered Macintosh since they are running on iPadOS. I've been using this module and it worked fine, but still had the issue on iPad. I've fixed it by detecting iPads this way:

function isIpad () {
  const ua = window.navigator.userAgent
  if (ua.includes('iPad')) {
    return true
  }
  if (ua.includes('Macintosh')) {
    try {
      document.createEvent('TouchEvent')
      return true
    } catch (e) {}
  }
  return false
}

...and just updated the code within ios-inner-height where it would skip and return window.innerHeight if the userAgent does not matches /iphone|ipod|ipad/i:

// Non-iOS browsers return window.innerHeight per usual.
// No caching here since browsers can be resized, and setting
// up resize-triggered cache invalidation is not in scope.
/* istanbul ignore if  */
if (!navigator.userAgent.match(/iphone|ipod|ipad/i) && !isIpad()) {
  /**
   * Avoids conditional logic in the implementation
   * @return {number} - window's innerHeight measurement in pixels
   */
  return function () {
    return window.innerHeight
  }
}

I am not sure if I should have created a PR as I'm not sure you want to include that isIpad() function in this module, but it might help if someone is having the same issue as I did... You might have a better solution/fix for including iPadOS for this module.