В Google Appmaker не удается получить requestAnimationFrame работает

интересно, кто-нибудь еще замечает это. Я могу получить анимацию, используя setInterval, но время не так точно, как хотелось бы. Но по какой-то причине я не могу получить requestAnimationFrame, чтобы что-то сделать.

Целью приведенного ниже кода является наличие вспышки экрана между двумя разными цветами каждые 250 мс, хотя это не совсем то, чего я пытаюсь достичь в конце, я использую эту упрощенную концепцию, чтобы просто попытаться получить концепцию анимации за работой. (если кто-то хочет взломать его, я пытаюсь получить черный фон, чтобы вспыхнуть красным на 100 мс, каждые 400 мс).

По общему признанию, я довольно новичок в javascript, но мне интересно, заметил ли кто-нибудь еще что-нибудь подобное?

код Я пытаюсь, onClick кнопки вызывает sayHello();

function sayHello(){
  var start = window.performance.now();
  var runStart = window.performance.now();
  var my_canvas = app.pages.Run.children.Panel1.children.Canvas.getElement().getElementsByTagName("CANVAS")[0];
  var requestId1;
  var totalDuration = 5000;
  var currentColor = '#000000';

  function animate1(now){
    my_canvas.style.backgroundColor = currentColor;
    console.log('animate now: ' + now + 'win' + windows.performance.now());
    if (now > start+250){
      start = now;
      now = 0;
      if (currentColor === '#ff0000') currentColor = '#000000';
      else currentColor = '#ff0000';
      console.log('switch: ' + window.performance.now());
    }

    if ((window.performance.now - runStart) > totalDuration){
      window.cancelAnimationFrame(requestId1); 
      console.log('done');
    }
    else{
      requestAnimationFrame(animate1);
      console.log('not done');
    }
  }

  function sayGoodbye(){
    window.cancelAnimationFrame(requestId1);
  }

  requestId1 = requestAnimationFrame(animate1);
  console.log('start app' + requestId1);
  console.log('info: ' + start + ' ' + runStart + ' ' + totalDuration);

}