view iframe-resizer/test/size.html @ 8:86219e4aa239 draft

Uploaded
author saskia-hiltemann
date Mon, 28 Aug 2017 10:23:21 -0400
parents ac5f9272033b
children
line wrap: on
line source

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>QUnit LoadHide</title>
  <link rel="stylesheet" href="resources/qunit.css">
</head>
<body>
  <div id="qunit"></div>
  <div id="qunit-fixture">

    <div style="width:400px;">
      <iframe src="resources/frame.content.html" width="100%" scrolling="no"></iframe>
    </div>

  </div>
  <script src="resources/qunit.js"></script>
  <script src="resources/jquery.js"></script>
  <script src="../js/iframeResizer.min.js"></script>
  <script>

    'use strict';
    var msgId = '[iFrameSizerTest]:';

    asyncTest( "iFrame size Event", function() {

      var callbackCounter = 0;

      $('iframe').iFrameResize({
        log:true,
        doWidth:true,
        enablePublicMethods:true,
        interval:0,
        resizedCallback:function(messageData){
          var msgType = 'size';

          switch  (''+(++callbackCounter)){
            case '1':
              document.getElementsByTagName('iframe')[0].contentWindow.postMessage( msgId + msgType, '*' );
              break;
            case '2':
              ok( msgType === messageData.type, 'Received '+messageData.type+' message back from iFrame. Expected '+msgType);
              document.getElementsByTagName('iframe')[0].contentWindow.postMessage( msgId + 'size100', '*' );
              break;
            case '3':
              ok( msgType === messageData.type, 'Received '+messageData.type+' message back from iFrame. Expected '+msgType);
              ok( '100' === messageData.height, 'Height received = 100');
              //ok( 100 === $('iframe').height(), 'IFrame height = 100'); Works in phaatomJS, but not chrome!
              document.getElementsByTagName('iframe')[0].contentWindow.postMessage( msgId + 'size200300', '*' );
              break;
            case '4':
              ok( msgType === messageData.type, 'Received '+messageData.type+' message back from iFrame. Expected '+msgType);
              ok( '200' === messageData.height, 'Height received = 200');
              ok( '300' === messageData.width, 'Width received = 300');
              start();
          }
        }
      });
    });

		
  </script>
</body>
</html>