<!DOCTYPE HTML>
<html>
 <head>
  <title>Resizing a canvas</title>
 </head>
 <body>
  <p>There should be nothing below. Bug 8994. </p>
  <p><canvas width="200" height="100">FAIL</canvas></p>
  <script>
   var canvas = document.getElementsByTagName('canvas')[0];
   var context = canvas.getContext('2d');

   // This should get nuked by the resize below
   context.fillStyle = 'red';
   context.fillRect(0, 0, 200, 100);

   // THE TEST
   context.fillStyle = 'red';
   context.strokeStyle = 'red';
   context.lineWidth = 25;
   context.beginPath();
   context.moveTo(25, 25);
   context.moveTo(125, 25);
   context.moveTo(125, 125);
   context.moveTo(25, 125);
   canvas.setAttribute('height', '200'); // this should wipe the red away and blow away all the other state
   context.fill(); // so this should do nothing
   context.strokeRect(0, 201, 200, 201); // this should draw nothing
  </script>
 </body>
</html>