title: WKWebView displays content wrong after orientation change
body: <p>I am fairly new to iOS development and I'm using a <code>WKWebView</code> to display a page that plays a video using the Vimeo Player. When the app starts up, it shows the view correctly, no matter what orientation it is currently in. However, once I change the orientation the view will either look zoomed in or has whitespace below the video.</p>
  
  <p>The annoying thing about this is that it's not consistent. Sometimes the view displays correctly, sometimes it doesn't. If I try to zoom the view in or out or try to scroll when using the app it usually corrects itself, but even that does not seem to be 100% reliable.</p>
  
  <p>Some screenshots (tested on iPad 2):</p>
  
  <p>Landscape orientation (correct):
  <a href="https://i.stack.imgur.com/sQhDC.png" rel="noreferrer"><img src="https://i.stack.imgur.com/sQhDC.png" alt="Landscape orientation (correct)"></a></p>
  
  <p>Portrait orientation (correct):
  <a href="https://i.stack.imgur.com/mQXYd.png" rel="noreferrer"><img src="https://i.stack.imgur.com/mQXYd.png" alt="Portrait orientation (correct)"></a></p>
  
  <p>Landscape orientation (incorrect):
  <a href="https://i.stack.imgur.com/SA2cb.png" rel="noreferrer"><img src="https://i.stack.imgur.com/SA2cb.png" alt="Landscape orientation (incorrect)"></a></p>
  
  <p>Portrait orientation (incorrect):
  <a href="https://i.stack.imgur.com/C9rS1.png" rel="noreferrer"><img src="https://i.stack.imgur.com/C9rS1.png" alt="Portrait orientation (incorrect)"></a></p>
  
  <p>And the code used to produce this result:</p>
  
  <pre><code>import Foundation
  import UIKit
  import WebKit
  
  class VideoViewController : UIViewController, WKScriptMessageHandler {
  
  @IBOutlet var containerView : UIView! = nil
  var webView: WKWebView?
  
  override func loadView() {
      super.loadView()
      self.webView = WKWebView()
      let contentController = WKUserContentController();
      let scaleToFit = WKUserScript(source: "var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width, initial-scale=1.0'); document.getElementsByTagName('head')[0].appendChild(meta);", injectionTime: WKUserScriptInjectionTime.AtDocumentStart, forMainFrameOnly: true)
      contentController.addUserScript(scaleToFit)
      contentController.addScriptMessageHandler(self, name: "callbackHandler")
      self.view = webView!
  }
  
  override func viewDidLoad() {
      super.viewDidLoad()
      refreshUI()
  }
  
  override func didReceiveMemoryWarning() {
      super.didReceiveMemoryWarning()
      // Dispose of any resources that can be recreated.
  }
  
  func refreshUI() {
      let url = NSURL(string: "https://photofactsacademy.nl/api/vp.asp?id=152839850")
      let requestObj = NSURLRequest(URL: url!)
      webView!.loadRequest(requestObj)
  }
  
  func userContentController(userContentController: WKUserContentController, didReceiveScriptMessage message: WKScriptMessage) {
      if(message.name == "callbackHandler") {
          print("JavaScript is sending a message \(message.body)")
      }
  }
  }
  </code></pre>
  
  <p>I looked through SO for WKWebView and orientation change and didn't find anything that helped me.</p>
  
  <p>Your help is appreciated.</p>