on('load') doesn't work as expected on iOS

mattetti commented 12 years ago

Take a look at this reduction: http://jsfiddle.net/XQdLu/

<!doctype html>
<html lang="en" class=" -webkit-">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0;">
    <title>Demo</title>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/bonsai/0.4.1/bonsai.min.js"></script>
  </head>

  <body>
    <div id="wrapper"></div>
  </body>

  <script>
  var movie = bonsai.run(document.getElementById('wrapper'), {
    code: function() {
      stage.on('message', function(data) {
        new Rect(10, 10, 100, 100)
        .fill('yellow')
        .stroke('#f00', 2)
        .addTo(stage);
      });
    },
    width: 400,
    height: 400,
  });

  movie.on('load', function() {
    this.sendMessage({ foo: 'bar' });
  });
  </script>
</html>

In my browsers (Chrome/Safari), the 'load' event gets triggered which sends the message to the movie variable which then draws the yellow Rect instance. However on my cellphone (iPhone running iOS5/safari, the rectangle never gets drawn.

iamdustan commented 12 years ago

Potentially related: #100.

mattetti commented 12 years ago

Note that this issue only seems to affect iOS 5, the same code works on iOS6

davidaurelio commented 11 years ago

Ok, #158 does not fix this.

The issue is bound to the iframe runner, which is used by iOS5. I will debug that now and add a commit to #158

davidaurelio commented 11 years ago

Found the cause: There is an expectation that code passed to run() can be executed synchronously. If that’s the case – as with the webworker runner – everything is fine. The iframe runner is not able to execute code synchronously, and the 'load' event fires too early.

This issue will be adressed in the upcoming rewrite of the script loading system.

uxebu / bonsai

on('load') doesn't work as expected on iOS #150