[IMP] add browser bindings to standard environment

This could be done by each application, but it does cost only a few
lines of code, and it helps standardizing the Owl ecosystem.

For example, some library (such as o_spreadsheet) needs to mock side
effects, and Odoo also needs to do that, so this prevents duplicated effort.

closes #686

src/browser.ts

@@ -0,0 +1,23 @@
+export interface Browser {
+  setTimeout: Window["setTimeout"];
+  clearTimeout: Window["clearTimeout"];
+  setInterval: Window["setInterval"];
+  clearInterval: Window["clearInterval"];
+  requestAnimationFrame: Window["requestAnimationFrame"];
+  random: Math["random"];
+  Date: typeof Date;
+  fetch: Window["fetch"];
+  localStorage: Window["localStorage"];
+}
+
+export const browser: Browser = {
+  setTimeout: window.setTimeout.bind(window),
+  clearTimeout: window.clearTimeout.bind(window),
+  setInterval: window.setInterval.bind(window),
+  clearInterval: window.clearInterval.bind(window),
+  requestAnimationFrame: window.requestAnimationFrame.bind(window),
+  random: Math.random,
+  Date: window.Date,
+  fetch: (window.fetch || (() => {})).bind(window),
+  localStorage: window.localStorage
+};

src/component/component.ts

@@ -7,6 +7,7 @@ import { Fiber } from "./fiber";
 import "./props_validation";
 import { Scheduler, scheduler } from "./scheduler";
 import { activateSheet } from "./styles";
+import { Browser, browser } from "../browser";
 
 /**
  * Owl Component System
@@ -34,6 +35,7 @@ import { activateSheet } from "./styles";
  */
 export interface Env {
   qweb: QWeb;
+  browser: Browser;
 }
 
 export type MountPosition = "first-child" | "last-child" | "self";
@@ -157,6 +159,9 @@ export class Component<Props extends {} = any, T extends Env = Env> {
       if (!this.env.qweb) {
         this.env.qweb = new QWeb();
       }
+      if (!this.env.browser) {
+        this.env.browser = browser;
+      }
       this.env.qweb.on("update", this, () => {
         if (this.__owl__.isMounted) {
           this.render(true);

src/component/scheduler.ts

@@ -1,4 +1,5 @@
 import { Fiber } from "./fiber";
+import { browser } from "../browser";
 
 /**
  * Owl Scheduler Class
@@ -19,9 +20,9 @@ interface Task {
 export class Scheduler {
   tasks: Task[] = [];
   isRunning: boolean = false;
-  requestAnimationFrame: typeof window.requestAnimationFrame;
+  requestAnimationFrame: Window["requestAnimationFrame"];
 
-  constructor(requestAnimationFrame) {
+  constructor(requestAnimationFrame: Window["requestAnimationFrame"]) {
     this.requestAnimationFrame = requestAnimationFrame;
   }
 
@@ -109,5 +110,4 @@ export class Scheduler {
   }
 }
 
-const raf = window.requestAnimationFrame.bind(window);
-export const scheduler = new Scheduler(raf);
+export const scheduler = new Scheduler(browser.requestAnimationFrame);

src/utils.ts

@@ -10,6 +10,8 @@
  * - debounce
  */
 
+import { browser } from "./browser";
+
 export function whenReady(fn?: any) {
   return new Promise(function(resolve) {
     if (document.readyState !== "loading") {
@@ -44,7 +46,7 @@ export function loadJS(url: string): Promise<void> {
 }
 
 export async function loadFile(url: string): Promise<string> {
-  const result = await fetch(url);
+  const result = await browser.fetch(url);
   if (!result.ok) {
     throw new Error("Error while fetching xml templates");
   }
@@ -83,8 +85,8 @@ export function debounce(func: Function, wait: number, immediate?: boolean): Fun
       }
     }
     const callNow = immediate && !timeout;
-    clearTimeout(timeout);
-    timeout = setTimeout(later, wait);
+    browser.clearTimeout(timeout);
+    timeout = browser.setTimeout(later, wait);
     if (callNow) {
       func.apply(context, args);
     }