[REL] v1.0.3

v1.0.2 because I am fighting with npm...

README.md

@@ -110,8 +110,8 @@ npm install @odoo/owl
 
 If you want to use a simple `<script>` tag, the last release can be downloaded here:
 
-- [owl-1.0.0.js](https://github.com/odoo/owl/releases/download/v1.0.0/owl.js)
-- [owl-1.0.0.min.js](https://github.com/odoo/owl/releases/download/v1.0.0/owl.min.js)
+- [owl-1.0.3.js](https://github.com/odoo/owl/releases/download/v1.0.3/owl.js)
+- [owl-1.0.3.min.js](https://github.com/odoo/owl/releases/download/v1.0.3/owl.min.js)
 
 Some npm scripts are available:
 

package.json

@@ -1,10 +1,9 @@
 {
   "name": "@odoo/owl",
-  "version": "1.0.0",
+  "version": "1.0.3",
   "description": "Odoo Web Library (OWL)",
   "main": "dist/owl.js",
   "types": "dist/types/index.d.ts",
-  "prepublish": "npm run buildcommonjs",
   "files": ["dist/types/", "dist/owl.js"],
   "engines": {
     "node": ">=10.15.3"
@@ -21,7 +20,8 @@
     "tools": "npm run build && npm run tools:serve",
     "pretools:watch": "npm run build",
     "tools:watch": "npm-run-all  --parallel tools:serve \"build:* -- --watch\"",
-    "prettier": "prettier {src/*.ts,src/**/*.ts,tests/*.ts,tests/**/*.ts,doc/*.md,doc/**/*.md} --write"
+    "prettier": "prettier {src/*.ts,src/**/*.ts,tests/*.ts,tests/**/*.ts,doc/*.md,doc/**/*.md} --write",
+    "publish": "npm run buildcommonjs && npm publish"
   },
   "repository": {
     "type": "git",

roadmap.md

@@ -1,6 +1,6 @@
 # 🦉 OWL Roadmap 🦉
 
-- Current version: 1.0.0
+- Current version: 1.0.3
 - Status: stable
 
 This roadmap is only an attempt at predicting Owl's future.  Everything may

tools/benchmarks/owl-1.0.0/app.js

@@ -0,0 +1,154 @@
+import { buildData, startMeasure, stopMeasure, formatNumber } from "../shared/utils.js";
+
+const { useState, useRef } = owl.hooks;
+//------------------------------------------------------------------------------
+// Likes Counter Widget
+//------------------------------------------------------------------------------
+class Counter extends owl.Component {
+  state = useState({ counter: 0 });
+
+  increment() {
+    this.state.counter++;
+  }
+}
+
+//------------------------------------------------------------------------------
+// Message Widget
+//------------------------------------------------------------------------------
+class Message extends owl.Component {
+  shouldUpdate(nextProps) {
+    return nextProps.message !== this.props.message;
+  }
+  removeMessage() {
+    this.trigger("remove-message", {
+      id: this.props.message.id
+    });
+  }
+}
+Message.components = { Counter };
+
+//------------------------------------------------------------------------------
+// Root Widget
+//------------------------------------------------------------------------------
+class App extends owl.Component {
+  state = useState({ messages: [], multipleFlag: false, clearAfterFlag: false });
+  logRef = useRef("log");
+
+  mounted() {
+    this.log(`Benchmarking Owl v${owl.__info__.version} (build date: ${owl.__info__.date})`);
+  }
+
+  benchmark(message, fn, callback) {
+    if (this.state.multipleFlag) {
+      const N = 20;
+      let n = N;
+      let total = 0;
+      let cb = info => {
+        let finalize = () => {
+          n--;
+          total += info.delta;
+          if (n === 0) {
+            const avg = total / N;
+            this.log(`Average: ${formatNumber(avg)}ms`, true);
+            if (callback) {
+              callback();
+            }
+          } else {
+            this._benchmark(message, fn, cb);
+          }
+        };
+
+        if (this.state.clearAfterFlag) {
+          this._benchmark(
+            "clear",
+            () => {
+              this.state.messages = [];
+            },
+            finalize,
+            false
+          );
+        } else {
+          finalize();
+        }
+      };
+      this._benchmark(message, fn, cb);
+    } else {
+      this._benchmark(message, fn, callback);
+    }
+  }
+
+  _benchmark(message, fn, cb, log = true) {
+    setTimeout(() => {
+      startMeasure(message);
+      fn();
+      stopMeasure(info => {
+        if (log) {
+          this.log(info.msg);
+        }
+        if (cb) {
+          cb(info);
+        }
+      });
+    }, 10);
+  }
+
+  addMessages(n) {
+    this.benchmark("add " + n, () => {
+      const newMessages = buildData(n);
+      this.state.messages.push.apply(this.state.messages, newMessages);
+    });
+  }
+
+  clear() {
+    this._benchmark("clear", () => {
+      this.state.messages = [];
+    });
+  }
+
+  updateSomeMessages() {
+    this.benchmark("update every 10th", () => {
+      const messages = this.state.messages;
+      for (let i = 0; i < messages.length; i += 10) {
+        const msg = Object.assign({}, messages[i]);
+        msg.author += "!!!";
+        messages[i] = msg;
+      }
+    });
+  }
+
+  removeMessage(event) {
+    this.benchmark("remove message", () => {
+      const index = this.state.messages.findIndex(m => m.id === event.detail.id);
+      this.state.messages.splice(index, 1);
+    });
+  }
+
+  log(str, isBold) {
+    const div = document.createElement("div");
+    if (isBold) {
+      div.classList.add("bold");
+    }
+    div.textContent = `> ${str}`;
+    this.logRef.el.appendChild(div);
+    this.logRef.el.scrollTop = this.logRef.el.scrollHeight;
+  }
+
+  clearLog() {
+    this.logRef.el.innerHTML = "";
+  }
+}
+App.components = { Message };
+
+//------------------------------------------------------------------------------
+// Application initialization
+//------------------------------------------------------------------------------
+async function start() {
+  const templates = await owl.utils.loadFile("templates.xml");
+  App.env = {
+    qweb: new owl.QWeb({ templates })
+  };
+  const app = new App();
+  app.mount(document.body);
+}
+
+start();

tools/benchmarks/owl-1.0.0/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>OWL v1.0.0 Benchmark</title>
+  <link href="../shared/main.css" rel="stylesheet"/>
+  <script src='owl.js'></script>
+</head>
+<body>
+  <script src='app.js' type="module"></script>
+</body>
+</html>

tools/benchmarks/owl-1.0.0/templates.xml

@@ -0,0 +1,50 @@
+<templates>
+  <div t-name="App" class="main">
+      <div class="left-thing">
+        <div class="title">Actions</div>
+        <div class="panel">
+          <button t-on-click="addMessages(100)">Add 100 messages</button>
+          <button t-on-click="addMessages(1000)">Add 1k messages</button>
+          <button t-on-click="addMessages(10000)">Add 10k messages</button>
+          <button t-on-click="addMessages(30000)">Add 30k messages</button>
+          <button t-on-click="updateSomeMessages">Update every 10th messages</button>
+          <button t-on-click="clear">Clear</button>
+        </div>
+        <div class="flags">
+            <div>
+                <input type="checkbox" id="multipleflag" t-model="state.multipleFlag"/>
+                <label for="multipleflag">Do it 20x</label>
+            </div>
+            <div>
+                <input type="checkbox" id="clearFlag" t-model="state.clearAfterFlag" />
+                <label for="clearFlag">Clear after</label>
+            </div>
+        </div>
+        <div class="info">Number of messages: <t t-esc="state.messages.length"/></div>
+        <hr/>
+        <div class="title">Log <span class="clear-log" t-on-click="clearLog">(clear)</span></div>
+        <div class="log">
+            <div class="log-content" t-ref="log"/>
+        </div>
+      </div>
+      <div class="right-thing">
+          <div class="content" t-on-remove-message="removeMessage">
+              <t t-foreach="state.messages" t-as="message">
+                  <Message t-key="message.id" message="message"/>
+              </t>
+          </div>
+      </div>
+  </div>
+
+  <div t-name="Message" class="message">
+    <span class="author"><t t-esc="props.message.author"/></span>
+    <span class="msg"><t t-esc="props.message.msg"/></span>
+    <button class="remove" t-on-click="removeMessage">Remove</button>
+    <Counter/>
+  </div>
+
+  <div t-name="Counter">
+    <button t-on-click="increment">Value: <t t-esc="state.counter"/></button>
+  </div>
+
+</templates>

tools/index.html

@@ -37,6 +37,7 @@
                 <li><a href="benchmarks/owl-0.21.0">OWL 0.21.0</a></li>
                 <li><a href="benchmarks/owl-0.24.0">OWL 0.24.0</a></li>
                 <li><a href="benchmarks/owl-1.0.0-beta1">OWL 1.0.0-beta1</a></li>
+                <li><a href="benchmarks/owl-1.0.0">OWL 1.0.0</a></li>
                 <li><a href="benchmarks/owl-master">OWL Master</a></li>
             </ul>
             <ul>