mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[CLEANUP] update prettier to v2.0.4
This commit is contained in:
@@ -111,7 +111,7 @@ class Parent extends Component {
|
|||||||
static components = { OrderLine };
|
static components = { OrderLine };
|
||||||
orders = useState([
|
orders = useState([
|
||||||
{ id: 1, name: "Coffee", quantity: 0 },
|
{ id: 1, name: "Coffee", quantity: 0 },
|
||||||
{ id: 2, name: "Tea", quantity: 0 }
|
{ id: 2, name: "Tea", quantity: 0 },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
addToOrder(event) {
|
addToOrder(event) {
|
||||||
|
|||||||
+11
-11
@@ -281,7 +281,7 @@ import { Component } from "@odoo/owl";
|
|||||||
import "regenerator-runtime/runtime";
|
import "regenerator-runtime/runtime";
|
||||||
|
|
||||||
export async function nextTick() {
|
export async function nextTick() {
|
||||||
return new Promise(function(resolve) {
|
return new Promise(function (resolve) {
|
||||||
setTimeout(() => Component.scheduler.requestAnimationFrame(() => resolve()));
|
setTimeout(() => Component.scheduler.requestAnimationFrame(() => resolve()));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -361,26 +361,26 @@ const HtmlWebpackPlugin = require("html-webpack-plugin");
|
|||||||
|
|
||||||
const host = process.env.HOST || "localhost";
|
const host = process.env.HOST || "localhost";
|
||||||
|
|
||||||
module.exports = function(env, argv) {
|
module.exports = function (env, argv) {
|
||||||
const mode = argv.mode || "development";
|
const mode = argv.mode || "development";
|
||||||
return {
|
return {
|
||||||
mode: mode,
|
mode: mode,
|
||||||
entry: "./src/main.js",
|
entry: "./src/main.js",
|
||||||
output: {
|
output: {
|
||||||
filename: "main.js",
|
filename: "main.js",
|
||||||
path: path.resolve(__dirname, "dist")
|
path: path.resolve(__dirname, "dist"),
|
||||||
},
|
},
|
||||||
module: {
|
module: {
|
||||||
rules: [
|
rules: [
|
||||||
{
|
{
|
||||||
test: /\.jsx?$/,
|
test: /\.jsx?$/,
|
||||||
loader: "babel-loader",
|
loader: "babel-loader",
|
||||||
exclude: /node_modules/
|
exclude: /node_modules/,
|
||||||
}
|
},
|
||||||
]
|
],
|
||||||
},
|
},
|
||||||
resolve: {
|
resolve: {
|
||||||
extensions: [".js", ".jsx"]
|
extensions: [".js", ".jsx"],
|
||||||
},
|
},
|
||||||
devServer: {
|
devServer: {
|
||||||
contentBase: path.resolve(__dirname, "public/index.html"),
|
contentBase: path.resolve(__dirname, "public/index.html"),
|
||||||
@@ -388,14 +388,14 @@ module.exports = function(env, argv) {
|
|||||||
hot: true,
|
hot: true,
|
||||||
host,
|
host,
|
||||||
port: 3000,
|
port: 3000,
|
||||||
publicPath: "/"
|
publicPath: "/",
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
new HtmlWebpackPlugin({
|
new HtmlWebpackPlugin({
|
||||||
inject: true,
|
inject: true,
|
||||||
template: path.resolve(__dirname, "public/index.html")
|
template: path.resolve(__dirname, "public/index.html"),
|
||||||
})
|
}),
|
||||||
]
|
],
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
|||||||
@@ -62,7 +62,7 @@ our application. `app.js` is where we will write all our code. For now, let's
|
|||||||
just put the following code:
|
just put the following code:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
(function() {
|
(function () {
|
||||||
console.log("hello owl", owl.__info__.version);
|
console.log("hello owl", owl.__info__.version);
|
||||||
})();
|
})();
|
||||||
```
|
```
|
||||||
@@ -170,13 +170,13 @@ class App extends Component {
|
|||||||
{
|
{
|
||||||
id: 1,
|
id: 1,
|
||||||
title: "buy milk",
|
title: "buy milk",
|
||||||
isCompleted: true
|
isCompleted: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 2,
|
id: 2,
|
||||||
title: "clean house",
|
title: "clean house",
|
||||||
isCompleted: false
|
isCompleted: false,
|
||||||
}
|
},
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
@@ -562,23 +562,23 @@ const actions = {
|
|||||||
const task = {
|
const task = {
|
||||||
id: state.nextId++,
|
id: state.nextId++,
|
||||||
title: title,
|
title: title,
|
||||||
isCompleted: false
|
isCompleted: false,
|
||||||
};
|
};
|
||||||
state.tasks.push(task);
|
state.tasks.push(task);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
toggleTask({ state }, id) {
|
toggleTask({ state }, id) {
|
||||||
const task = state.tasks.find(t => t.id === id);
|
const task = state.tasks.find((t) => t.id === id);
|
||||||
task.isCompleted = !task.isCompleted;
|
task.isCompleted = !task.isCompleted;
|
||||||
},
|
},
|
||||||
deleteTask({ state }, id) {
|
deleteTask({ state }, id) {
|
||||||
const index = state.tasks.findIndex(t => t.id === id);
|
const index = state.tasks.findIndex((t) => t.id === id);
|
||||||
state.tasks.splice(index, 1);
|
state.tasks.splice(index, 1);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const initialState = {
|
const initialState = {
|
||||||
nextId: 1,
|
nextId: 1,
|
||||||
tasks: []
|
tasks: [],
|
||||||
};
|
};
|
||||||
|
|
||||||
// -------------------------------------------------------------------------
|
// -------------------------------------------------------------------------
|
||||||
@@ -616,7 +616,7 @@ class App extends Component {
|
|||||||
static components = { Task };
|
static components = { Task };
|
||||||
|
|
||||||
inputRef = useRef("add-input");
|
inputRef = useRef("add-input");
|
||||||
tasks = useStore(state => state.tasks);
|
tasks = useStore((state) => state.tasks);
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
@@ -811,7 +811,7 @@ For reference, here is the final code:
|
|||||||
```
|
```
|
||||||
|
|
||||||
```js
|
```js
|
||||||
(function() {
|
(function () {
|
||||||
const { Component, Store } = owl;
|
const { Component, Store } = owl;
|
||||||
const { xml } = owl.tags;
|
const { xml } = owl.tags;
|
||||||
const { whenReady } = owl.utils;
|
const { whenReady } = owl.utils;
|
||||||
@@ -827,24 +827,24 @@ For reference, here is the final code:
|
|||||||
const task = {
|
const task = {
|
||||||
id: state.nextId++,
|
id: state.nextId++,
|
||||||
title: title,
|
title: title,
|
||||||
isCompleted: false
|
isCompleted: false,
|
||||||
};
|
};
|
||||||
state.tasks.push(task);
|
state.tasks.push(task);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
toggleTask({ state }, id) {
|
toggleTask({ state }, id) {
|
||||||
const task = state.tasks.find(t => t.id === id);
|
const task = state.tasks.find((t) => t.id === id);
|
||||||
task.isCompleted = !task.isCompleted;
|
task.isCompleted = !task.isCompleted;
|
||||||
},
|
},
|
||||||
deleteTask({ state }, id) {
|
deleteTask({ state }, id) {
|
||||||
const index = state.tasks.findIndex(t => t.id === id);
|
const index = state.tasks.findIndex((t) => t.id === id);
|
||||||
state.tasks.splice(index, 1);
|
state.tasks.splice(index, 1);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const initialState = {
|
const initialState = {
|
||||||
nextId: 1,
|
nextId: 1,
|
||||||
tasks: []
|
tasks: [],
|
||||||
};
|
};
|
||||||
|
|
||||||
// -------------------------------------------------------------------------
|
// -------------------------------------------------------------------------
|
||||||
@@ -897,7 +897,7 @@ For reference, here is the final code:
|
|||||||
static components = { Task };
|
static components = { Task };
|
||||||
|
|
||||||
inputRef = useRef("add-input");
|
inputRef = useRef("add-input");
|
||||||
tasks = useStore(state => state.tasks);
|
tasks = useStore((state) => state.tasks);
|
||||||
filter = useState({ value: "all" });
|
filter = useState({ value: "all" });
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
|
|
||||||
@@ -916,9 +916,9 @@ For reference, here is the final code:
|
|||||||
get displayedTasks() {
|
get displayedTasks() {
|
||||||
switch (this.filter.value) {
|
switch (this.filter.value) {
|
||||||
case "active":
|
case "active":
|
||||||
return this.tasks.filter(t => !t.isCompleted);
|
return this.tasks.filter((t) => !t.isCompleted);
|
||||||
case "completed":
|
case "completed":
|
||||||
return this.tasks.filter(t => t.isCompleted);
|
return this.tasks.filter((t) => t.isCompleted);
|
||||||
case "all":
|
case "all":
|
||||||
return this.tasks;
|
return this.tasks;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -257,11 +257,11 @@ to the store like in redux, with the `useStore` hook (see the [store documentati
|
|||||||
const actions = {
|
const actions = {
|
||||||
increment({ state }, val) {
|
increment({ state }, val) {
|
||||||
state.counter.value += val;
|
state.counter.value += val;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const state = {
|
const state = {
|
||||||
counter: { value: 0 }
|
counter: { value: 0 },
|
||||||
};
|
};
|
||||||
const store = new owl.Store({ state, actions });
|
const store = new owl.Store({ state, actions });
|
||||||
|
|
||||||
@@ -270,7 +270,7 @@ class Counter extends Component {
|
|||||||
<button t-name="Counter" t-on-click="dispatch('increment')">
|
<button t-name="Counter" t-on-click="dispatch('increment')">
|
||||||
Click Me! [<t t-esc="counter.value"/>]
|
Click Me! [<t t-esc="counter.value"/>]
|
||||||
</button>`;
|
</button>`;
|
||||||
counter = useStore(state => state.counter);
|
counter = useStore((state) => state.counter);
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -204,7 +204,7 @@ to be called in the constructor.
|
|||||||
class Counter extends owl.Component {
|
class Counter extends owl.Component {
|
||||||
static props = {
|
static props = {
|
||||||
initialValue: Number,
|
initialValue: Number,
|
||||||
optional: true
|
optional: true,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
@@ -217,7 +217,7 @@ to be called in the constructor.
|
|||||||
```js
|
```js
|
||||||
class Counter extends owl.Component {
|
class Counter extends owl.Component {
|
||||||
static defaultProps = {
|
static defaultProps = {
|
||||||
initialValue: 0
|
initialValue: 0,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
@@ -804,8 +804,8 @@ class RootNode extends Component {
|
|||||||
children: [
|
children: [
|
||||||
{ label: "b" },
|
{ label: "b" },
|
||||||
{ label: "c", children: [{ label: "d" }, { label: "e" }] },
|
{ label: "c", children: [{ label: "d" }, { label: "e" }] },
|
||||||
{ label: "f", children: [{ label: "g" }] }
|
{ label: "f", children: [{ label: "g" }] },
|
||||||
]
|
],
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|||||||
@@ -113,10 +113,10 @@ async function myEnv() {
|
|||||||
qweb: qweb,
|
qweb: qweb,
|
||||||
services: {
|
services: {
|
||||||
localStorage: localStorage,
|
localStorage: localStorage,
|
||||||
rpc: rpc
|
rpc: rpc,
|
||||||
},
|
},
|
||||||
debug: false,
|
debug: false,
|
||||||
inMobileMode: true
|
inMobileMode: true,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -74,7 +74,7 @@ broadcasted to the application by an event on the `qweb` instance. It may be
|
|||||||
useful, for example, to log the error somewhere.
|
useful, for example, to log the error somewhere.
|
||||||
|
|
||||||
```js
|
```js
|
||||||
env.qweb.on("error", null, function(error) {
|
env.qweb.on("error", null, function (error) {
|
||||||
// do something
|
// do something
|
||||||
// react to the error
|
// react to the error
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ triggering events, and callbacks.
|
|||||||
```js
|
```js
|
||||||
const bus = new owl.core.EventBus();
|
const bus = new owl.core.EventBus();
|
||||||
|
|
||||||
bus.on("some-event", null, function(...args) {
|
bus.on("some-event", null, function (...args) {
|
||||||
console.log(...args);
|
console.log(...args);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -259,7 +259,7 @@ function useLoader() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
onWillStart(() => updateRecord(component.props.id));
|
onWillStart(() => updateRecord(component.props.id));
|
||||||
onWillUpdateProps(nextProps => updateRecord(nextProps.id));
|
onWillUpdateProps((nextProps) => updateRecord(nextProps.id));
|
||||||
|
|
||||||
return record;
|
return record;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -114,9 +114,9 @@ For example:
|
|||||||
const translations = {
|
const translations = {
|
||||||
hello: "bonjour",
|
hello: "bonjour",
|
||||||
yes: "oui",
|
yes: "oui",
|
||||||
no: "non"
|
no: "non",
|
||||||
};
|
};
|
||||||
const translateFn = str => translations[str] || str;
|
const translateFn = (str) => translations[str] || str;
|
||||||
|
|
||||||
const qweb = new QWeb({ translateFn });
|
const qweb = new QWeb({ translateFn });
|
||||||
```
|
```
|
||||||
|
|||||||
+14
-14
@@ -40,14 +40,14 @@ const actions = {
|
|||||||
state.todos.push({
|
state.todos.push({
|
||||||
id: state.nextId++,
|
id: state.nextId++,
|
||||||
message,
|
message,
|
||||||
isCompleted: false
|
isCompleted: false,
|
||||||
});
|
});
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const state = {
|
const state = {
|
||||||
todos: [],
|
todos: [],
|
||||||
nextId: 1
|
nextId: 1,
|
||||||
};
|
};
|
||||||
|
|
||||||
const store = new owl.Store({ state, actions });
|
const store = new owl.Store({ state, actions });
|
||||||
@@ -90,7 +90,7 @@ const config = {
|
|||||||
state,
|
state,
|
||||||
actions,
|
actions,
|
||||||
getters,
|
getters,
|
||||||
env
|
env,
|
||||||
};
|
};
|
||||||
const store = new Store(config);
|
const store = new Store(config);
|
||||||
```
|
```
|
||||||
@@ -110,7 +110,7 @@ const actions = {
|
|||||||
} catch (e) {
|
} catch (e) {
|
||||||
state.loginState = "error";
|
state.loginState = "error";
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
|
||||||
@@ -144,7 +144,7 @@ const actions = {
|
|||||||
state.recordId = recordId;
|
state.recordId = recordId;
|
||||||
const data = await doSomeRPC("/read/", recordId);
|
const data = await doSomeRPC("/read/", recordId);
|
||||||
state.recordData = data;
|
state.recordData = data;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
|
||||||
@@ -159,7 +159,7 @@ const actions = {
|
|||||||
const data = await doSomeRPC("/read/", recordId);
|
const data = await doSomeRPC("/read/", recordId);
|
||||||
state.recordId = recordId;
|
state.recordId = recordId;
|
||||||
state.recordData = data;
|
state.recordData = data;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
```
|
```
|
||||||
|
|
||||||
@@ -187,14 +187,14 @@ transform the data contained in the store.
|
|||||||
```js
|
```js
|
||||||
const getters = {
|
const getters = {
|
||||||
getPost({ state }, id) {
|
getPost({ state }, id) {
|
||||||
const post = state.posts.find(p => p.id === id);
|
const post = state.posts.find((p) => p.id === id);
|
||||||
const author = state.authors.find(a => a.id === post.id);
|
const author = state.authors.find((a) => a.id === post.id);
|
||||||
return {
|
return {
|
||||||
id,
|
id,
|
||||||
author,
|
author,
|
||||||
content: post.content
|
content: post.content,
|
||||||
};
|
};
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
// somewhere else
|
// somewhere else
|
||||||
@@ -224,11 +224,11 @@ Assume we have this store:
|
|||||||
const actions = {
|
const actions = {
|
||||||
increment({ state }, val) {
|
increment({ state }, val) {
|
||||||
state.counter.value += val;
|
state.counter.value += val;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const state = {
|
const state = {
|
||||||
counter: { value: 0 }
|
counter: { value: 0 },
|
||||||
};
|
};
|
||||||
const store = new owl.Store({ state, actions });
|
const store = new owl.Store({ state, actions });
|
||||||
```
|
```
|
||||||
@@ -245,7 +245,7 @@ A counter component can then select this value and dispatch an action like this:
|
|||||||
|
|
||||||
```js
|
```js
|
||||||
class Counter extends Component {
|
class Counter extends Component {
|
||||||
counter = useStore(state => state.counter);
|
counter = useStore((state) => state.counter);
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -19,7 +19,7 @@ not ready yet, resolved directly otherwise). If called with a callback as
|
|||||||
argument, it executes it as soon as the DOM ready (or directly).
|
argument, it executes it as soon as the DOM ready (or directly).
|
||||||
|
|
||||||
```js
|
```js
|
||||||
Promise.all([loadFile("templates.xml"), owl.utils.whenReady()]).then(function([templates]) {
|
Promise.all([loadFile("templates.xml"), owl.utils.whenReady()]).then(function ([templates]) {
|
||||||
const qweb = new owl.QWeb({ templates });
|
const qweb = new owl.QWeb({ templates });
|
||||||
const app = new App({ qweb });
|
const app = new App({ qweb });
|
||||||
app.mount(document.body);
|
app.mount(document.body);
|
||||||
@@ -29,7 +29,7 @@ Promise.all([loadFile("templates.xml"), owl.utils.whenReady()]).then(function([t
|
|||||||
or alternatively:
|
or alternatively:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
owl.utils.whenReady(function() {
|
owl.utils.whenReady(function () {
|
||||||
const qweb = new owl.QWeb();
|
const qweb = new owl.QWeb();
|
||||||
const app = new App({ qweb });
|
const app = new App({ qweb });
|
||||||
app.mount(document.body);
|
app.mount(document.body);
|
||||||
|
|||||||
+3
-2
@@ -49,7 +49,7 @@
|
|||||||
"jest-environment-jsdom": "^24.7.1",
|
"jest-environment-jsdom": "^24.7.1",
|
||||||
"live-server": "^1.2.1",
|
"live-server": "^1.2.1",
|
||||||
"npm-run-all": "^4.1.5",
|
"npm-run-all": "^4.1.5",
|
||||||
"prettier": "^1.19.1",
|
"prettier": "^2.0.4",
|
||||||
"rollup": "^1.6.0",
|
"rollup": "^1.6.0",
|
||||||
"rollup-plugin-typescript2": "^0.20.1",
|
"rollup-plugin-typescript2": "^0.20.1",
|
||||||
"sass": "^1.16.1",
|
"sass": "^1.16.1",
|
||||||
@@ -78,6 +78,7 @@
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
"prettier": {
|
"prettier": {
|
||||||
"printWidth": 100
|
"printWidth": 100,
|
||||||
|
"endOfLine": "auto"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+1
-1
@@ -19,5 +19,5 @@ export const browser: Browser = {
|
|||||||
random: Math.random,
|
random: Math.random,
|
||||||
Date: window.Date,
|
Date: window.Date,
|
||||||
fetch: (window.fetch || (() => {})).bind(window),
|
fetch: (window.fetch || (() => {})).bind(window),
|
||||||
localStorage: window.localStorage
|
localStorage: window.localStorage,
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -203,7 +203,7 @@ export class Component<Props extends {} = any, T extends Env = Env> {
|
|||||||
renderFn: qweb.render.bind(qweb, template),
|
renderFn: qweb.render.bind(qweb, template),
|
||||||
classObj: null,
|
classObj: null,
|
||||||
refs: null,
|
refs: null,
|
||||||
scope: null
|
scope: null,
|
||||||
};
|
};
|
||||||
if (constr.style) {
|
if (constr.style) {
|
||||||
this.__applyStyles(constr);
|
this.__applyStyles(constr);
|
||||||
@@ -514,7 +514,7 @@ export class Component<Props extends {} = any, T extends Env = Env> {
|
|||||||
const ev = new OwlEvent(component, eventType, {
|
const ev = new OwlEvent(component, eventType, {
|
||||||
bubbles: true,
|
bubbles: true,
|
||||||
cancelable: true,
|
cancelable: true,
|
||||||
detail: payload
|
detail: payload,
|
||||||
});
|
});
|
||||||
const triggerHook = this.env[portalSymbol as any];
|
const triggerHook = this.env[portalSymbol as any];
|
||||||
if (triggerHook) {
|
if (triggerHook) {
|
||||||
@@ -549,7 +549,7 @@ export class Component<Props extends {} = any, T extends Env = Env> {
|
|||||||
}
|
}
|
||||||
await Promise.all([
|
await Promise.all([
|
||||||
this.willUpdateProps(nextProps),
|
this.willUpdateProps(nextProps),
|
||||||
__owl__.willUpdatePropsCB && __owl__.willUpdatePropsCB(nextProps)
|
__owl__.willUpdatePropsCB && __owl__.willUpdatePropsCB(nextProps),
|
||||||
]);
|
]);
|
||||||
if (fiber.isCompleted) {
|
if (fiber.isCompleted) {
|
||||||
return;
|
return;
|
||||||
@@ -646,7 +646,7 @@ export class Component<Props extends {} = any, T extends Env = Env> {
|
|||||||
try {
|
try {
|
||||||
let vnode = __owl__.renderFn!(this, {
|
let vnode = __owl__.renderFn!(this, {
|
||||||
handlers: __owl__.boundHandlers,
|
handlers: __owl__.boundHandlers,
|
||||||
fiber: fiber
|
fiber: fiber,
|
||||||
});
|
});
|
||||||
// we iterate over the children to detect those that no longer belong to the
|
// we iterate over the children to detect those that no longer belong to the
|
||||||
// current rendering: those ones, if not mounted yet, can (and have to) be
|
// current rendering: those ones, if not mounted yet, can (and have to) be
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import { makeHandlerCode, MODS_CODE } from "../qweb/extensions";
|
|||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
|
|
||||||
const T_COMPONENT_MODS_CODE = Object.assign({}, MODS_CODE, {
|
const T_COMPONENT_MODS_CODE = Object.assign({}, MODS_CODE, {
|
||||||
self: "if (e.target !== vn.elm) {return}"
|
self: "if (e.target !== vn.elm) {return}",
|
||||||
});
|
});
|
||||||
|
|
||||||
QWeb.utils.defineProxy = function defineProxy(target, source) {
|
QWeb.utils.defineProxy = function defineProxy(target, source) {
|
||||||
@@ -18,7 +18,7 @@ QWeb.utils.defineProxy = function defineProxy(target, source) {
|
|||||||
},
|
},
|
||||||
set(val) {
|
set(val) {
|
||||||
source[k] = val;
|
source[k] = val;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@@ -238,7 +238,7 @@ QWeb.addDirective({
|
|||||||
|
|
||||||
// computing the props string representing the props object
|
// computing the props string representing the props object
|
||||||
let propStr = Object.keys(props)
|
let propStr = Object.keys(props)
|
||||||
.map(k => k + ":" + props[k])
|
.map((k) => k + ":" + props[k])
|
||||||
.join(",");
|
.join(",");
|
||||||
let componentID = ctx.generateID();
|
let componentID = ctx.generateID();
|
||||||
|
|
||||||
@@ -280,7 +280,7 @@ QWeb.addDirective({
|
|||||||
let classDef = classAttr
|
let classDef = classAttr
|
||||||
.trim()
|
.trim()
|
||||||
.split(/\s+/)
|
.split(/\s+/)
|
||||||
.map(a => `'${a}':true`)
|
.map((a) => `'${a}':true`)
|
||||||
.join(",");
|
.join(",");
|
||||||
classObj = `_${ctx.generateID()}`;
|
classObj = `_${ctx.generateID()}`;
|
||||||
ctx.addLine(`let ${classObj} = {${classDef}};`);
|
ctx.addLine(`let ${classObj} = {${classDef}};`);
|
||||||
@@ -298,7 +298,7 @@ QWeb.addDirective({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
let eventsCode = events
|
let eventsCode = events
|
||||||
.map(function([name, value]) {
|
.map(function ([name, value]) {
|
||||||
const capture = name.match(/\.capture/);
|
const capture = name.match(/\.capture/);
|
||||||
name = capture ? name.replace(/\.capture/, "") : name;
|
name = capture ? name.replace(/\.capture/, "") : name;
|
||||||
const { event, handler } = makeHandlerCode(
|
const { event, handler } = makeHandlerCode(
|
||||||
@@ -469,5 +469,5 @@ QWeb.addDirective({
|
|||||||
ctx.addLine(`w${componentID}.__owl__.parentLastFiberId = extra.fiber.id;`);
|
ctx.addLine(`w${componentID}.__owl__.parentLastFiberId = extra.fiber.id;`);
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -193,7 +193,7 @@ export class Fiber {
|
|||||||
|
|
||||||
// build patchQueue
|
// build patchQueue
|
||||||
const patchQueue: Fiber[] = [];
|
const patchQueue: Fiber[] = [];
|
||||||
const doWork: (Fiber) => Fiber | null = function(f) {
|
const doWork: (Fiber) => Fiber | null = function (f) {
|
||||||
patchQueue.push(f);
|
patchQueue.push(f);
|
||||||
return f.child;
|
return f.child;
|
||||||
};
|
};
|
||||||
@@ -280,7 +280,7 @@ export class Fiber {
|
|||||||
* Cancel a fiber and all its children.
|
* Cancel a fiber and all its children.
|
||||||
*/
|
*/
|
||||||
cancel() {
|
cancel() {
|
||||||
this._walk(f => {
|
this._walk((f) => {
|
||||||
if (!f.isRendered) {
|
if (!f.isRendered) {
|
||||||
f.root.counter--;
|
f.root.counter--;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -11,7 +11,7 @@ import { QWeb } from "../qweb/index";
|
|||||||
* This is why it is only done in 'dev' mode.
|
* This is why it is only done in 'dev' mode.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
QWeb.utils.validateProps = function(Widget, props: Object) {
|
QWeb.utils.validateProps = function (Widget, props: Object) {
|
||||||
const propsDef = (<any>Widget).props;
|
const propsDef = (<any>Widget).props;
|
||||||
if (propsDef instanceof Array) {
|
if (propsDef instanceof Array) {
|
||||||
// list of strings (prop names)
|
// list of strings (prop names)
|
||||||
|
|||||||
@@ -50,7 +50,7 @@ export class Scheduler {
|
|||||||
return reject(fiber.error);
|
return reject(fiber.error);
|
||||||
}
|
}
|
||||||
resolve();
|
resolve();
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
if (!this.isRunning) {
|
if (!this.isRunning) {
|
||||||
this.start();
|
this.start();
|
||||||
@@ -60,7 +60,7 @@ export class Scheduler {
|
|||||||
|
|
||||||
rejectFiber(fiber: Fiber, reason: string) {
|
rejectFiber(fiber: Fiber, reason: string) {
|
||||||
fiber = fiber.root;
|
fiber = fiber.root;
|
||||||
const index = this.tasks.findIndex(t => t.fiber === fiber);
|
const index = this.tasks.findIndex((t) => t.fiber === fiber);
|
||||||
if (index >= 0) {
|
if (index >= 0) {
|
||||||
const [task] = this.tasks.splice(index, 1);
|
const [task] = this.tasks.splice(index, 1);
|
||||||
fiber.cancel();
|
fiber.cancel();
|
||||||
@@ -76,7 +76,7 @@ export class Scheduler {
|
|||||||
flush() {
|
flush() {
|
||||||
let tasks = this.tasks;
|
let tasks = this.tasks;
|
||||||
this.tasks = [];
|
this.tasks = [];
|
||||||
tasks = tasks.filter(task => {
|
tasks = tasks.filter((task) => {
|
||||||
if (task.fiber.isCompleted) {
|
if (task.fiber.isCompleted) {
|
||||||
task.callback();
|
task.callback();
|
||||||
return false;
|
return false;
|
||||||
|
|||||||
@@ -8,7 +8,7 @@
|
|||||||
export const STYLESHEETS: { [id: string]: HTMLStyleElement } = {};
|
export const STYLESHEETS: { [id: string]: HTMLStyleElement } = {};
|
||||||
|
|
||||||
export function processSheet(str: string): string {
|
export function processSheet(str: string): string {
|
||||||
const tokens = str.split(/(\{|\}|;)/).map(s => s.trim());
|
const tokens = str.split(/(\{|\}|;)/).map((s) => s.trim());
|
||||||
const selectorStack: string[][] = [];
|
const selectorStack: string[][] = [];
|
||||||
const parts: string[] = [];
|
const parts: string[] = [];
|
||||||
let rules: string[] = [];
|
let rules: string[] = [];
|
||||||
|
|||||||
+1
-1
@@ -26,5 +26,5 @@ Object.defineProperty(config, "mode", {
|
|||||||
} else {
|
} else {
|
||||||
console.log(`Owl is now running in 'prod' mode.`);
|
console.log(`Owl is now running in 'prod' mode.`);
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
+6
-6
@@ -79,9 +79,9 @@ export class Context extends EventBus {
|
|||||||
async __notifyComponents() {
|
async __notifyComponents() {
|
||||||
const rev = ++this.rev;
|
const rev = ++this.rev;
|
||||||
const subscriptions = this.subscriptions.update;
|
const subscriptions = this.subscriptions.update;
|
||||||
const groups = partitionBy(subscriptions, s => (s.owner ? s.owner.__owl__.depth : -1));
|
const groups = partitionBy(subscriptions, (s) => (s.owner ? s.owner.__owl__.depth : -1));
|
||||||
for (let group of groups) {
|
for (let group of groups) {
|
||||||
const proms = group.map(sub => sub.callback.call(sub.owner, rev));
|
const proms = group.map((sub) => sub.callback.call(sub.owner, rev));
|
||||||
// at this point, each component in the current group has registered a
|
// at this point, each component in the current group has registered a
|
||||||
// top level fiber in the scheduler. It could happen that rendering these
|
// top level fiber in the scheduler. It could happen that rendering these
|
||||||
// components is done (if they have no children). This is why we manually
|
// components is done (if they have no children). This is why we manually
|
||||||
@@ -116,7 +116,7 @@ export function useContextWithCB(ctx: Context, component: Component, method): an
|
|||||||
__owl__.observer.notifyCB = component.render.bind(component);
|
__owl__.observer.notifyCB = component.render.bind(component);
|
||||||
}
|
}
|
||||||
const currentCB = __owl__.observer.notifyCB;
|
const currentCB = __owl__.observer.notifyCB;
|
||||||
__owl__.observer.notifyCB = function() {
|
__owl__.observer.notifyCB = function () {
|
||||||
if (ctx.rev > mapping[id]) {
|
if (ctx.rev > mapping[id]) {
|
||||||
// in this case, the context has been updated since we were rendering
|
// in this case, the context has been updated since we were rendering
|
||||||
// last, and we do not need to render here with the observer. A
|
// last, and we do not need to render here with the observer. A
|
||||||
@@ -128,18 +128,18 @@ export function useContextWithCB(ctx: Context, component: Component, method): an
|
|||||||
|
|
||||||
mapping[id] = 0;
|
mapping[id] = 0;
|
||||||
const renderFn = __owl__.renderFn;
|
const renderFn = __owl__.renderFn;
|
||||||
__owl__.renderFn = function(comp, params) {
|
__owl__.renderFn = function (comp, params) {
|
||||||
mapping[id] = ctx.rev;
|
mapping[id] = ctx.rev;
|
||||||
return renderFn(comp, params);
|
return renderFn(comp, params);
|
||||||
};
|
};
|
||||||
ctx.on("update", component, async contextRev => {
|
ctx.on("update", component, async (contextRev) => {
|
||||||
if (mapping[id] < contextRev) {
|
if (mapping[id] < contextRev) {
|
||||||
mapping[id] = contextRev;
|
mapping[id] = contextRev;
|
||||||
await method();
|
await method();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
const __destroy = component.__destroy;
|
const __destroy = component.__destroy;
|
||||||
component.__destroy = parent => {
|
component.__destroy = (parent) => {
|
||||||
ctx.off("update", component);
|
ctx.off("update", component);
|
||||||
delete mapping[id];
|
delete mapping[id];
|
||||||
__destroy.call(component, parent);
|
__destroy.call(component, parent);
|
||||||
|
|||||||
@@ -44,7 +44,7 @@ export class EventBus {
|
|||||||
}
|
}
|
||||||
this.subscriptions[eventType].push({
|
this.subscriptions[eventType].push({
|
||||||
owner,
|
owner,
|
||||||
callback
|
callback,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -54,7 +54,7 @@ export class EventBus {
|
|||||||
off(eventType: string, owner: any) {
|
off(eventType: string, owner: any) {
|
||||||
const subs = this.subscriptions[eventType];
|
const subs = this.subscriptions[eventType];
|
||||||
if (subs) {
|
if (subs) {
|
||||||
this.subscriptions[eventType] = subs.filter(s => s.owner !== owner);
|
this.subscriptions[eventType] = subs.filter((s) => s.owner !== owner);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -67,14 +67,14 @@ export class Observer {
|
|||||||
self.notifyCB();
|
self.notifyCB();
|
||||||
}
|
}
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const metadata = {
|
const metadata = {
|
||||||
value,
|
value,
|
||||||
proxy,
|
proxy,
|
||||||
rev: this.rev,
|
rev: this.rev,
|
||||||
parent
|
parent,
|
||||||
};
|
};
|
||||||
|
|
||||||
this.weakMap.set(value, metadata);
|
this.weakMap.set(value, metadata);
|
||||||
|
|||||||
+7
-7
@@ -36,11 +36,11 @@ export function useState<T>(state: T): T {
|
|||||||
// -----------------------------------------------------------------------------
|
// -----------------------------------------------------------------------------
|
||||||
function makeLifecycleHook(method: string, reverse: boolean = false) {
|
function makeLifecycleHook(method: string, reverse: boolean = false) {
|
||||||
if (reverse) {
|
if (reverse) {
|
||||||
return function(cb) {
|
return function (cb) {
|
||||||
const component: Component = Component.current!;
|
const component: Component = Component.current!;
|
||||||
if (component.__owl__[method]) {
|
if (component.__owl__[method]) {
|
||||||
const current = component.__owl__[method];
|
const current = component.__owl__[method];
|
||||||
component.__owl__[method] = function() {
|
component.__owl__[method] = function () {
|
||||||
current.call(component);
|
current.call(component);
|
||||||
cb.call(component);
|
cb.call(component);
|
||||||
};
|
};
|
||||||
@@ -49,11 +49,11 @@ function makeLifecycleHook(method: string, reverse: boolean = false) {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
return function(cb) {
|
return function (cb) {
|
||||||
const component: Component = Component.current!;
|
const component: Component = Component.current!;
|
||||||
if (component.__owl__[method]) {
|
if (component.__owl__[method]) {
|
||||||
const current = component.__owl__[method];
|
const current = component.__owl__[method];
|
||||||
component.__owl__[method] = function() {
|
component.__owl__[method] = function () {
|
||||||
cb.call(component);
|
cb.call(component);
|
||||||
current.call(component);
|
current.call(component);
|
||||||
};
|
};
|
||||||
@@ -65,11 +65,11 @@ function makeLifecycleHook(method: string, reverse: boolean = false) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function makeAsyncHook(method: string) {
|
function makeAsyncHook(method: string) {
|
||||||
return function(cb) {
|
return function (cb) {
|
||||||
const component: Component = Component.current!;
|
const component: Component = Component.current!;
|
||||||
if (component.__owl__[method]) {
|
if (component.__owl__[method]) {
|
||||||
const current = component.__owl__[method];
|
const current = component.__owl__[method];
|
||||||
component.__owl__[method] = function(...args) {
|
component.__owl__[method] = function (...args) {
|
||||||
return Promise.all([current.call(component, ...args), cb.call(component, ...args)]);
|
return Promise.all([current.call(component, ...args), cb.call(component, ...args)]);
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
@@ -114,7 +114,7 @@ export function useRef(name: string): Ref {
|
|||||||
get comp(): Component | null {
|
get comp(): Component | null {
|
||||||
const val = __owl__.refs && __owl__.refs[name];
|
const val = __owl__.refs && __owl__.refs[name];
|
||||||
return val instanceof Component ? val : null;
|
return val instanceof Component ? val : null;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
+1
-1
@@ -35,6 +35,6 @@ export const hooks = Object.assign({}, _hooks, {
|
|||||||
useContext: _context.useContext,
|
useContext: _context.useContext,
|
||||||
useDispatch: _store.useDispatch,
|
useDispatch: _store.useDispatch,
|
||||||
useGetters: _store.useGetters,
|
useGetters: _store.useGetters,
|
||||||
useStore: _store.useStore
|
useStore: _store.useStore,
|
||||||
});
|
});
|
||||||
export const __info__ = {};
|
export const __info__ = {};
|
||||||
|
|||||||
+4
-4
@@ -26,8 +26,8 @@ export class Portal extends Component<Props> {
|
|||||||
static template = xml`<portal><t t-slot="default"/></portal>`;
|
static template = xml`<portal><t t-slot="default"/></portal>`;
|
||||||
static props = {
|
static props = {
|
||||||
target: {
|
target: {
|
||||||
type: String
|
type: String,
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
// boolean to indicate whether or not we must listen to 'dom-appended' event
|
// boolean to indicate whether or not we must listen to 'dom-appended' event
|
||||||
@@ -55,12 +55,12 @@ export class Portal extends Component<Props> {
|
|||||||
// put a callback in the env that is propagated to children s.t. portal can
|
// put a callback in the env that is propagated to children s.t. portal can
|
||||||
// register an handler to those events just before children will trigger them
|
// register an handler to those events just before children will trigger them
|
||||||
useSubEnv({
|
useSubEnv({
|
||||||
[portalSymbol]: ev => {
|
[portalSymbol]: (ev) => {
|
||||||
if (!this._handledEvents.has(ev.type)) {
|
if (!this._handledEvents.has(ev.type)) {
|
||||||
this.portal!.elm!.addEventListener(ev.type, this._handlerTunnel);
|
this.portal!.elm!.addEventListener(ev.type, this._handlerTunnel);
|
||||||
this._handledEvents.add(ev.type);
|
this._handledEvents.add(ev.type);
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
|
|||||||
+10
-10
@@ -96,7 +96,7 @@ QWeb.addDirective({
|
|||||||
let value = ctx.getValue(node.getAttribute("t-esc")!);
|
let value = ctx.getValue(node.getAttribute("t-esc")!);
|
||||||
compileValueNode(value, node, qweb, ctx.subContext("escaping", true));
|
compileValueNode(value, node, qweb, ctx.subContext("escaping", true));
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
QWeb.addDirective({
|
QWeb.addDirective({
|
||||||
@@ -106,7 +106,7 @@ QWeb.addDirective({
|
|||||||
let value = ctx.getValue(node.getAttribute("t-raw")!);
|
let value = ctx.getValue(node.getAttribute("t-raw")!);
|
||||||
compileValueNode(value, node, qweb, ctx);
|
compileValueNode(value, node, qweb, ctx);
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -163,7 +163,7 @@ QWeb.addDirective({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -179,7 +179,7 @@ QWeb.addDirective({
|
|||||||
},
|
},
|
||||||
finalize({ ctx }) {
|
finalize({ ctx }) {
|
||||||
ctx.closeIf();
|
ctx.closeIf();
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
QWeb.addDirective({
|
QWeb.addDirective({
|
||||||
@@ -195,7 +195,7 @@ QWeb.addDirective({
|
|||||||
},
|
},
|
||||||
finalize({ ctx }) {
|
finalize({ ctx }) {
|
||||||
ctx.closeIf();
|
ctx.closeIf();
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
QWeb.addDirective({
|
QWeb.addDirective({
|
||||||
@@ -208,7 +208,7 @@ QWeb.addDirective({
|
|||||||
},
|
},
|
||||||
finalize({ ctx }) {
|
finalize({ ctx }) {
|
||||||
ctx.closeIf();
|
ctx.closeIf();
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -292,7 +292,7 @@ QWeb.addDirective({
|
|||||||
}
|
}
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -353,7 +353,7 @@ QWeb.addDirective({
|
|||||||
ctx.addLine("}");
|
ctx.addLine("}");
|
||||||
ctx.stopProtectScope(varsID);
|
ctx.stopProtectScope(varsID);
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -364,7 +364,7 @@ QWeb.addDirective({
|
|||||||
priority: 1,
|
priority: 1,
|
||||||
atNodeEncounter({ ctx }) {
|
atNodeEncounter({ ctx }) {
|
||||||
ctx.addLine("debugger;");
|
ctx.addLine("debugger;");
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -376,5 +376,5 @@ QWeb.addDirective({
|
|||||||
atNodeEncounter({ ctx, value }) {
|
atNodeEncounter({ ctx, value }) {
|
||||||
const expr = ctx.formatExpression(value);
|
const expr = ctx.formatExpression(value);
|
||||||
ctx.addLine(`console.log(${expr})`);
|
ctx.addLine(`console.log(${expr})`);
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -162,7 +162,7 @@ export class CompilationContext {
|
|||||||
const tokens = compileExprToArray(expr, this.variables);
|
const tokens = compileExprToArray(expr, this.variables);
|
||||||
const done = new Set();
|
const done = new Set();
|
||||||
return tokens
|
return tokens
|
||||||
.map(tok => {
|
.map((tok) => {
|
||||||
if (tok.varName) {
|
if (tok.varName) {
|
||||||
if (!done.has(tok.varName)) {
|
if (!done.has(tok.varName)) {
|
||||||
done.add(tok.varName);
|
done.add(tok.varName);
|
||||||
@@ -189,7 +189,7 @@ export class CompilationContext {
|
|||||||
return `(${this.formatExpression(s.slice(2, -2))})`;
|
return `(${this.formatExpression(s.slice(2, -2))})`;
|
||||||
}
|
}
|
||||||
|
|
||||||
let r = s.replace(/\{\{.*?\}\}/g, s => "${" + this.formatExpression(s.slice(2, -2)) + "}");
|
let r = s.replace(/\{\{.*?\}\}/g, (s) => "${" + this.formatExpression(s.slice(2, -2)) + "}");
|
||||||
return "`" + r + "`";
|
return "`" + r + "`";
|
||||||
}
|
}
|
||||||
startProtectScope(codeBlock?: boolean): number {
|
startProtectScope(codeBlock?: boolean): number {
|
||||||
|
|||||||
@@ -35,7 +35,7 @@ const WORD_REPLACEMENT = {
|
|||||||
gt: ">",
|
gt: ">",
|
||||||
gte: ">=",
|
gte: ">=",
|
||||||
lt: "<",
|
lt: "<",
|
||||||
lte: "<="
|
lte: "<=",
|
||||||
};
|
};
|
||||||
|
|
||||||
export interface QWebVar {
|
export interface QWebVar {
|
||||||
@@ -77,7 +77,7 @@ const STATIC_TOKEN_MAP: { [key: string]: TKind } = {
|
|||||||
":": "COLON",
|
":": "COLON",
|
||||||
",": "COMMA",
|
",": "COMMA",
|
||||||
"(": "LEFT_PAREN",
|
"(": "LEFT_PAREN",
|
||||||
")": "RIGHT_PAREN"
|
")": "RIGHT_PAREN",
|
||||||
};
|
};
|
||||||
|
|
||||||
// note that the space after typeof is relevant. It makes sure that the formatted
|
// note that the space after typeof is relevant. It makes sure that the formatted
|
||||||
@@ -86,7 +86,7 @@ const OPERATORS = "...,.,===,==,+,!==,!=,!,||,&&,>=,>,<=,<,?,-,*,/,%,typeof ,=>,
|
|||||||
|
|
||||||
type Tokenizer = (expr: string) => Token | false;
|
type Tokenizer = (expr: string) => Token | false;
|
||||||
|
|
||||||
let tokenizeString: Tokenizer = function(expr) {
|
let tokenizeString: Tokenizer = function (expr) {
|
||||||
let s = expr[0];
|
let s = expr[0];
|
||||||
let start = s;
|
let start = s;
|
||||||
if (s !== "'" && s !== '"') {
|
if (s !== "'" && s !== '"') {
|
||||||
@@ -114,7 +114,7 @@ let tokenizeString: Tokenizer = function(expr) {
|
|||||||
return { type: "VALUE", value: s };
|
return { type: "VALUE", value: s };
|
||||||
};
|
};
|
||||||
|
|
||||||
let tokenizeNumber: Tokenizer = function(expr) {
|
let tokenizeNumber: Tokenizer = function (expr) {
|
||||||
let s = expr[0];
|
let s = expr[0];
|
||||||
if (s && s.match(/[0-9]/)) {
|
if (s && s.match(/[0-9]/)) {
|
||||||
let i = 1;
|
let i = 1;
|
||||||
@@ -128,7 +128,7 @@ let tokenizeNumber: Tokenizer = function(expr) {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
let tokenizeSymbol: Tokenizer = function(expr) {
|
let tokenizeSymbol: Tokenizer = function (expr) {
|
||||||
let s = expr[0];
|
let s = expr[0];
|
||||||
if (s && s.match(/[a-zA-Z_\$]/)) {
|
if (s && s.match(/[a-zA-Z_\$]/)) {
|
||||||
let i = 1;
|
let i = 1;
|
||||||
@@ -145,7 +145,7 @@ let tokenizeSymbol: Tokenizer = function(expr) {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const tokenizeStatic: Tokenizer = function(expr) {
|
const tokenizeStatic: Tokenizer = function (expr) {
|
||||||
const char = expr[0];
|
const char = expr[0];
|
||||||
if (char && char in STATIC_TOKEN_MAP) {
|
if (char && char in STATIC_TOKEN_MAP) {
|
||||||
return { type: STATIC_TOKEN_MAP[char], value: char };
|
return { type: STATIC_TOKEN_MAP[char], value: char };
|
||||||
@@ -153,7 +153,7 @@ const tokenizeStatic: Tokenizer = function(expr) {
|
|||||||
return false;
|
return false;
|
||||||
};
|
};
|
||||||
|
|
||||||
const tokenizeOperator: Tokenizer = function(expr) {
|
const tokenizeOperator: Tokenizer = function (expr) {
|
||||||
for (let op of OPERATORS) {
|
for (let op of OPERATORS) {
|
||||||
if (expr.startsWith(op)) {
|
if (expr.startsWith(op)) {
|
||||||
return { type: "OPERATOR", value: op };
|
return { type: "OPERATOR", value: op };
|
||||||
@@ -167,7 +167,7 @@ const TOKENIZERS = [
|
|||||||
tokenizeNumber,
|
tokenizeNumber,
|
||||||
tokenizeOperator,
|
tokenizeOperator,
|
||||||
tokenizeSymbol,
|
tokenizeSymbol,
|
||||||
tokenizeStatic
|
tokenizeStatic,
|
||||||
];
|
];
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -284,6 +284,6 @@ export function compileExprToArray(expr: string, scope: { [key: string]: QWebVar
|
|||||||
|
|
||||||
export function compileExpr(expr: string, scope: { [key: string]: QWebVar }): string {
|
export function compileExpr(expr: string, scope: { [key: string]: QWebVar }): string {
|
||||||
return compileExprToArray(expr, scope)
|
return compileExprToArray(expr, scope)
|
||||||
.map(t => t.value)
|
.map((t) => t.value)
|
||||||
.join("");
|
.join("");
|
||||||
}
|
}
|
||||||
|
|||||||
+14
-14
@@ -23,7 +23,7 @@ import { QWeb } from "./qweb";
|
|||||||
export const MODS_CODE = {
|
export const MODS_CODE = {
|
||||||
prevent: "e.preventDefault();",
|
prevent: "e.preventDefault();",
|
||||||
self: "if (e.target !== this.elm) {return}",
|
self: "if (e.target !== this.elm) {return}",
|
||||||
stop: "e.stopPropagation();"
|
stop: "e.stopPropagation();",
|
||||||
};
|
};
|
||||||
|
|
||||||
interface HandlerInfo {
|
interface HandlerInfo {
|
||||||
@@ -50,7 +50,7 @@ export function makeHandlerCode(
|
|||||||
let code: string;
|
let code: string;
|
||||||
// check if it is a method with no args, a method with args or an expression
|
// check if it is a method with no args, a method with args or an expression
|
||||||
let args: string = "";
|
let args: string = "";
|
||||||
const name: string = value.replace(/\(.*\)/, function(_args) {
|
const name: string = value.replace(/\(.*\)/, function (_args) {
|
||||||
args = _args.slice(1, -1);
|
args = _args.slice(1, -1);
|
||||||
return "";
|
return "";
|
||||||
});
|
});
|
||||||
@@ -74,7 +74,7 @@ export function makeHandlerCode(
|
|||||||
putInCache = false;
|
putInCache = false;
|
||||||
code = ctx.captureExpression(value);
|
code = ctx.captureExpression(value);
|
||||||
}
|
}
|
||||||
const modCode = mods.map(mod => modcodes[mod]).join("");
|
const modCode = mods.map((mod) => modcodes[mod]).join("");
|
||||||
let handler = `function (e) {if (!context.__owl__.isMounted){return}${modCode}${code}}`;
|
let handler = `function (e) {if (!context.__owl__.isMounted){return}${modCode}${code}}`;
|
||||||
if (putInCache) {
|
if (putInCache) {
|
||||||
const key = ctx.generateTemplateKey(event);
|
const key = ctx.generateTemplateKey(event);
|
||||||
@@ -90,7 +90,7 @@ QWeb.addDirective({
|
|||||||
atNodeCreation({ ctx, fullName, value, nodeID }) {
|
atNodeCreation({ ctx, fullName, value, nodeID }) {
|
||||||
const { event, handler } = makeHandlerCode(ctx, fullName, value, true);
|
const { event, handler } = makeHandlerCode(ctx, fullName, value, true);
|
||||||
ctx.addLine(`p${nodeID}.on['${event}'] = ${handler};`);
|
ctx.addLine(`p${nodeID}.on['${event}'] = ${handler};`);
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -105,17 +105,17 @@ QWeb.addDirective({
|
|||||||
ctx.addLine(`const ${refKey} = ${ctx.interpolate(value)};`);
|
ctx.addLine(`const ${refKey} = ${ctx.interpolate(value)};`);
|
||||||
addNodeHook("create", `context.__owl__.refs[${refKey}] = n.elm;`);
|
addNodeHook("create", `context.__owl__.refs[${refKey}] = n.elm;`);
|
||||||
addNodeHook("destroy", `delete context.__owl__.refs[${refKey}];`);
|
addNodeHook("destroy", `delete context.__owl__.refs[${refKey}];`);
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
// t-transition
|
// t-transition
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
QWeb.utils.nextFrame = function(cb: () => void) {
|
QWeb.utils.nextFrame = function (cb: () => void) {
|
||||||
requestAnimationFrame(() => requestAnimationFrame(cb));
|
requestAnimationFrame(() => requestAnimationFrame(cb));
|
||||||
};
|
};
|
||||||
|
|
||||||
QWeb.utils.transitionInsert = function(vn: VNode, name: string) {
|
QWeb.utils.transitionInsert = function (vn: VNode, name: string) {
|
||||||
const elm = <HTMLElement>vn.elm;
|
const elm = <HTMLElement>vn.elm;
|
||||||
// remove potential duplicated vnode that is currently being removed, to
|
// remove potential duplicated vnode that is currently being removed, to
|
||||||
// prevent from having twice the same node in the DOM during an animation
|
// prevent from having twice the same node in the DOM during an animation
|
||||||
@@ -139,7 +139,7 @@ QWeb.utils.transitionInsert = function(vn: VNode, name: string) {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
QWeb.utils.transitionRemove = function(vn: VNode, name: string, rm: () => void) {
|
QWeb.utils.transitionRemove = function (vn: VNode, name: string, rm: () => void) {
|
||||||
const elm = <HTMLElement>vn.elm;
|
const elm = <HTMLElement>vn.elm;
|
||||||
elm.setAttribute("data-owl-key", vn.key!);
|
elm.setAttribute("data-owl-key", vn.key!);
|
||||||
|
|
||||||
@@ -209,12 +209,12 @@ QWeb.addDirective({
|
|||||||
let name = value;
|
let name = value;
|
||||||
const hooks = {
|
const hooks = {
|
||||||
insert: `utils.transitionInsert(vn, '${name}');`,
|
insert: `utils.transitionInsert(vn, '${name}');`,
|
||||||
remove: `utils.transitionRemove(vn, '${name}', rm);`
|
remove: `utils.transitionRemove(vn, '${name}', rm);`,
|
||||||
};
|
};
|
||||||
for (let hookName in hooks) {
|
for (let hookName in hooks) {
|
||||||
addNodeHook(hookName, hooks[hookName]);
|
addNodeHook(hookName, hooks[hookName]);
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -251,13 +251,13 @@ QWeb.addDirective({
|
|||||||
}
|
}
|
||||||
ctx.closeIf();
|
ctx.closeIf();
|
||||||
return true;
|
return true;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
// t-model
|
// t-model
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
QWeb.utils.toNumber = function(val: string): number | string {
|
QWeb.utils.toNumber = function (val: string): number | string {
|
||||||
const n = parseFloat(val);
|
const n = parseFloat(val);
|
||||||
return isNaN(n) ? val : n;
|
return isNaN(n) ? val : n;
|
||||||
};
|
};
|
||||||
@@ -305,7 +305,7 @@ QWeb.addDirective({
|
|||||||
}
|
}
|
||||||
ctx.addLine(`extra.handlers[${key}] = extra.handlers[${key}] || (${handler});`);
|
ctx.addLine(`extra.handlers[${key}] = extra.handlers[${key}] || (${handler});`);
|
||||||
ctx.addLine(`p${nodeID}.on['${event}'] = extra.handlers[${key}];`);
|
ctx.addLine(`p${nodeID}.on['${event}'] = extra.handlers[${key}];`);
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -329,5 +329,5 @@ QWeb.addDirective({
|
|||||||
if (ctx.loopNumber === 0) {
|
if (ctx.loopNumber === 0) {
|
||||||
ctx.rootContext.hasKey0 = ctx.keyStack.pop() as boolean;
|
ctx.rootContext.hasKey0 = ctx.keyStack.pop() as boolean;
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
+16
-16
@@ -77,7 +77,7 @@ const NODE_HOOKS_PARAMS = {
|
|||||||
create: "(_, n)",
|
create: "(_, n)",
|
||||||
insert: "vn",
|
insert: "vn",
|
||||||
remove: "(vn, rm)",
|
remove: "(vn, rm)",
|
||||||
destroy: "()"
|
destroy: "()",
|
||||||
};
|
};
|
||||||
|
|
||||||
interface Utils {
|
interface Utils {
|
||||||
@@ -112,9 +112,9 @@ const UTILS: Utils = {
|
|||||||
addNS(vnode.data, vnode.children, vnode.sel);
|
addNS(vnode.data, vnode.children, vnode.sel);
|
||||||
},
|
},
|
||||||
VDomArray: class VDomArray extends Array {},
|
VDomArray: class VDomArray extends Array {},
|
||||||
vDomToString: function(vdom: VNode[]): string {
|
vDomToString: function (vdom: VNode[]): string {
|
||||||
return vdom
|
return vdom
|
||||||
.map(vnode => {
|
.map((vnode) => {
|
||||||
if (vnode.sel) {
|
if (vnode.sel) {
|
||||||
const node = document.createElement(vnode.sel);
|
const node = document.createElement(vnode.sel);
|
||||||
const result = patch(node, vnode);
|
const result = patch(node, vnode);
|
||||||
@@ -145,7 +145,7 @@ const UTILS: Utils = {
|
|||||||
obj = newObj;
|
obj = newObj;
|
||||||
}
|
}
|
||||||
return obj;
|
return obj;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
function parseXML(xml: string): Document {
|
function parseXML(xml: string): Document {
|
||||||
@@ -195,7 +195,7 @@ export class QWeb extends EventBus {
|
|||||||
name: 1,
|
name: 1,
|
||||||
att: 1,
|
att: 1,
|
||||||
attf: 1,
|
attf: 1,
|
||||||
translation: 1
|
translation: 1,
|
||||||
};
|
};
|
||||||
static DIRECTIVES: Directive[] = [];
|
static DIRECTIVES: Directive[] = [];
|
||||||
|
|
||||||
@@ -239,7 +239,7 @@ export class QWeb extends EventBus {
|
|||||||
QWeb.DIRECTIVE_NAMES[directive.name] = 1;
|
QWeb.DIRECTIVE_NAMES[directive.name] = 1;
|
||||||
QWeb.DIRECTIVES.sort((d1, d2) => d1.priority - d2.priority);
|
QWeb.DIRECTIVES.sort((d1, d2) => d1.priority - d2.priority);
|
||||||
if (directive.extraNames) {
|
if (directive.extraNames) {
|
||||||
directive.extraNames.forEach(n => (QWeb.DIRECTIVE_NAMES[n] = 1));
|
directive.extraNames.forEach((n) => (QWeb.DIRECTIVE_NAMES[n] = 1));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -303,11 +303,11 @@ export class QWeb extends EventBus {
|
|||||||
this._processTemplate(elem);
|
this._processTemplate(elem);
|
||||||
const template = {
|
const template = {
|
||||||
elem,
|
elem,
|
||||||
fn: function(this: QWeb, context, extra) {
|
fn: function (this: QWeb, context, extra) {
|
||||||
const compiledFunction = this._compile(name, elem);
|
const compiledFunction = this._compile(name, elem);
|
||||||
template.fn = compiledFunction;
|
template.fn = compiledFunction;
|
||||||
return compiledFunction.call(this, context, extra);
|
return compiledFunction.call(this, context, extra);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
this.templates[name] = template;
|
this.templates[name] = template;
|
||||||
}
|
}
|
||||||
@@ -317,10 +317,10 @@ export class QWeb extends EventBus {
|
|||||||
for (let i = 0, ilen = tbranch.length; i < ilen; i++) {
|
for (let i = 0, ilen = tbranch.length; i < ilen; i++) {
|
||||||
let node = tbranch[i];
|
let node = tbranch[i];
|
||||||
let prevElem = node.previousElementSibling!;
|
let prevElem = node.previousElementSibling!;
|
||||||
let pattr = function(name) {
|
let pattr = function (name) {
|
||||||
return prevElem.getAttribute(name);
|
return prevElem.getAttribute(name);
|
||||||
};
|
};
|
||||||
let nattr = function(name) {
|
let nattr = function (name) {
|
||||||
return +!!node.getAttribute(name);
|
return +!!node.getAttribute(name);
|
||||||
};
|
};
|
||||||
if (prevElem && (pattr("t-if") || pattr("t-elif"))) {
|
if (prevElem && (pattr("t-if") || pattr("t-elif"))) {
|
||||||
@@ -330,7 +330,7 @@ export class QWeb extends EventBus {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
if (
|
if (
|
||||||
["t-if", "t-elif", "t-else"].map(nattr).reduce(function(a, b) {
|
["t-if", "t-elif", "t-else"].map(nattr).reduce(function (a, b) {
|
||||||
return a + b;
|
return a + b;
|
||||||
}) > 1
|
}) > 1
|
||||||
) {
|
) {
|
||||||
@@ -582,7 +582,7 @@ export class QWeb extends EventBus {
|
|||||||
qweb: this,
|
qweb: this,
|
||||||
ctx,
|
ctx,
|
||||||
fullName,
|
fullName,
|
||||||
value
|
value,
|
||||||
});
|
});
|
||||||
if (isDone) {
|
if (isDone) {
|
||||||
for (let { directive, value, fullName } of finalizers) {
|
for (let { directive, value, fullName } of finalizers) {
|
||||||
@@ -597,7 +597,7 @@ export class QWeb extends EventBus {
|
|||||||
let nodeID = this._compileGenericNode(node, ctx, withHandlers);
|
let nodeID = this._compileGenericNode(node, ctx, withHandlers);
|
||||||
ctx = ctx.withParent(nodeID);
|
ctx = ctx.withParent(nodeID);
|
||||||
let nodeHooks = {};
|
let nodeHooks = {};
|
||||||
let addNodeHook = function(hook, handler) {
|
let addNodeHook = function (hook, handler) {
|
||||||
nodeHooks[hook] = nodeHooks[hook] || [];
|
nodeHooks[hook] = nodeHooks[hook] || [];
|
||||||
nodeHooks[hook].push(handler);
|
nodeHooks[hook].push(handler);
|
||||||
};
|
};
|
||||||
@@ -611,7 +611,7 @@ export class QWeb extends EventBus {
|
|||||||
fullName,
|
fullName,
|
||||||
value,
|
value,
|
||||||
nodeID,
|
nodeID,
|
||||||
addNodeHook
|
addNodeHook,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -702,7 +702,7 @@ export class QWeb extends EventBus {
|
|||||||
if ((value = value.trim())) {
|
if ((value = value.trim())) {
|
||||||
let classDef = value
|
let classDef = value
|
||||||
.split(/\s+/)
|
.split(/\s+/)
|
||||||
.map(a => `'${escapeQuotes(a)}':true`)
|
.map((a) => `'${escapeQuotes(a)}':true`)
|
||||||
.join(",");
|
.join(",");
|
||||||
if (classObj) {
|
if (classObj) {
|
||||||
ctx.addLine(`Object.assign(${classObj}, {${classDef}})`);
|
ctx.addLine(`Object.assign(${classObj}, {${classDef}})`);
|
||||||
@@ -750,7 +750,7 @@ export class QWeb extends EventBus {
|
|||||||
const attValueID = ctx.generateID();
|
const attValueID = ctx.generateID();
|
||||||
ctx.addLine(`let _${attValueID} = ${formattedValue};`);
|
ctx.addLine(`let _${attValueID} = ${formattedValue};`);
|
||||||
formattedValue = `'${attValue}' + (_${attValueID} ? ' ' + _${attValueID} : '')`;
|
formattedValue = `'${attValue}' + (_${attValueID} ? ' ' + _${attValueID} : '')`;
|
||||||
const attrIndex = attrs.findIndex(att => att.startsWith(attName + ":"));
|
const attrIndex = attrs.findIndex((att) => att.startsWith(attName + ":"));
|
||||||
attrs.splice(attrIndex, 1);
|
attrs.splice(attrIndex, 1);
|
||||||
}
|
}
|
||||||
ctx.addLine(`let _${attID} = ${formattedValue};`);
|
ctx.addLine(`let _${attID} = ${formattedValue};`);
|
||||||
|
|||||||
@@ -97,7 +97,7 @@ export class Router {
|
|||||||
//--------------------------------------------------------------------------
|
//--------------------------------------------------------------------------
|
||||||
|
|
||||||
async start() {
|
async start() {
|
||||||
(this as any)._listener = ev => this._navigate(this.currentPath(), ev);
|
(this as any)._listener = (ev) => this._navigate(this.currentPath(), ev);
|
||||||
window.addEventListener("popstate", (this as any)._listener);
|
window.addEventListener("popstate", (this as any)._listener);
|
||||||
if (this.mode === "hash") {
|
if (this.mode === "hash") {
|
||||||
window.addEventListener("hashchange", (this as any)._listener);
|
window.addEventListener("hashchange", (this as any)._listener);
|
||||||
@@ -198,7 +198,7 @@ export class Router {
|
|||||||
return {
|
return {
|
||||||
type: "match",
|
type: "match",
|
||||||
route: route,
|
route: route,
|
||||||
params: params
|
params: params,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -223,7 +223,7 @@ export class Router {
|
|||||||
const result = await route.beforeRouteEnter({
|
const result = await route.beforeRouteEnter({
|
||||||
env: this.env,
|
env: this.env,
|
||||||
from: this.currentRoute,
|
from: this.currentRoute,
|
||||||
to: route
|
to: route,
|
||||||
});
|
});
|
||||||
if (result === false) {
|
if (result === false) {
|
||||||
return { type: "cancelled" };
|
return { type: "cancelled" };
|
||||||
|
|||||||
+7
-7
@@ -53,7 +53,7 @@ export class Store extends Context {
|
|||||||
if (config.getters) {
|
if (config.getters) {
|
||||||
const firstArg = {
|
const firstArg = {
|
||||||
state: this.state,
|
state: this.state,
|
||||||
getters: this.getters
|
getters: this.getters,
|
||||||
};
|
};
|
||||||
for (let g in config.getters) {
|
for (let g in config.getters) {
|
||||||
this.getters[g] = config.getters[g].bind(this, firstArg);
|
this.getters[g] = config.getters[g].bind(this, firstArg);
|
||||||
@@ -70,7 +70,7 @@ export class Store extends Context {
|
|||||||
dispatch: this.dispatch.bind(this),
|
dispatch: this.dispatch.bind(this),
|
||||||
env: this.env,
|
env: this.env,
|
||||||
state: this.state,
|
state: this.state,
|
||||||
getters: this.getters
|
getters: this.getters,
|
||||||
},
|
},
|
||||||
...payload
|
...payload
|
||||||
);
|
);
|
||||||
@@ -113,11 +113,11 @@ export function useStore(selector, options: SelectorOptions = {}): any {
|
|||||||
}
|
}
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
store.updateFunctions[componentId].push(function(): boolean {
|
store.updateFunctions[componentId].push(function (): boolean {
|
||||||
return selectCompareUpdate(store!.state, component.props);
|
return selectCompareUpdate(store!.state, component.props);
|
||||||
});
|
});
|
||||||
|
|
||||||
useContextWithCB(store, component, function(): Promise<void> | void {
|
useContextWithCB(store, component, function (): Promise<void> | void {
|
||||||
let shouldRender = false;
|
let shouldRender = false;
|
||||||
for (let fn of store.updateFunctions[componentId]) {
|
for (let fn of store.updateFunctions[componentId]) {
|
||||||
shouldRender = fn() || shouldRender;
|
shouldRender = fn() || shouldRender;
|
||||||
@@ -126,12 +126,12 @@ export function useStore(selector, options: SelectorOptions = {}): any {
|
|||||||
return component.render();
|
return component.render();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
onWillUpdateProps(props => {
|
onWillUpdateProps((props) => {
|
||||||
selectCompareUpdate(store.state, props);
|
selectCompareUpdate(store.state, props);
|
||||||
});
|
});
|
||||||
|
|
||||||
const __destroy = component.__destroy;
|
const __destroy = component.__destroy;
|
||||||
component.__destroy = parent => {
|
component.__destroy = (parent) => {
|
||||||
delete store.updateFunctions[componentId];
|
delete store.updateFunctions[componentId];
|
||||||
__destroy.call(component, parent);
|
__destroy.call(component, parent);
|
||||||
};
|
};
|
||||||
@@ -148,7 +148,7 @@ export function useStore(selector, options: SelectorOptions = {}): any {
|
|||||||
},
|
},
|
||||||
has(target, k) {
|
has(target, k) {
|
||||||
return k in result;
|
return k in result;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
+6
-6
@@ -13,13 +13,13 @@
|
|||||||
import { browser } from "./browser";
|
import { browser } from "./browser";
|
||||||
|
|
||||||
export function whenReady(fn?: any) {
|
export function whenReady(fn?: any) {
|
||||||
return new Promise(function(resolve) {
|
return new Promise(function (resolve) {
|
||||||
if (document.readyState !== "loading") {
|
if (document.readyState !== "loading") {
|
||||||
resolve();
|
resolve();
|
||||||
} else {
|
} else {
|
||||||
document.addEventListener("DOMContentLoaded", resolve, false);
|
document.addEventListener("DOMContentLoaded", resolve, false);
|
||||||
}
|
}
|
||||||
}).then(fn || function() {});
|
}).then(fn || function () {});
|
||||||
}
|
}
|
||||||
|
|
||||||
const loadedScripts: { [key: string]: Promise<void> } = {};
|
const loadedScripts: { [key: string]: Promise<void> } = {};
|
||||||
@@ -28,14 +28,14 @@ export function loadJS(url: string): Promise<void> {
|
|||||||
if (url in loadedScripts) {
|
if (url in loadedScripts) {
|
||||||
return loadedScripts[url];
|
return loadedScripts[url];
|
||||||
}
|
}
|
||||||
const promise: Promise<void> = new Promise(function(resolve, reject) {
|
const promise: Promise<void> = new Promise(function (resolve, reject) {
|
||||||
const script = document.createElement("script");
|
const script = document.createElement("script");
|
||||||
script.type = "text/javascript";
|
script.type = "text/javascript";
|
||||||
script.src = url;
|
script.src = url;
|
||||||
script.onload = function() {
|
script.onload = function () {
|
||||||
resolve();
|
resolve();
|
||||||
};
|
};
|
||||||
script.onerror = function() {
|
script.onerror = function () {
|
||||||
reject(`Error loading file '${url}'`);
|
reject(`Error loading file '${url}'`);
|
||||||
};
|
};
|
||||||
const head = document.head || document.getElementsByTagName("head")[0];
|
const head = document.head || document.getElementsByTagName("head")[0];
|
||||||
@@ -75,7 +75,7 @@ export function escape(str: string | number | undefined): string {
|
|||||||
*/
|
*/
|
||||||
export function debounce(func: Function, wait: number, immediate?: boolean): Function {
|
export function debounce(func: Function, wait: number, immediate?: boolean): Function {
|
||||||
let timeout;
|
let timeout;
|
||||||
return function(this: any) {
|
return function (this: any) {
|
||||||
const context = this;
|
const context = this;
|
||||||
const args = arguments;
|
const args = arguments;
|
||||||
function later() {
|
function later() {
|
||||||
|
|||||||
+3
-3
@@ -33,7 +33,7 @@ function updateProps(oldVnode: VNode, vnode: VNode): void {
|
|||||||
|
|
||||||
export const propsModule = {
|
export const propsModule = {
|
||||||
create: updateProps,
|
create: updateProps,
|
||||||
update: updateProps
|
update: updateProps,
|
||||||
} as Module;
|
} as Module;
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -151,7 +151,7 @@ function updateEventListeners(oldVnode: VNode, vnode?: VNode): void {
|
|||||||
export const eventListenersModule = {
|
export const eventListenersModule = {
|
||||||
create: updateEventListeners,
|
create: updateEventListeners,
|
||||||
update: updateEventListeners,
|
update: updateEventListeners,
|
||||||
destroy: updateEventListeners
|
destroy: updateEventListeners,
|
||||||
} as Module;
|
} as Module;
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -210,7 +210,7 @@ function updateAttrs(oldVnode: VNode, vnode: VNode): void {
|
|||||||
|
|
||||||
export const attrsModule = {
|
export const attrsModule = {
|
||||||
create: updateAttrs,
|
create: updateAttrs,
|
||||||
update: updateAttrs
|
update: updateAttrs,
|
||||||
} as Module;
|
} as Module;
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
|
|||||||
+1
-1
@@ -520,7 +520,7 @@ const htmlDomApi = {
|
|||||||
parentNode,
|
parentNode,
|
||||||
nextSibling,
|
nextSibling,
|
||||||
tagName,
|
tagName,
|
||||||
setTextContent
|
setTextContent,
|
||||||
} as DOMAPI;
|
} as DOMAPI;
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
|
|||||||
+13
-13
@@ -9,7 +9,7 @@ import {
|
|||||||
patchNextFrame,
|
patchNextFrame,
|
||||||
renderToDOM,
|
renderToDOM,
|
||||||
unpatchNextFrame,
|
unpatchNextFrame,
|
||||||
nextTick
|
nextTick,
|
||||||
} from "./helpers";
|
} from "./helpers";
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -71,7 +71,7 @@ describe("animations", () => {
|
|||||||
qweb.addTemplate("test", `<span t-transition="chimay">blue</span>`);
|
qweb.addTemplate("test", `<span t-transition="chimay">blue</span>`);
|
||||||
|
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(node.className).toBe("chimay-enter chimay-enter-active");
|
expect(node.className).toBe("chimay-enter chimay-enter-active");
|
||||||
cb();
|
cb();
|
||||||
expect(node.className).toBe("chimay-enter-active chimay-enter-to");
|
expect(node.className).toBe("chimay-enter-active chimay-enter-to");
|
||||||
@@ -91,7 +91,7 @@ describe("animations", () => {
|
|||||||
qweb.addTemplate("test", `<span t-transition="chimay">blue</span>`);
|
qweb.addTemplate("test", `<span t-transition="chimay">blue</span>`);
|
||||||
|
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(node.className).toBe("chimay-enter chimay-enter-active");
|
expect(node.className).toBe("chimay-enter chimay-enter-active");
|
||||||
cb();
|
cb();
|
||||||
expect(node.className).toBe("chimay-enter-active chimay-enter-to");
|
expect(node.className).toBe("chimay-enter-active chimay-enter-to");
|
||||||
@@ -112,7 +112,7 @@ describe("animations", () => {
|
|||||||
qweb.addTemplate("test", `<span t-transition="jupiler">blue</span>`);
|
qweb.addTemplate("test", `<span t-transition="jupiler">blue</span>`);
|
||||||
|
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(node.className).toBe("jupiler-enter jupiler-enter-active");
|
expect(node.className).toBe("jupiler-enter jupiler-enter-active");
|
||||||
cb();
|
cb();
|
||||||
expect(node.className).toBe("");
|
expect(node.className).toBe("");
|
||||||
@@ -139,7 +139,7 @@ describe("animations", () => {
|
|||||||
// insert widget into the DOM
|
// insert widget into the DOM
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
var spanNode;
|
var spanNode;
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(spanNode.className).toBe("chimay-enter chimay-enter-active");
|
expect(spanNode.className).toBe("chimay-enter chimay-enter-active");
|
||||||
cb();
|
cb();
|
||||||
expect(spanNode.className).toBe("chimay-enter-active chimay-enter-to");
|
expect(spanNode.className).toBe("chimay-enter-active chimay-enter-to");
|
||||||
@@ -155,7 +155,7 @@ describe("animations", () => {
|
|||||||
// remove span from the DOM
|
// remove span from the DOM
|
||||||
def = makeDeferred();
|
def = makeDeferred();
|
||||||
widget.state.hide = true;
|
widget.state.hide = true;
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(spanNode.className).toBe("chimay-leave chimay-leave-active");
|
expect(spanNode.className).toBe("chimay-leave chimay-leave-active");
|
||||||
cb();
|
cb();
|
||||||
expect(spanNode.className).toBe("chimay-leave-active chimay-leave-to");
|
expect(spanNode.className).toBe("chimay-leave-active chimay-leave-to");
|
||||||
@@ -182,7 +182,7 @@ describe("animations", () => {
|
|||||||
// insert widget into the DOM
|
// insert widget into the DOM
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
var spanNode;
|
var spanNode;
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(spanNode.className).toBe("chimay-enter chimay-enter-active");
|
expect(spanNode.className).toBe("chimay-enter chimay-enter-active");
|
||||||
cb();
|
cb();
|
||||||
expect(spanNode.className).toBe("chimay-enter-active chimay-enter-to");
|
expect(spanNode.className).toBe("chimay-enter-active chimay-enter-to");
|
||||||
@@ -210,7 +210,7 @@ describe("animations", () => {
|
|||||||
|
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
var spanNode;
|
var spanNode;
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(fixture.innerHTML).toBe(
|
expect(fixture.innerHTML).toBe(
|
||||||
'<div><span class="chimay-enter chimay-enter-active">blue</span></div>'
|
'<div><span class="chimay-enter chimay-enter-active">blue</span></div>'
|
||||||
);
|
);
|
||||||
@@ -250,7 +250,7 @@ describe("animations", () => {
|
|||||||
|
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
var spanNode;
|
var spanNode;
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(fixture.innerHTML).toBe(
|
expect(fixture.innerHTML).toBe(
|
||||||
'<div><span class="chimay-enter chimay-enter-active">blue</span></div>'
|
'<div><span class="chimay-enter chimay-enter-active">blue</span></div>'
|
||||||
);
|
);
|
||||||
@@ -275,7 +275,7 @@ describe("animations", () => {
|
|||||||
// remove span from the DOM
|
// remove span from the DOM
|
||||||
def = makeDeferred();
|
def = makeDeferred();
|
||||||
widget.state.display = false;
|
widget.state.display = false;
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
expect(fixture.innerHTML).toBe(
|
expect(fixture.innerHTML).toBe(
|
||||||
'<div><span class="chimay-leave chimay-leave-active" data-owl-key="__3__">blue</span></div>'
|
'<div><span class="chimay-leave chimay-leave-active" data-owl-key="__3__">blue</span></div>'
|
||||||
);
|
);
|
||||||
@@ -315,7 +315,7 @@ describe("animations", () => {
|
|||||||
|
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
let phase = "enter";
|
let phase = "enter";
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
let spans = fixture.querySelectorAll("span");
|
let spans = fixture.querySelectorAll("span");
|
||||||
expect(spans.length).toBe(1);
|
expect(spans.length).toBe(1);
|
||||||
expect(spans[0].className).toBe(`chimay-${phase} chimay-${phase}-active`);
|
expect(spans[0].className).toBe(`chimay-${phase} chimay-${phase}-active`);
|
||||||
@@ -366,7 +366,7 @@ describe("animations", () => {
|
|||||||
|
|
||||||
let def = makeDeferred();
|
let def = makeDeferred();
|
||||||
let phase = "enter";
|
let phase = "enter";
|
||||||
patchNextFrame(cb => {
|
patchNextFrame((cb) => {
|
||||||
let spans = fixture.querySelectorAll("span");
|
let spans = fixture.querySelectorAll("span");
|
||||||
expect(spans.length).toBe(1);
|
expect(spans.length).toBe(1);
|
||||||
expect(spans[0].className).toBe(`chimay-${phase} chimay-${phase}-active`);
|
expect(spans[0].className).toBe(`chimay-${phase} chimay-${phase}-active`);
|
||||||
@@ -413,7 +413,7 @@ describe("animations", () => {
|
|||||||
state = useState({ flag: false });
|
state = useState({ flag: false });
|
||||||
}
|
}
|
||||||
|
|
||||||
patchNextFrame(cb => cb());
|
patchNextFrame((cb) => cb());
|
||||||
|
|
||||||
const widget = new Parent();
|
const widget = new Parent();
|
||||||
await widget.mount(fixture);
|
await widget.mount(fixture);
|
||||||
|
|||||||
@@ -27,7 +27,7 @@ afterEach(() => {
|
|||||||
|
|
||||||
function children(w: Component): Component[] {
|
function children(w: Component): Component[] {
|
||||||
const childrenMap = w.__owl__.children;
|
const childrenMap = w.__owl__.children;
|
||||||
return Object.keys(childrenMap).map(id => childrenMap[id]);
|
return Object.keys(childrenMap).map((id) => childrenMap[id]);
|
||||||
}
|
}
|
||||||
|
|
||||||
describe("async rendering", () => {
|
describe("async rendering", () => {
|
||||||
@@ -404,7 +404,7 @@ describe("async rendering", () => {
|
|||||||
}
|
}
|
||||||
class ChildB extends Component {
|
class ChildB extends Component {
|
||||||
willStart(): any {
|
willStart(): any {
|
||||||
return new Promise(function() {});
|
return new Promise(function () {});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
|
|||||||
@@ -10,7 +10,7 @@ import {
|
|||||||
nextMicroTick,
|
nextMicroTick,
|
||||||
nextTick,
|
nextTick,
|
||||||
normalize,
|
normalize,
|
||||||
editInput
|
editInput,
|
||||||
} from "../helpers";
|
} from "../helpers";
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -39,7 +39,7 @@ afterEach(() => {
|
|||||||
|
|
||||||
function children(w: Component): Component[] {
|
function children(w: Component): Component[] {
|
||||||
const childrenMap = w.__owl__.children;
|
const childrenMap = w.__owl__.children;
|
||||||
return Object.keys(childrenMap).map(id => childrenMap[id]);
|
return Object.keys(childrenMap).map((id) => childrenMap[id]);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Test components
|
// Test components
|
||||||
@@ -133,7 +133,7 @@ describe("basic widget properties", () => {
|
|||||||
static template = xml`
|
static template = xml`
|
||||||
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
counter: 0
|
counter: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -167,7 +167,7 @@ describe("basic widget properties", () => {
|
|||||||
static template = xml`
|
static template = xml`
|
||||||
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
counter: 0
|
counter: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -537,7 +537,7 @@ describe("lifecycle hooks", () => {
|
|||||||
"child:mounted",
|
"child:mounted",
|
||||||
"parent:willUnmount",
|
"parent:willUnmount",
|
||||||
"child:willUnmount",
|
"child:willUnmount",
|
||||||
"childchild:willUnmount"
|
"childchild:willUnmount",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -589,7 +589,7 @@ describe("lifecycle hooks", () => {
|
|||||||
"childchild:willPatch",
|
"childchild:willPatch",
|
||||||
"childchild:patched",
|
"childchild:patched",
|
||||||
"child:patched",
|
"child:patched",
|
||||||
"parent:patched"
|
"parent:patched",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -782,7 +782,7 @@ describe("lifecycle hooks", () => {
|
|||||||
"c mounted",
|
"c mounted",
|
||||||
"p mounted",
|
"p mounted",
|
||||||
"p willunmount",
|
"p willunmount",
|
||||||
"c willunmount"
|
"c willunmount",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -960,7 +960,7 @@ describe("lifecycle hooks", () => {
|
|||||||
"parent:willPatch",
|
"parent:willPatch",
|
||||||
"child:willPatch",
|
"child:willPatch",
|
||||||
"child:patched",
|
"child:patched",
|
||||||
"parent:patched"
|
"parent:patched",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@@ -1134,7 +1134,7 @@ describe("composition", () => {
|
|||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<t t-component="myComponent" t-key="state.child"/>`;
|
static template = xml`<t t-component="myComponent" t-key="state.child"/>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
child: "a"
|
child: "a",
|
||||||
});
|
});
|
||||||
get myComponent() {
|
get myComponent() {
|
||||||
return this.state.child === "a" ? A : B;
|
return this.state.child === "a" ? A : B;
|
||||||
@@ -1158,7 +1158,7 @@ describe("composition", () => {
|
|||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<t t-component="myComponent" t-key="state.child"/>`;
|
static template = xml`<t t-component="myComponent" t-key="state.child"/>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
child: "a"
|
child: "a",
|
||||||
});
|
});
|
||||||
get myComponent() {
|
get myComponent() {
|
||||||
return this.state.child === "a" ? A : B;
|
return this.state.child === "a" ? A : B;
|
||||||
@@ -1228,7 +1228,7 @@ describe("composition", () => {
|
|||||||
static template = xml`
|
static template = xml`
|
||||||
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
counter: 0
|
counter: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1327,7 +1327,7 @@ describe("composition", () => {
|
|||||||
static template = xml`
|
static template = xml`
|
||||||
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
counter: 0
|
counter: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1350,7 +1350,7 @@ describe("composition", () => {
|
|||||||
static template = xml`
|
static template = xml`
|
||||||
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
<div><t t-esc="state.counter"/><button t-on-click="state.counter++">Inc</button></div>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
counter: 0
|
counter: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1389,7 +1389,7 @@ describe("composition", () => {
|
|||||||
);
|
);
|
||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
state = useState({
|
state = useState({
|
||||||
numbers: [1, 2, 3]
|
numbers: [1, 2, 3],
|
||||||
});
|
});
|
||||||
static components = { ChildWidget };
|
static components = { ChildWidget };
|
||||||
}
|
}
|
||||||
@@ -1429,7 +1429,7 @@ describe("composition", () => {
|
|||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
static template = "parent";
|
static template = "parent";
|
||||||
state = useState({
|
state = useState({
|
||||||
numbers: [1, 2, 3]
|
numbers: [1, 2, 3],
|
||||||
});
|
});
|
||||||
static components = { ChildWidget };
|
static components = { ChildWidget };
|
||||||
}
|
}
|
||||||
@@ -1513,8 +1513,8 @@ describe("composition", () => {
|
|||||||
blips: [
|
blips: [
|
||||||
{ a: "a", id: 1 },
|
{ a: "a", id: 1 },
|
||||||
{ b: "b", id: 2 },
|
{ b: "b", id: 2 },
|
||||||
{ c: "c", id: 4 }
|
{ c: "c", id: 4 },
|
||||||
]
|
],
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
const parent = new Parent();
|
const parent = new Parent();
|
||||||
@@ -1621,8 +1621,8 @@ describe("composition", () => {
|
|||||||
records: [
|
records: [
|
||||||
{ id: 1, val: 1 },
|
{ id: 1, val: 1 },
|
||||||
{ id: 2, val: 2 },
|
{ id: 2, val: 2 },
|
||||||
{ id: 3, val: 3 }
|
{ id: 3, val: 3 },
|
||||||
]
|
],
|
||||||
});
|
});
|
||||||
static components = { ChildWidget };
|
static components = { ChildWidget };
|
||||||
}
|
}
|
||||||
@@ -2003,7 +2003,7 @@ describe("other directives with t-component", () => {
|
|||||||
}
|
}
|
||||||
const widget = new ParentWidget();
|
const widget = new ParentWidget();
|
||||||
await widget.mount(fixture);
|
await widget.mount(fixture);
|
||||||
(<HTMLElement>fixture).addEventListener("ev", function(e) {
|
(<HTMLElement>fixture).addEventListener("ev", function (e) {
|
||||||
steps.push(e.defaultPrevented);
|
steps.push(e.defaultPrevented);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -2038,7 +2038,7 @@ describe("other directives with t-component", () => {
|
|||||||
}
|
}
|
||||||
const widget = new ParentWidget();
|
const widget = new ParentWidget();
|
||||||
await widget.mount(fixture);
|
await widget.mount(fixture);
|
||||||
(<HTMLElement>fixture).addEventListener("ev", function(e) {
|
(<HTMLElement>fixture).addEventListener("ev", function (e) {
|
||||||
steps.push(e.defaultPrevented);
|
steps.push(e.defaultPrevented);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -2976,7 +2976,7 @@ describe("random stuff/miscellaneous", () => {
|
|||||||
"D:mounted",
|
"D:mounted",
|
||||||
"C:mounted",
|
"C:mounted",
|
||||||
"B:mounted",
|
"B:mounted",
|
||||||
"A:mounted"
|
"A:mounted",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
// update
|
// update
|
||||||
@@ -2999,7 +2999,7 @@ describe("random stuff/miscellaneous", () => {
|
|||||||
"E:destroy",
|
"E:destroy",
|
||||||
"F:mounted",
|
"F:mounted",
|
||||||
"D:patched",
|
"D:patched",
|
||||||
"C:patched"
|
"C:patched",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -3410,7 +3410,7 @@ describe("t-model directive", () => {
|
|||||||
state = useState([
|
state = useState([
|
||||||
{ f: false, id: 1 },
|
{ f: false, id: 1 },
|
||||||
{ f: false, id: 2 },
|
{ f: false, id: 2 },
|
||||||
{ f: false, id: 3 }
|
{ f: false, id: 3 },
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
const comp = new SomeComponent();
|
const comp = new SomeComponent();
|
||||||
@@ -3455,7 +3455,7 @@ describe("environment and plugins", () => {
|
|||||||
let bus = new EventBus();
|
let bus = new EventBus();
|
||||||
|
|
||||||
// definition of a plugin
|
// definition of a plugin
|
||||||
const somePlugin = env => {
|
const somePlugin = (env) => {
|
||||||
env.someFlag = true;
|
env.someFlag = true;
|
||||||
bus.on("some-event", null, () => {
|
bus.on("some-event", null, () => {
|
||||||
env.someFlag = !env.someFlag;
|
env.someFlag = !env.someFlag;
|
||||||
|
|||||||
@@ -92,7 +92,7 @@ describe("props validation", () => {
|
|||||||
{ type: String, ok: "1", ko: 1 },
|
{ type: String, ok: "1", ko: 1 },
|
||||||
{ type: Object, ok: {}, ko: "1" },
|
{ type: Object, ok: {}, ko: "1" },
|
||||||
{ type: Date, ok: new Date(), ko: "1" },
|
{ type: Date, ok: new Date(), ko: "1" },
|
||||||
{ type: Function, ok: () => {}, ko: "1" }
|
{ type: Function, ok: () => {}, ko: "1" },
|
||||||
];
|
];
|
||||||
|
|
||||||
let props;
|
let props;
|
||||||
@@ -149,7 +149,7 @@ describe("props validation", () => {
|
|||||||
{ type: String, ok: "1", ko: 1 },
|
{ type: String, ok: "1", ko: 1 },
|
||||||
{ type: Object, ok: {}, ko: "1" },
|
{ type: Object, ok: {}, ko: "1" },
|
||||||
{ type: Date, ok: new Date(), ko: "1" },
|
{ type: Date, ok: new Date(), ko: "1" },
|
||||||
{ type: Function, ok: () => {}, ko: "1" }
|
{ type: Function, ok: () => {}, ko: "1" },
|
||||||
];
|
];
|
||||||
|
|
||||||
let props;
|
let props;
|
||||||
@@ -396,7 +396,7 @@ describe("props validation", () => {
|
|||||||
class TestWidget extends Component {
|
class TestWidget extends Component {
|
||||||
static template = xml`<div>hey</div>`;
|
static template = xml`<div>hey</div>`;
|
||||||
static props = {
|
static props = {
|
||||||
p: { type: Object, shape: { id: Number, url: String } }
|
p: { type: Object, shape: { id: Number, url: String } },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
@@ -458,9 +458,9 @@ describe("props validation", () => {
|
|||||||
type: Object,
|
type: Object,
|
||||||
shape: {
|
shape: {
|
||||||
id: Number,
|
id: Number,
|
||||||
url: [Boolean, { type: Array, element: Number }]
|
url: [Boolean, { type: Array, element: Number }],
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
@@ -510,10 +510,10 @@ describe("props validation", () => {
|
|||||||
element: {
|
element: {
|
||||||
type: Object,
|
type: Object,
|
||||||
shape: {
|
shape: {
|
||||||
num: { type: Number, optional: true }
|
num: { type: Number, optional: true },
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
let error;
|
let error;
|
||||||
@@ -539,8 +539,8 @@ describe("props validation", () => {
|
|||||||
class TestComponent extends Component {
|
class TestComponent extends Component {
|
||||||
static props = {
|
static props = {
|
||||||
size: {
|
size: {
|
||||||
validate: e => ["small", "medium", "large"].includes(e)
|
validate: (e) => ["small", "medium", "large"].includes(e),
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
let error;
|
let error;
|
||||||
@@ -561,13 +561,13 @@ describe("props validation", () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
test("can validate with a custom validator, and a type", () => {
|
test("can validate with a custom validator, and a type", () => {
|
||||||
const validator = jest.fn(n => 0 <= n && n <= 10);
|
const validator = jest.fn((n) => 0 <= n && n <= 10);
|
||||||
class TestComponent extends Component {
|
class TestComponent extends Component {
|
||||||
static props = {
|
static props = {
|
||||||
n: {
|
n: {
|
||||||
type: Number,
|
type: Number,
|
||||||
validate: validator
|
validate: validator,
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
let error;
|
let error;
|
||||||
|
|||||||
@@ -28,7 +28,7 @@ afterEach(() => {
|
|||||||
|
|
||||||
function children(w: Component): Component[] {
|
function children(w: Component): Component[] {
|
||||||
const childrenMap = w.__owl__.children;
|
const childrenMap = w.__owl__.children;
|
||||||
return Object.keys(childrenMap).map(id => childrenMap[id]);
|
return Object.keys(childrenMap).map((id) => childrenMap[id]);
|
||||||
}
|
}
|
||||||
|
|
||||||
//------------------------------------------------------------------------------
|
//------------------------------------------------------------------------------
|
||||||
@@ -224,8 +224,8 @@ describe("t-slot directive", () => {
|
|||||||
state = useState({
|
state = useState({
|
||||||
users: [
|
users: [
|
||||||
{ id: 1, name: "Aaron" },
|
{ id: 1, name: "Aaron" },
|
||||||
{ id: 2, name: "David" }
|
{ id: 2, name: "David" },
|
||||||
]
|
],
|
||||||
});
|
});
|
||||||
static components = { Link };
|
static components = { Link };
|
||||||
}
|
}
|
||||||
@@ -268,8 +268,8 @@ describe("t-slot directive", () => {
|
|||||||
state = useState({
|
state = useState({
|
||||||
users: [
|
users: [
|
||||||
{ id: 1, name: "Aaron" },
|
{ id: 1, name: "Aaron" },
|
||||||
{ id: 2, name: "David" }
|
{ id: 2, name: "David" },
|
||||||
]
|
],
|
||||||
});
|
});
|
||||||
static components = { Link };
|
static components = { Link };
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -335,7 +335,7 @@ describe("unmounting and remounting", () => {
|
|||||||
class Child extends Component {
|
class Child extends Component {
|
||||||
static template = xml`<span t-esc="state.val"/>`;
|
static template = xml`<span t-esc="state.val"/>`;
|
||||||
state = useState({
|
state = useState({
|
||||||
val: "C1"
|
val: "C1",
|
||||||
});
|
});
|
||||||
constructor(parent, props) {
|
constructor(parent, props) {
|
||||||
super(parent, props);
|
super(parent, props);
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ describe("event bus behaviour", () => {
|
|||||||
expect.assertions(1);
|
expect.assertions(1);
|
||||||
const bus = new EventBus();
|
const bus = new EventBus();
|
||||||
const owner = {};
|
const owner = {};
|
||||||
bus.on("event", owner, function(this: any) {
|
bus.on("event", owner, function (this: any) {
|
||||||
expect(this).toBe(owner);
|
expect(this).toBe(owner);
|
||||||
});
|
});
|
||||||
bus.trigger("event");
|
bus.trigger("event");
|
||||||
|
|||||||
@@ -22,7 +22,7 @@ describe("observer", () => {
|
|||||||
expect(observer.rev).toBe(2);
|
expect(observer.rev).toBe(2);
|
||||||
|
|
||||||
expect(obj2).toEqual({
|
expect(obj2).toEqual({
|
||||||
a: 2
|
a: 2,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -47,7 +47,7 @@ describe("observer", () => {
|
|||||||
expect(observer.rev).toBe(5);
|
expect(observer.rev).toBe(5);
|
||||||
expect(obj).toEqual({
|
expect(obj).toEqual({
|
||||||
a: null,
|
a: null,
|
||||||
b: undefined
|
b: undefined,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
+3
-3
@@ -9,7 +9,7 @@ import "../src/component/directive";
|
|||||||
import { browser } from "../src/browser";
|
import { browser } from "../src/browser";
|
||||||
|
|
||||||
// modifies scheduler to make it faster to test components
|
// modifies scheduler to make it faster to test components
|
||||||
scheduler.requestAnimationFrame = function(callback: FrameRequestCallback) {
|
scheduler.requestAnimationFrame = function (callback: FrameRequestCallback) {
|
||||||
setTimeout(callback, 1);
|
setTimeout(callback, 1);
|
||||||
return 1;
|
return 1;
|
||||||
};
|
};
|
||||||
@@ -43,7 +43,7 @@ export function nextMicroTick(): Promise<void> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export async function nextTick(): Promise<void> {
|
export async function nextTick(): Promise<void> {
|
||||||
return new Promise(function(resolve) {
|
return new Promise(function (resolve) {
|
||||||
setTimeout(() => scheduler.requestAnimationFrame(() => resolve()));
|
setTimeout(() => scheduler.requestAnimationFrame(() => resolve()));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -77,7 +77,7 @@ export function makeDeferred(): Deferred {
|
|||||||
export function makeTestEnv(): Env {
|
export function makeTestEnv(): Env {
|
||||||
return {
|
return {
|
||||||
qweb: new QWeb(),
|
qweb: new QWeb(),
|
||||||
browser: browser
|
browser: browser,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
+6
-6
@@ -10,7 +10,7 @@ import {
|
|||||||
onWillStart,
|
onWillStart,
|
||||||
onWillUpdateProps,
|
onWillUpdateProps,
|
||||||
useSubEnv,
|
useSubEnv,
|
||||||
useExternalListener
|
useExternalListener,
|
||||||
} from "../src/hooks";
|
} from "../src/hooks";
|
||||||
import { xml } from "../src/tags";
|
import { xml } from "../src/tags";
|
||||||
|
|
||||||
@@ -214,7 +214,7 @@ describe("hooks", () => {
|
|||||||
"hook:mounted1",
|
"hook:mounted1",
|
||||||
"hook:mounted2",
|
"hook:mounted2",
|
||||||
"hook:willunmount2",
|
"hook:willunmount2",
|
||||||
"hook:willunmount1"
|
"hook:willunmount1",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -560,7 +560,7 @@ describe("hooks", () => {
|
|||||||
test("can use onWillStart, onWillUpdateProps", async () => {
|
test("can use onWillStart, onWillUpdateProps", async () => {
|
||||||
const steps: string[] = [];
|
const steps: string[] = [];
|
||||||
async function slow(): Promise<string> {
|
async function slow(): Promise<string> {
|
||||||
return new Promise(resolve => {
|
return new Promise((resolve) => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
resolve("slow");
|
resolve("slow");
|
||||||
}, 0);
|
}, 0);
|
||||||
@@ -571,7 +571,7 @@ describe("hooks", () => {
|
|||||||
steps.push(await slow());
|
steps.push(await slow());
|
||||||
steps.push("onWillStart");
|
steps.push("onWillStart");
|
||||||
});
|
});
|
||||||
onWillUpdateProps(async nextProps => {
|
onWillUpdateProps(async (nextProps) => {
|
||||||
expect(nextProps).toEqual({ value: 2 });
|
expect(nextProps).toEqual({ value: 2 });
|
||||||
steps.push(await slow());
|
steps.push(await slow());
|
||||||
steps.push("onWillUpdateProps");
|
steps.push("onWillUpdateProps");
|
||||||
@@ -581,7 +581,7 @@ describe("hooks", () => {
|
|||||||
onWillStart(() => {
|
onWillStart(() => {
|
||||||
steps.push("on2ndStart");
|
steps.push("on2ndStart");
|
||||||
});
|
});
|
||||||
onWillUpdateProps(nextProps => {
|
onWillUpdateProps((nextProps) => {
|
||||||
expect(nextProps).toEqual({ value: 2 });
|
expect(nextProps).toEqual({ value: 2 });
|
||||||
steps.push("on2ndUpdate");
|
steps.push("on2ndUpdate");
|
||||||
});
|
});
|
||||||
@@ -623,7 +623,7 @@ describe("hooks", () => {
|
|||||||
"onWillStart",
|
"onWillStart",
|
||||||
"on2ndUpdate",
|
"on2ndUpdate",
|
||||||
"slow",
|
"slow",
|
||||||
"onWillUpdateProps"
|
"onWillUpdateProps",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -486,7 +486,7 @@ describe("Portal: Basic use and DOM placement", () => {
|
|||||||
"parent:mounted",
|
"parent:mounted",
|
||||||
"parent:willPatch",
|
"parent:willPatch",
|
||||||
"child:mounted",
|
"child:mounted",
|
||||||
"parent:patched"
|
"parent:patched",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
parent.state.val = 2;
|
parent.state.val = 2;
|
||||||
@@ -499,7 +499,7 @@ describe("Portal: Basic use and DOM placement", () => {
|
|||||||
"parent:willPatch",
|
"parent:willPatch",
|
||||||
"child:willPatch",
|
"child:willPatch",
|
||||||
"child:patched",
|
"child:patched",
|
||||||
"parent:patched"
|
"parent:patched",
|
||||||
]);
|
]);
|
||||||
|
|
||||||
parent.state.hasChild = false;
|
parent.state.hasChild = false;
|
||||||
@@ -515,7 +515,7 @@ describe("Portal: Basic use and DOM placement", () => {
|
|||||||
"parent:patched",
|
"parent:patched",
|
||||||
"parent:willPatch",
|
"parent:willPatch",
|
||||||
"child:willUnmount",
|
"child:willUnmount",
|
||||||
"parent:patched"
|
"parent:patched",
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -741,7 +741,7 @@ describe("Portal: Events handling", () => {
|
|||||||
steps.push(ev.type as string);
|
steps.push(ev.type as string);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const bodyListener = ev => {
|
const bodyListener = (ev) => {
|
||||||
steps.push(`body: ${ev.type}`);
|
steps.push(`body: ${ev.type}`);
|
||||||
};
|
};
|
||||||
document.body.addEventListener("click", bodyListener);
|
document.body.addEventListener("click", bodyListener);
|
||||||
|
|||||||
+44
-44
@@ -195,7 +195,7 @@ describe("t-esc", () => {
|
|||||||
v2: undefined,
|
v2: undefined,
|
||||||
v3: null,
|
v3: null,
|
||||||
v4: 0,
|
v4: 0,
|
||||||
v5: ""
|
v5: "",
|
||||||
};
|
};
|
||||||
expect(renderToString(qweb, "test", vals)).toBe(
|
expect(renderToString(qweb, "test", vals)).toBe(
|
||||||
"<div><p>false</p><p></p><p></p><p>0</p><p></p></div>"
|
"<div><p>false</p><p></p><p></p><p>0</p><p></p></div>"
|
||||||
@@ -486,7 +486,7 @@ describe("t-if", () => {
|
|||||||
cond3: false,
|
cond3: false,
|
||||||
cond4: false,
|
cond4: false,
|
||||||
m: 5,
|
m: 5,
|
||||||
n: 2
|
n: 2,
|
||||||
};
|
};
|
||||||
expect(normalize(renderToString(qweb, "test", context))).toBe("<div>andormgtnlt</div>");
|
expect(normalize(renderToString(qweb, "test", context))).toBe("<div>andormgtnlt</div>");
|
||||||
});
|
});
|
||||||
@@ -625,7 +625,7 @@ describe("attributes", () => {
|
|||||||
test("object", () => {
|
test("object", () => {
|
||||||
qweb.addTemplate("test", `<div t-att="value"/>`);
|
qweb.addTemplate("test", `<div t-att="value"/>`);
|
||||||
const result = renderToString(qweb, "test", {
|
const result = renderToString(qweb, "test", {
|
||||||
value: { a: 1, b: 2, c: 3 }
|
value: { a: 1, b: 2, c: 3 },
|
||||||
});
|
});
|
||||||
expect(result).toBe(`<div a="1" b="2" c="3"></div>`);
|
expect(result).toBe(`<div a="1" b="2" c="3"></div>`);
|
||||||
});
|
});
|
||||||
@@ -684,7 +684,7 @@ describe("attributes", () => {
|
|||||||
const result = renderToString(qweb, "test", {
|
const result = renderToString(qweb, "test", {
|
||||||
value1: 0,
|
value1: 0,
|
||||||
value2: 1,
|
value2: 1,
|
||||||
value3: 2
|
value3: 2,
|
||||||
});
|
});
|
||||||
expect(result).toBe(`<div foo="a 0 is 1 of 2 ]"></div>`);
|
expect(result).toBe(`<div foo="a 0 is 1 of 2 ]"></div>`);
|
||||||
});
|
});
|
||||||
@@ -703,7 +703,7 @@ describe("attributes", () => {
|
|||||||
const result = renderToString(qweb, "test", {
|
const result = renderToString(qweb, "test", {
|
||||||
bar: 0,
|
bar: 0,
|
||||||
baz: 1,
|
baz: 1,
|
||||||
qux: { qux: "<>" }
|
qux: { qux: "<>" },
|
||||||
});
|
});
|
||||||
const expected = '<div foo="<foo" bar="0" baz="<1>" qux="<>"></div>';
|
const expected = '<div foo="<foo" bar="0" baz="<1>" qux="<>"></div>';
|
||||||
expect(result).toBe(expected);
|
expect(result).toBe(expected);
|
||||||
@@ -973,7 +973,7 @@ describe("t-call (template calling", () => {
|
|||||||
`);
|
`);
|
||||||
const root = {
|
const root = {
|
||||||
val: "a",
|
val: "a",
|
||||||
children: [{ val: "b", children: [{ val: "c", children: [{ val: "d" }] }] }]
|
children: [{ val: "b", children: [{ val: "c", children: [{ val: "d" }] }] }],
|
||||||
};
|
};
|
||||||
const expected =
|
const expected =
|
||||||
"<div><div><p>a 2</p><div><p>b 3</p><div><p>c 4</p><div><p>d 5</p></div></div></div></div></div>";
|
"<div><div><p>a 2</p><div><p>b 3</p><div><p>c 4</p><div><p>d 5</p></div></div></div></div></div>";
|
||||||
@@ -1235,7 +1235,7 @@ describe("t-on", () => {
|
|||||||
{
|
{
|
||||||
add() {
|
add() {
|
||||||
a = 3;
|
a = 3;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{ handlers: [] }
|
{ handlers: [] }
|
||||||
);
|
);
|
||||||
@@ -1258,7 +1258,7 @@ describe("t-on", () => {
|
|||||||
},
|
},
|
||||||
handleDblClick() {
|
handleDblClick() {
|
||||||
steps.push("dblclick");
|
steps.push("dblclick");
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{ handlers: [] }
|
{ handlers: [] }
|
||||||
);
|
);
|
||||||
@@ -1278,7 +1278,7 @@ describe("t-on", () => {
|
|||||||
{
|
{
|
||||||
add(n) {
|
add(n) {
|
||||||
a = a + n;
|
a = a + n;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{ handlers: [] }
|
{ handlers: [] }
|
||||||
);
|
);
|
||||||
@@ -1295,7 +1295,7 @@ describe("t-on", () => {
|
|||||||
{
|
{
|
||||||
add({ val }) {
|
add({ val }) {
|
||||||
a = a + val;
|
a = a + val;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{ handlers: [] }
|
{ handlers: [] }
|
||||||
);
|
);
|
||||||
@@ -1312,7 +1312,7 @@ describe("t-on", () => {
|
|||||||
{
|
{
|
||||||
doSomething(arg) {
|
doSomething(arg) {
|
||||||
expect(arg).toEqual({});
|
expect(arg).toEqual({});
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{ handlers: [] }
|
{ handlers: [] }
|
||||||
);
|
);
|
||||||
@@ -1328,7 +1328,7 @@ describe("t-on", () => {
|
|||||||
{
|
{
|
||||||
doSomething(arg) {
|
doSomething(arg) {
|
||||||
expect(arg).toEqual({});
|
expect(arg).toEqual({});
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{ handlers: [] }
|
{ handlers: [] }
|
||||||
);
|
);
|
||||||
@@ -1350,7 +1350,7 @@ describe("t-on", () => {
|
|||||||
{
|
{
|
||||||
activate(action) {
|
activate(action) {
|
||||||
expect(action).toBe("someval");
|
expect(action).toBe("someval");
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
{ handlers: [] }
|
{ handlers: [] }
|
||||||
);
|
);
|
||||||
@@ -1363,7 +1363,7 @@ describe("t-on", () => {
|
|||||||
let owner = {
|
let owner = {
|
||||||
add() {
|
add() {
|
||||||
expect(this).toBe(owner);
|
expect(this).toBe(owner);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
(<HTMLElement>node).click();
|
(<HTMLElement>node).click();
|
||||||
@@ -1373,8 +1373,8 @@ describe("t-on", () => {
|
|||||||
qweb.addTemplate("test", `<button t-on-click="state.counter++">Click</button>`);
|
qweb.addTemplate("test", `<button t-on-click="state.counter++">Click</button>`);
|
||||||
let owner = {
|
let owner = {
|
||||||
state: {
|
state: {
|
||||||
counter: 0
|
counter: 0,
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
expect(owner.state.counter).toBe(0);
|
expect(owner.state.counter).toBe(0);
|
||||||
@@ -1387,10 +1387,10 @@ describe("t-on", () => {
|
|||||||
let owner = {
|
let owner = {
|
||||||
state: {
|
state: {
|
||||||
counter: 0,
|
counter: 0,
|
||||||
incrementCounter: inc => {
|
incrementCounter: (inc) => {
|
||||||
owner.state.counter += inc;
|
owner.state.counter += inc;
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
expect(owner.state.counter).toBe(0);
|
expect(owner.state.counter).toBe(0);
|
||||||
@@ -1402,8 +1402,8 @@ describe("t-on", () => {
|
|||||||
qweb.addTemplate("test", `<button t-on-click="state.flag = !state.flag">Toggle</button>`);
|
qweb.addTemplate("test", `<button t-on-click="state.flag = !state.flag">Toggle</button>`);
|
||||||
let owner = {
|
let owner = {
|
||||||
state: {
|
state: {
|
||||||
flag: true
|
flag: true,
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
expect(owner.state.flag).toBe(true);
|
expect(owner.state.flag).toBe(true);
|
||||||
@@ -1420,8 +1420,8 @@ describe("t-on", () => {
|
|||||||
return n + 1;
|
return n + 1;
|
||||||
},
|
},
|
||||||
state: {
|
state: {
|
||||||
n: 11
|
n: 11,
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
expect(owner.state.n).toBe(11);
|
expect(owner.state.n).toBe(11);
|
||||||
@@ -1437,7 +1437,7 @@ describe("t-on", () => {
|
|||||||
let owner = {
|
let owner = {
|
||||||
update() {
|
update() {
|
||||||
expect(this).toBe(owner);
|
expect(this).toBe(owner);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const node = renderToDOM(qweb, "main", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "main", owner, { handlers: [] });
|
||||||
@@ -1454,7 +1454,7 @@ describe("t-on", () => {
|
|||||||
expect(this).toBe(owner);
|
expect(this).toBe(owner);
|
||||||
expect(val).toBe(444);
|
expect(val).toBe(444);
|
||||||
},
|
},
|
||||||
value: 444
|
value: 444,
|
||||||
};
|
};
|
||||||
|
|
||||||
const node = renderToDOM(qweb, "main", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "main", owner, { handlers: [] });
|
||||||
@@ -1483,7 +1483,7 @@ describe("t-on", () => {
|
|||||||
onClickPreventedAndStopped(e) {
|
onClickPreventedAndStopped(e) {
|
||||||
expect(e.defaultPrevented).toBe(true);
|
expect(e.defaultPrevented).toBe(true);
|
||||||
expect(e.cancelBubble).toBe(true);
|
expect(e.cancelBubble).toBe(true);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
|
|
||||||
@@ -1509,7 +1509,7 @@ describe("t-on", () => {
|
|||||||
},
|
},
|
||||||
onClickSelf(e) {
|
onClickSelf(e) {
|
||||||
steps.push("onClickSelf");
|
steps.push("onClickSelf");
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
|
|
||||||
@@ -1533,10 +1533,10 @@ describe("t-on", () => {
|
|||||||
);
|
);
|
||||||
let steps: boolean[] = [];
|
let steps: boolean[] = [];
|
||||||
let owner = {
|
let owner = {
|
||||||
onClick() {}
|
onClick() {},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
(<HTMLElement>node).addEventListener("click", function(e) {
|
(<HTMLElement>node).addEventListener("click", function (e) {
|
||||||
steps.push(e.defaultPrevented);
|
steps.push(e.defaultPrevented);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -1558,10 +1558,10 @@ describe("t-on", () => {
|
|||||||
);
|
);
|
||||||
let steps: boolean[] = [];
|
let steps: boolean[] = [];
|
||||||
let owner = {
|
let owner = {
|
||||||
onClick() {}
|
onClick() {},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
(<HTMLElement>node).addEventListener("click", function(e) {
|
(<HTMLElement>node).addEventListener("click", function (e) {
|
||||||
steps.push(e.defaultPrevented);
|
steps.push(e.defaultPrevented);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -1589,13 +1589,13 @@ describe("t-on", () => {
|
|||||||
const owner = {
|
const owner = {
|
||||||
projects: [
|
projects: [
|
||||||
{ id: 1, name: "Project 1" },
|
{ id: 1, name: "Project 1" },
|
||||||
{ id: 2, name: "Project 2" }
|
{ id: 2, name: "Project 2" },
|
||||||
],
|
],
|
||||||
|
|
||||||
onEdit(projectId, ev) {
|
onEdit(projectId, ev) {
|
||||||
expect(ev.defaultPrevented).toBe(true);
|
expect(ev.defaultPrevented).toBe(true);
|
||||||
steps.push(projectId);
|
steps.push(projectId);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const node = <HTMLElement>renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = <HTMLElement>renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
@@ -1620,7 +1620,7 @@ describe("t-on", () => {
|
|||||||
);
|
);
|
||||||
const node = renderToDOM(qweb, "test", {}, { handlers: [] });
|
const node = renderToDOM(qweb, "test", {}, { handlers: [] });
|
||||||
|
|
||||||
node.addEventListener("click", e => {
|
node.addEventListener("click", (e) => {
|
||||||
expect(e.defaultPrevented).toBe(true);
|
expect(e.defaultPrevented).toBe(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -1636,7 +1636,7 @@ describe("t-on", () => {
|
|||||||
text: "Click here",
|
text: "Click here",
|
||||||
onClick() {
|
onClick() {
|
||||||
steps.push("onClick");
|
steps.push("onClick");
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const node = <HTMLElement>renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = <HTMLElement>renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
@@ -1655,7 +1655,7 @@ describe("t-on", () => {
|
|||||||
html: "Click <b>here</b>",
|
html: "Click <b>here</b>",
|
||||||
onClick() {
|
onClick() {
|
||||||
steps.push("onClick");
|
steps.push("onClick");
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const node = <HTMLElement>renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = <HTMLElement>renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
@@ -1682,7 +1682,7 @@ describe("t-on", () => {
|
|||||||
},
|
},
|
||||||
doSomething() {
|
doSomething() {
|
||||||
steps.push("normal");
|
steps.push("normal");
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
const node = renderToDOM(qweb, "test", owner, { handlers: [] });
|
||||||
|
|
||||||
@@ -1846,7 +1846,7 @@ describe("t-key", () => {
|
|||||||
);
|
);
|
||||||
expect(
|
expect(
|
||||||
renderToString(qweb, "test", {
|
renderToString(qweb, "test", {
|
||||||
beers: [{ id: 12, name: "Chimay Rouge" }]
|
beers: [{ id: 12, name: "Chimay Rouge" }],
|
||||||
})
|
})
|
||||||
).toMatchSnapshot();
|
).toMatchSnapshot();
|
||||||
});
|
});
|
||||||
@@ -1959,9 +1959,9 @@ describe("properly support svg", () => {
|
|||||||
describe("translation support", () => {
|
describe("translation support", () => {
|
||||||
test("can translate node content", () => {
|
test("can translate node content", () => {
|
||||||
const translations = {
|
const translations = {
|
||||||
word: "mot"
|
word: "mot",
|
||||||
};
|
};
|
||||||
const translateFn = expr => translations[expr] || expr;
|
const translateFn = (expr) => translations[expr] || expr;
|
||||||
const qweb = new QWeb({ translateFn });
|
const qweb = new QWeb({ translateFn });
|
||||||
qweb.addTemplate("test", "<div>word</div>");
|
qweb.addTemplate("test", "<div>word</div>");
|
||||||
expect(renderToString(qweb, "test")).toBe("<div>mot</div>");
|
expect(renderToString(qweb, "test")).toBe("<div>mot</div>");
|
||||||
@@ -1969,9 +1969,9 @@ describe("translation support", () => {
|
|||||||
|
|
||||||
test("does not translate node content if disabled", () => {
|
test("does not translate node content if disabled", () => {
|
||||||
const translations = {
|
const translations = {
|
||||||
word: "mot"
|
word: "mot",
|
||||||
};
|
};
|
||||||
const translateFn = expr => translations[expr] || expr;
|
const translateFn = (expr) => translations[expr] || expr;
|
||||||
const qweb = new QWeb({ translateFn });
|
const qweb = new QWeb({ translateFn });
|
||||||
qweb.addTemplate(
|
qweb.addTemplate(
|
||||||
"test",
|
"test",
|
||||||
@@ -1986,9 +1986,9 @@ describe("translation support", () => {
|
|||||||
|
|
||||||
test("some attributes are translated", () => {
|
test("some attributes are translated", () => {
|
||||||
const translations = {
|
const translations = {
|
||||||
word: "mot"
|
word: "mot",
|
||||||
};
|
};
|
||||||
const translateFn = expr => translations[expr] || expr;
|
const translateFn = (expr) => translations[expr] || expr;
|
||||||
const qweb = new QWeb({ translateFn });
|
const qweb = new QWeb({ translateFn });
|
||||||
qweb.addTemplate(
|
qweb.addTemplate(
|
||||||
"test",
|
"test",
|
||||||
|
|||||||
@@ -6,12 +6,12 @@ describe("tokenizer", () => {
|
|||||||
|
|
||||||
expect(tokenize("{}")).toEqual([
|
expect(tokenize("{}")).toEqual([
|
||||||
{ type: "LEFT_BRACE", value: "{" },
|
{ type: "LEFT_BRACE", value: "{" },
|
||||||
{ type: "RIGHT_BRACE", value: "}" }
|
{ type: "RIGHT_BRACE", value: "}" },
|
||||||
]);
|
]);
|
||||||
expect(tokenize("{ }}")).toEqual([
|
expect(tokenize("{ }}")).toEqual([
|
||||||
{ type: "LEFT_BRACE", value: "{" },
|
{ type: "LEFT_BRACE", value: "{" },
|
||||||
{ type: "RIGHT_BRACE", value: "}" },
|
{ type: "RIGHT_BRACE", value: "}" },
|
||||||
{ type: "RIGHT_BRACE", value: "}" }
|
{ type: "RIGHT_BRACE", value: "}" },
|
||||||
]);
|
]);
|
||||||
expect(tokenize("a")).toEqual([{ type: "SYMBOL", value: "a" }]);
|
expect(tokenize("a")).toEqual([{ type: "SYMBOL", value: "a" }]);
|
||||||
expect(tokenize("true")).toEqual([{ type: "SYMBOL", value: "true" }]);
|
expect(tokenize("true")).toEqual([{ type: "SYMBOL", value: "true" }]);
|
||||||
@@ -25,15 +25,15 @@ describe("tokenizer", () => {
|
|||||||
{ type: "SYMBOL", value: "a" },
|
{ type: "SYMBOL", value: "a" },
|
||||||
{ type: "COLON", value: ":" },
|
{ type: "COLON", value: ":" },
|
||||||
{ type: "VALUE", value: "2" },
|
{ type: "VALUE", value: "2" },
|
||||||
{ type: "RIGHT_BRACE", value: "}" }
|
{ type: "RIGHT_BRACE", value: "}" },
|
||||||
]);
|
]);
|
||||||
expect(tokenize("a,")).toEqual([
|
expect(tokenize("a,")).toEqual([
|
||||||
{ type: "SYMBOL", value: "a" },
|
{ type: "SYMBOL", value: "a" },
|
||||||
{ type: "COMMA", value: "," }
|
{ type: "COMMA", value: "," },
|
||||||
]);
|
]);
|
||||||
expect(tokenize("][")).toEqual([
|
expect(tokenize("][")).toEqual([
|
||||||
{ type: "RIGHT_BRACKET", value: "]" },
|
{ type: "RIGHT_BRACKET", value: "]" },
|
||||||
{ type: "LEFT_BRACKET", value: "[" }
|
{ type: "LEFT_BRACKET", value: "[" },
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -44,23 +44,23 @@ describe("tokenizer", () => {
|
|||||||
{ type: "OPERATOR", value: "<" },
|
{ type: "OPERATOR", value: "<" },
|
||||||
{ type: "OPERATOR", value: ">" },
|
{ type: "OPERATOR", value: ">" },
|
||||||
{ type: "OPERATOR", value: "!==" },
|
{ type: "OPERATOR", value: "!==" },
|
||||||
{ type: "OPERATOR", value: "!=" }
|
{ type: "OPERATOR", value: "!=" },
|
||||||
]);
|
]);
|
||||||
expect(tokenize("typeof a")).toEqual([
|
expect(tokenize("typeof a")).toEqual([
|
||||||
{ type: "OPERATOR", value: "typeof " },
|
{ type: "OPERATOR", value: "typeof " },
|
||||||
{ type: "SYMBOL", value: "a" }
|
{ type: "SYMBOL", value: "a" },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
expect(tokenize("a...1")).toEqual([
|
expect(tokenize("a...1")).toEqual([
|
||||||
{ type: "SYMBOL", value: "a" },
|
{ type: "SYMBOL", value: "a" },
|
||||||
{ type: "OPERATOR", value: "..." },
|
{ type: "OPERATOR", value: "..." },
|
||||||
{ type: "VALUE", value: "1" }
|
{ type: "VALUE", value: "1" },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
expect(tokenize("a in b")).toEqual([
|
expect(tokenize("a in b")).toEqual([
|
||||||
{ type: "SYMBOL", value: "a" },
|
{ type: "SYMBOL", value: "a" },
|
||||||
{ type: "OPERATOR", value: "in " },
|
{ type: "OPERATOR", value: "in " },
|
||||||
{ type: "SYMBOL", value: "b" }
|
{ type: "SYMBOL", value: "b" },
|
||||||
]);
|
]);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -76,7 +76,7 @@ describe("tokenizer", () => {
|
|||||||
expect(tokenize('"hello ged"')).toEqual([{ type: "VALUE", value: '"hello ged"' }]);
|
expect(tokenize('"hello ged"')).toEqual([{ type: "VALUE", value: '"hello ged"' }]);
|
||||||
expect(tokenize('"hello ged"}')).toEqual([
|
expect(tokenize('"hello ged"}')).toEqual([
|
||||||
{ type: "VALUE", value: '"hello ged"' },
|
{ type: "VALUE", value: '"hello ged"' },
|
||||||
{ type: "RIGHT_BRACE", value: "}" }
|
{ type: "RIGHT_BRACE", value: "}" },
|
||||||
]);
|
]);
|
||||||
expect(tokenize('"hello \\"ged\\""')).toEqual([{ type: "VALUE", value: '"hello \\"ged\\""' }]);
|
expect(tokenize('"hello \\"ged\\""')).toEqual([{ type: "VALUE", value: '"hello \\"ged\\""' }]);
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -37,7 +37,7 @@ describe("Link component", () => {
|
|||||||
|
|
||||||
const routes = [
|
const routes = [
|
||||||
{ name: "about", path: "/about" },
|
{ name: "about", path: "/about" },
|
||||||
{ name: "users", path: "/users" }
|
{ name: "users", path: "/users" },
|
||||||
];
|
];
|
||||||
|
|
||||||
router = new TestRouter(env, routes, { mode: "history" });
|
router = new TestRouter(env, routes, { mode: "history" });
|
||||||
@@ -71,7 +71,7 @@ describe("Link component", () => {
|
|||||||
|
|
||||||
const routes = [
|
const routes = [
|
||||||
{ name: "about", path: "/about" },
|
{ name: "about", path: "/about" },
|
||||||
{ name: "users", path: "/users" }
|
{ name: "users", path: "/users" },
|
||||||
];
|
];
|
||||||
|
|
||||||
router = new TestRouter(env, routes, { mode: "history" });
|
router = new TestRouter(env, routes, { mode: "history" });
|
||||||
@@ -81,7 +81,7 @@ describe("Link component", () => {
|
|||||||
|
|
||||||
expect(window.location.pathname).toBe("/users");
|
expect(window.location.pathname).toBe("/users");
|
||||||
var evt = new MouseEvent("click", {
|
var evt = new MouseEvent("click", {
|
||||||
button: 1
|
button: 1,
|
||||||
});
|
});
|
||||||
|
|
||||||
fixture.querySelector("a")!.dispatchEvent(evt);
|
fixture.querySelector("a")!.dispatchEvent(evt);
|
||||||
|
|||||||
@@ -41,7 +41,7 @@ describe("RouteComponent", () => {
|
|||||||
|
|
||||||
const routes = [
|
const routes = [
|
||||||
{ name: "about", path: "/about", component: About },
|
{ name: "about", path: "/about", component: About },
|
||||||
{ name: "users", path: "/users", component: Users }
|
{ name: "users", path: "/users", component: Users },
|
||||||
];
|
];
|
||||||
|
|
||||||
router = new TestRouter(env, routes, { mode: "history" });
|
router = new TestRouter(env, routes, { mode: "history" });
|
||||||
|
|||||||
+10
-10
@@ -21,7 +21,7 @@ describe("router miscellaneous", () => {
|
|||||||
test("validate routes shape", () => {
|
test("validate routes shape", () => {
|
||||||
expect(() => {
|
expect(() => {
|
||||||
router = new TestRouter(env, [
|
router = new TestRouter(env, [
|
||||||
{ name: "someroute", path: "/some/path", redirect: { abc: "hey" } as Destination }
|
{ name: "someroute", path: "/some/path", redirect: { abc: "hey" } as Destination },
|
||||||
]);
|
]);
|
||||||
}).toThrow(`Invalid destination: {"abc":"hey"}`);
|
}).toThrow(`Invalid destination: {"abc":"hey"}`);
|
||||||
});
|
});
|
||||||
@@ -133,7 +133,7 @@ describe("getRouteParams", () => {
|
|||||||
test("match some parameterized routes", () => {
|
test("match some parameterized routes", () => {
|
||||||
router = new TestRouter(env, []);
|
router = new TestRouter(env, []);
|
||||||
expect(router["getRouteParams"]({ path: "/invoices/{{id}}" } as Route, "/invoices/3")).toEqual({
|
expect(router["getRouteParams"]({ path: "/invoices/{{id}}" } as Route, "/invoices/3")).toEqual({
|
||||||
id: "3"
|
id: "3",
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -141,7 +141,7 @@ describe("getRouteParams", () => {
|
|||||||
router = new TestRouter(env, [], { mode: "hash" });
|
router = new TestRouter(env, [], { mode: "hash" });
|
||||||
expect(router["getRouteParams"]({ path: "/invoices/{{id}}" } as Route, "#/invoices/3")).toEqual(
|
expect(router["getRouteParams"]({ path: "/invoices/{{id}}" } as Route, "#/invoices/3")).toEqual(
|
||||||
{
|
{
|
||||||
id: "3"
|
id: "3",
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
@@ -151,7 +151,7 @@ describe("getRouteParams", () => {
|
|||||||
expect(
|
expect(
|
||||||
router["getRouteParams"]({ path: "/invoices/{{id.number}}" } as Route, "/invoices/3")
|
router["getRouteParams"]({ path: "/invoices/{{id.number}}" } as Route, "/invoices/3")
|
||||||
).toEqual({
|
).toEqual({
|
||||||
id: 3
|
id: 3,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -160,7 +160,7 @@ describe("getRouteParams", () => {
|
|||||||
expect(
|
expect(
|
||||||
router["getRouteParams"]({ path: "/invoices/{{id.number}}" } as Route, "#/invoices/3")
|
router["getRouteParams"]({ path: "/invoices/{{id.number}}" } as Route, "#/invoices/3")
|
||||||
).toEqual({
|
).toEqual({
|
||||||
id: 3
|
id: 3,
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@@ -169,7 +169,7 @@ describe("redirect", () => {
|
|||||||
test("can redirect to other route", async () => {
|
test("can redirect to other route", async () => {
|
||||||
router = new TestRouter(env, [
|
router = new TestRouter(env, [
|
||||||
{ name: "routea", path: "/some/path" },
|
{ name: "routea", path: "/some/path" },
|
||||||
{ name: "routeb", path: "/some/other/path", redirect: { to: "routea" } }
|
{ name: "routeb", path: "/some/other/path", redirect: { to: "routea" } },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
await router.start();
|
await router.start();
|
||||||
@@ -182,7 +182,7 @@ describe("redirect", () => {
|
|||||||
test("can redirect to other path", async () => {
|
test("can redirect to other path", async () => {
|
||||||
router = new TestRouter(env, [
|
router = new TestRouter(env, [
|
||||||
{ name: "routea", path: "/some/path" },
|
{ name: "routea", path: "/some/path" },
|
||||||
{ name: "routeb", path: "/some/other/path", redirect: { path: "/some/path" } }
|
{ name: "routeb", path: "/some/other/path", redirect: { path: "/some/path" } },
|
||||||
]);
|
]);
|
||||||
router.navigate = jest.fn(router.navigate);
|
router.navigate = jest.fn(router.navigate);
|
||||||
|
|
||||||
@@ -214,7 +214,7 @@ describe("beforeRouteEnter", () => {
|
|||||||
const guard = jest.fn(() => false);
|
const guard = jest.fn(() => false);
|
||||||
router = new TestRouter(env, [
|
router = new TestRouter(env, [
|
||||||
{ name: "routea", path: "/some/patha" },
|
{ name: "routea", path: "/some/patha" },
|
||||||
{ name: "routeb", path: "/some/pathb", beforeRouteEnter: guard }
|
{ name: "routeb", path: "/some/pathb", beforeRouteEnter: guard },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
await router.start();
|
await router.start();
|
||||||
@@ -235,7 +235,7 @@ describe("beforeRouteEnter", () => {
|
|||||||
router = new TestRouter(env, [
|
router = new TestRouter(env, [
|
||||||
{ name: "routea", path: "/some/patha" },
|
{ name: "routea", path: "/some/patha" },
|
||||||
{ name: "routeb", path: "/some/pathb", beforeRouteEnter: guard },
|
{ name: "routeb", path: "/some/pathb", beforeRouteEnter: guard },
|
||||||
{ name: "routec", path: "/some/pathc" }
|
{ name: "routec", path: "/some/pathc" },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
await router.start();
|
await router.start();
|
||||||
@@ -255,7 +255,7 @@ describe("beforeRouteEnter", () => {
|
|||||||
});
|
});
|
||||||
router = new TestRouter(env, [
|
router = new TestRouter(env, [
|
||||||
{ name: "landing", path: "/", beforeRouteEnter: guard },
|
{ name: "landing", path: "/", beforeRouteEnter: guard },
|
||||||
{ name: "otherroute", path: "/some/other/route" }
|
{ name: "otherroute", path: "/some/other/route" },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
expect(window.location.pathname).toBe("/");
|
expect(window.location.pathname).toBe("/");
|
||||||
|
|||||||
+28
-28
@@ -8,7 +8,7 @@ describe("basic use", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
inc({ state }, delta) {
|
inc({ state }, delta) {
|
||||||
state.n += delta;
|
state.n += delta;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -25,7 +25,7 @@ describe("basic use", () => {
|
|||||||
state.n1 += delta1;
|
state.n1 += delta1;
|
||||||
state.n2 += delta2;
|
state.n2 += delta2;
|
||||||
state.n3 += delta3;
|
state.n3 += delta3;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -47,7 +47,7 @@ describe("basic use", () => {
|
|||||||
},
|
},
|
||||||
inc100({ dispatch }) {
|
inc100({ dispatch }) {
|
||||||
dispatch("inc", 100);
|
dispatch("inc", 100);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -61,7 +61,7 @@ describe("basic use", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
inc({ state }) {
|
inc({ state }) {
|
||||||
return ++state.n;
|
return ++state.n;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -87,7 +87,7 @@ describe("basic use", () => {
|
|||||||
async setTo10({ dispatch }) {
|
async setTo10({ dispatch }) {
|
||||||
await Promise.resolve();
|
await Promise.resolve();
|
||||||
dispatch("setN", 10);
|
dispatch("setN", 10);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -115,7 +115,7 @@ describe("basic use", () => {
|
|||||||
await Promise.resolve();
|
await Promise.resolve();
|
||||||
dispatch("setN", 10);
|
dispatch("setN", 10);
|
||||||
return 5;
|
return 5;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -132,7 +132,7 @@ describe("basic use", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
someaction({ env }) {
|
someaction({ env }) {
|
||||||
expect(env).toBe(someEnv);
|
expect(env).toBe(someEnv);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state: {}, actions, env: someEnv });
|
const store = new Store({ state: {}, actions, env: someEnv });
|
||||||
|
|
||||||
@@ -145,15 +145,15 @@ describe("basic use", () => {
|
|||||||
1: {
|
1: {
|
||||||
id: 1,
|
id: 1,
|
||||||
name: "bertinchamps",
|
name: "bertinchamps",
|
||||||
tasterID: 1
|
tasterID: 1,
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
tasters: {
|
tasters: {
|
||||||
1: {
|
1: {
|
||||||
id: 1,
|
id: 1,
|
||||||
name: "aaron"
|
name: "aaron",
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const getters: { [key: string]: Getter } = {
|
const getters: { [key: string]: Getter } = {
|
||||||
beerTasterName({ state }, beerID) {
|
beerTasterName({ state }, beerID) {
|
||||||
@@ -161,7 +161,7 @@ describe("basic use", () => {
|
|||||||
},
|
},
|
||||||
bestBeerName({ state }) {
|
bestBeerName({ state }) {
|
||||||
return state.beers[1].name;
|
return state.beers[1].name;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions: {}, getters });
|
const store = new Store({ state, actions: {}, getters });
|
||||||
expect(store.getters).toBeDefined();
|
expect(store.getters).toBeDefined();
|
||||||
@@ -176,15 +176,15 @@ describe("basic use", () => {
|
|||||||
1: {
|
1: {
|
||||||
id: 1,
|
id: 1,
|
||||||
name: "bertinchamps",
|
name: "bertinchamps",
|
||||||
tasterID: 1
|
tasterID: 1,
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
tasters: {
|
tasters: {
|
||||||
1: {
|
1: {
|
||||||
id: 1,
|
id: 1,
|
||||||
name: "aaron"
|
name: "aaron",
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const getters = {
|
const getters = {
|
||||||
beerTasterName({ state }, beerID) {
|
beerTasterName({ state }, beerID) {
|
||||||
@@ -192,14 +192,14 @@ describe("basic use", () => {
|
|||||||
},
|
},
|
||||||
bestBeerName({ state }) {
|
bestBeerName({ state }) {
|
||||||
return state.beers[1].name;
|
return state.beers[1].name;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const actions = {
|
const actions = {
|
||||||
action({ getters }) {
|
action({ getters }) {
|
||||||
expect(getters).toBeDefined();
|
expect(getters).toBeDefined();
|
||||||
expect(getters.bestBeerName()).toBe("bertinchamps");
|
expect(getters.bestBeerName()).toBe("bertinchamps");
|
||||||
expect(getters.beerTasterName(1)).toBe("aaron");
|
expect(getters.beerTasterName(1)).toBe("aaron");
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions, getters });
|
const store = new Store({ state, actions, getters });
|
||||||
store.dispatch("action");
|
store.dispatch("action");
|
||||||
@@ -215,7 +215,7 @@ describe("basic use", () => {
|
|||||||
},
|
},
|
||||||
c({}, i) {
|
c({}, i) {
|
||||||
return `c${i}`;
|
return `c${i}`;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ getters, state: {}, actions: {} });
|
const store = new Store({ getters, state: {}, actions: {} });
|
||||||
|
|
||||||
@@ -226,7 +226,7 @@ describe("basic use", () => {
|
|||||||
describe("advanced state properties", () => {
|
describe("advanced state properties", () => {
|
||||||
test("state in the store is reference equal after mutation", async () => {
|
test("state in the store is reference equal after mutation", async () => {
|
||||||
const actions = {
|
const actions = {
|
||||||
donothing() {}
|
donothing() {},
|
||||||
};
|
};
|
||||||
const store = new Store({ state: {}, actions });
|
const store = new Store({ state: {}, actions });
|
||||||
const state = store.state;
|
const state = store.state;
|
||||||
@@ -242,7 +242,7 @@ describe("advanced state properties", () => {
|
|||||||
expect(state.a.length).toBe(3);
|
expect(state.a.length).toBe(3);
|
||||||
const l = state.a.push(53);
|
const l = state.a.push(53);
|
||||||
expect(l).toBe(4);
|
expect(l).toBe(4);
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
store.dispatch("m");
|
store.dispatch("m");
|
||||||
@@ -253,11 +253,11 @@ describe("advanced state properties", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
dosomething({ state }) {
|
dosomething({ state }) {
|
||||||
Object.assign(state.westmalle, { a: 3, b: 4 });
|
Object.assign(state.westmalle, { a: 3, b: 4 });
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({
|
const store = new Store({
|
||||||
state: { westmalle: { a: 1, b: 2 } },
|
state: { westmalle: { a: 1, b: 2 } },
|
||||||
actions
|
actions,
|
||||||
});
|
});
|
||||||
store.dispatch("dosomething");
|
store.dispatch("dosomething");
|
||||||
expect(store.state.westmalle).toEqual({ a: 3, b: 4 });
|
expect(store.state.westmalle).toEqual({ a: 3, b: 4 });
|
||||||
@@ -267,7 +267,7 @@ describe("advanced state properties", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
inc({ state }) {
|
inc({ state }) {
|
||||||
state.counter++;
|
state.counter++;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const state = { counter: 0 };
|
const state = { counter: 0 };
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
@@ -284,7 +284,7 @@ describe("updates triggered by the store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
inc({ state }, delta) {
|
inc({ state }, delta) {
|
||||||
state.n += delta;
|
state.n += delta;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
store.on("update", null, () => updateCounter++);
|
store.on("update", null, () => updateCounter++);
|
||||||
@@ -308,7 +308,7 @@ describe("updates triggered by the store", () => {
|
|||||||
noop2({ state }) {
|
noop2({ state }) {
|
||||||
const val = state.n;
|
const val = state.n;
|
||||||
state.n = val;
|
state.n = val;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
store.on("update", null, () => updateCounter++);
|
store.on("update", null, () => updateCounter++);
|
||||||
|
|||||||
+90
-90
@@ -25,7 +25,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
addTodo({ state }, msg) {
|
addTodo({ state }, msg) {
|
||||||
state.todos.push({ msg, id: nextId++ });
|
state.todos.push({ msg, id: nextId++ });
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -34,7 +34,7 @@ describe("connecting a component to store", () => {
|
|||||||
<div>
|
<div>
|
||||||
<span t-foreach="todos" t-key="todo.id" t-as="todo"><t t-esc="todo.msg"/></span>
|
<span t-foreach="todos" t-key="todo.id" t-as="todo"><t t-esc="todo.msg"/></span>
|
||||||
</div>`;
|
</div>`;
|
||||||
todos = useStore(state => state.todos);
|
todos = useStore((state) => state.todos);
|
||||||
}
|
}
|
||||||
|
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -56,7 +56,7 @@ describe("connecting a component to store", () => {
|
|||||||
},
|
},
|
||||||
setNotNull({ state }) {
|
setNotNull({ state }) {
|
||||||
state.nullValue = "ok";
|
state.nullValue = "ok";
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -70,15 +70,15 @@ describe("connecting a component to store", () => {
|
|||||||
nullValue: string;
|
nullValue: string;
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.isBoolean = useStore(state => state.isBoolean, {
|
this.isBoolean = useStore((state) => state.isBoolean, {
|
||||||
onUpdate: isBoolean => {
|
onUpdate: (isBoolean) => {
|
||||||
this.isBoolean = isBoolean;
|
this.isBoolean = isBoolean;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
this.nullValue = useStore(state => state.nullValue, {
|
this.nullValue = useStore((state) => state.nullValue, {
|
||||||
onUpdate: nullValue => {
|
onUpdate: (nullValue) => {
|
||||||
this.nullValue = nullValue;
|
this.nullValue = nullValue;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -105,15 +105,15 @@ describe("connecting a component to store", () => {
|
|||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<div t-esc="mapAdd"/>`;
|
static template = xml`<div t-esc="mapAdd"/>`;
|
||||||
storeProps = {
|
storeProps = {
|
||||||
array: useStore(state => {
|
array: useStore((state) => {
|
||||||
if (state.useSmallArray) {
|
if (state.useSmallArray) {
|
||||||
return state.smallerArray;
|
return state.smallerArray;
|
||||||
}
|
}
|
||||||
return state.biggerArray;
|
return state.biggerArray;
|
||||||
})
|
}),
|
||||||
};
|
};
|
||||||
get mapAdd() {
|
get mapAdd() {
|
||||||
return this.storeProps.array.map(a => {
|
return this.storeProps.array.map((a) => {
|
||||||
return a + 1;
|
return a + 1;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -133,7 +133,7 @@ describe("connecting a component to store", () => {
|
|||||||
test("throw error if no store is found", async () => {
|
test("throw error if no store is found", async () => {
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<div></div>`;
|
static template = xml`<div></div>`;
|
||||||
todos = useStore(state => state.todos);
|
todos = useStore((state) => state.todos);
|
||||||
}
|
}
|
||||||
|
|
||||||
let error;
|
let error;
|
||||||
@@ -153,7 +153,7 @@ describe("connecting a component to store", () => {
|
|||||||
|
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<div/>`;
|
static template = xml`<div/>`;
|
||||||
storeState = useStore(state => state.a);
|
storeState = useStore((state) => state.a);
|
||||||
}
|
}
|
||||||
|
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -170,7 +170,7 @@ describe("connecting a component to store", () => {
|
|||||||
doSomething({ state }) {
|
doSomething({ state }) {
|
||||||
state.a = 2;
|
state.a = 2;
|
||||||
state.b = 3;
|
state.b = 3;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -180,8 +180,8 @@ describe("connecting a component to store", () => {
|
|||||||
<span t-esc="a.value"/>
|
<span t-esc="a.value"/>
|
||||||
<span t-esc="b.value"/>
|
<span t-esc="b.value"/>
|
||||||
</div>`;
|
</div>`;
|
||||||
a = useStore(state => ({ value: state.a }));
|
a = useStore((state) => ({ value: state.a }));
|
||||||
b = useStore(state => ({ value: state.b }));
|
b = useStore((state) => ({ value: state.b }));
|
||||||
}
|
}
|
||||||
App.prototype.__render = jest.fn(App.prototype.__render);
|
App.prototype.__render = jest.fn(App.prototype.__render);
|
||||||
|
|
||||||
@@ -204,7 +204,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
addTodo({ state }, msg) {
|
addTodo({ state }, msg) {
|
||||||
state.todos.push({ msg, id: nextId++ });
|
state.todos.push({ msg, id: nextId++ });
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -213,7 +213,7 @@ describe("connecting a component to store", () => {
|
|||||||
<div>
|
<div>
|
||||||
<span t-foreach="todos" t-key="todo.id" t-as="todo"><t t-esc="todo.msg"/></span>
|
<span t-foreach="todos" t-key="todo.id" t-as="todo"><t t-esc="todo.msg"/></span>
|
||||||
</div>`;
|
</div>`;
|
||||||
todos = useStore(state => state.todos);
|
todos = useStore((state) => state.todos);
|
||||||
}
|
}
|
||||||
App.prototype.__render = jest.fn(App.prototype.__render);
|
App.prototype.__render = jest.fn(App.prototype.__render);
|
||||||
|
|
||||||
@@ -241,13 +241,13 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
addTodo({ state }, msg) {
|
addTodo({ state }, msg) {
|
||||||
state.todos.push({ msg, id: nextId++ });
|
state.todos.push({ msg, id: nextId++ });
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<div><t t-esc="nbrTodos.value"/></div>`;
|
static template = xml`<div><t t-esc="nbrTodos.value"/></div>`;
|
||||||
nbrTodos = useStore(state => ({ value: state.todos.length }));
|
nbrTodos = useStore((state) => ({ value: state.todos.length }));
|
||||||
}
|
}
|
||||||
|
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -270,12 +270,12 @@ describe("connecting a component to store", () => {
|
|||||||
},
|
},
|
||||||
incrementA({ state }) {
|
incrementA({ state }) {
|
||||||
state.a++;
|
state.a++;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<div><t t-esc="nbrTodos.value"/></div>`;
|
static template = xml`<div><t t-esc="nbrTodos.value"/></div>`;
|
||||||
nbrTodos = useStore(state => ({ value: state.todos.length }), { isEqual: shallowEqual });
|
nbrTodos = useStore((state) => ({ value: state.todos.length }), { isEqual: shallowEqual });
|
||||||
}
|
}
|
||||||
App.prototype.__render = jest.fn(App.prototype.__render);
|
App.prototype.__render = jest.fn(App.prototype.__render);
|
||||||
|
|
||||||
@@ -303,7 +303,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
addTodo({ state }, msg) {
|
addTodo({ state }, msg) {
|
||||||
state.todos.push({ msg, id: nextId++ });
|
state.todos.push({ msg, id: nextId++ });
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
@@ -312,7 +312,7 @@ describe("connecting a component to store", () => {
|
|||||||
<div>
|
<div>
|
||||||
<span t-foreach="todos" t-key="todo.id" t-as="todo"><t t-esc="todo.msg"/></span>
|
<span t-foreach="todos" t-key="todo.id" t-as="todo"><t t-esc="todo.msg"/></span>
|
||||||
</div>`;
|
</div>`;
|
||||||
todos = useStore(state => state.todos, { store });
|
todos = useStore((state) => state.todos, { store });
|
||||||
}
|
}
|
||||||
|
|
||||||
const app = new App();
|
const app = new App();
|
||||||
@@ -331,8 +331,8 @@ describe("connecting a component to store", () => {
|
|||||||
actions: {
|
actions: {
|
||||||
inc({ state }) {
|
inc({ state }) {
|
||||||
state.value++;
|
state.value++;
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
|
|
||||||
@@ -342,7 +342,7 @@ describe("connecting a component to store", () => {
|
|||||||
<button t-on-click="dispatch('inc')">Inc</button>
|
<button t-on-click="dispatch('inc')">Inc</button>
|
||||||
<span><t t-esc="storeState.value"/></span>
|
<span><t t-esc="storeState.value"/></span>
|
||||||
</div>`;
|
</div>`;
|
||||||
storeState = useStore(state => state);
|
storeState = useStore((state) => state);
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
}
|
}
|
||||||
const app = new App();
|
const app = new App();
|
||||||
@@ -360,15 +360,15 @@ describe("connecting a component to store", () => {
|
|||||||
const state = {
|
const state = {
|
||||||
todos: [
|
todos: [
|
||||||
{ id: 1, text: "jupiler" },
|
{ id: 1, text: "jupiler" },
|
||||||
{ id: 2, text: "chimay" }
|
{ id: 2, text: "chimay" },
|
||||||
]
|
],
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions: {} });
|
const store = new Store({ state, actions: {} });
|
||||||
|
|
||||||
class TodoItem extends Component {
|
class TodoItem extends Component {
|
||||||
static template = xml`<span><t t-esc="todo.text"/></span>`;
|
static template = xml`<span><t t-esc="todo.text"/></span>`;
|
||||||
todo = useStore((state, props) => {
|
todo = useStore((state, props) => {
|
||||||
return state.todos.find(t => t.id === props.todoId);
|
return state.todos.find((t) => t.id === props.todoId);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -395,14 +395,14 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
addTodo({ state }, text) {
|
addTodo({ state }, text) {
|
||||||
state.todos.push({ text, id: nextId++ });
|
state.todos.push({ text, id: nextId++ });
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
|
|
||||||
class TodoItem extends Component {
|
class TodoItem extends Component {
|
||||||
static template = xml`<span><t t-esc="todo.text"/></span>`;
|
static template = xml`<span><t t-esc="todo.text"/></span>`;
|
||||||
todo = useStore((state, props) => {
|
todo = useStore((state, props) => {
|
||||||
return state.todos.find(t => t.id === props.id);
|
return state.todos.find((t) => t.id === props.id);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -412,7 +412,7 @@ describe("connecting a component to store", () => {
|
|||||||
<TodoItem t-foreach="todos" t-as="todo" id="todo.id" t-key="todo.id"/>
|
<TodoItem t-foreach="todos" t-as="todo" id="todo.id" t-key="todo.id"/>
|
||||||
</div>`;
|
</div>`;
|
||||||
static components = { TodoItem };
|
static components = { TodoItem };
|
||||||
todos = useStore(state => state.todos);
|
todos = useStore((state) => state.todos);
|
||||||
}
|
}
|
||||||
|
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -431,16 +431,16 @@ describe("connecting a component to store", () => {
|
|||||||
importantID: 1,
|
importantID: 1,
|
||||||
todos: [
|
todos: [
|
||||||
{ id: 1, text: "jupiler" },
|
{ id: 1, text: "jupiler" },
|
||||||
{ id: 2, text: "bertinchamps" }
|
{ id: 2, text: "bertinchamps" },
|
||||||
]
|
],
|
||||||
};
|
};
|
||||||
const getters = {
|
const getters = {
|
||||||
importantTodoText({ state }) {
|
importantTodoText({ state }) {
|
||||||
return state.todos.find(todo => todo.id === state.importantID).text;
|
return state.todos.find((todo) => todo.id === state.importantID).text;
|
||||||
},
|
},
|
||||||
text({ state }, id) {
|
text({ state }, id) {
|
||||||
return state.todos.find(todo => todo.id === id).text;
|
return state.todos.find((todo) => todo.id === id).text;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, getters });
|
const store = new Store({ state, getters });
|
||||||
|
|
||||||
@@ -452,10 +452,10 @@ describe("connecting a component to store", () => {
|
|||||||
</div>`;
|
</div>`;
|
||||||
getters = useGetters();
|
getters = useGetters();
|
||||||
storeProps = useStore((state, props) => {
|
storeProps = useStore((state, props) => {
|
||||||
const todo = state.todos.find(t => t.id === props.id);
|
const todo = state.todos.find((t) => t.id === props.id);
|
||||||
return {
|
return {
|
||||||
activeTodoText: this.getters.text(todo.id),
|
activeTodoText: this.getters.text(todo.id),
|
||||||
importantTodoText: this.getters.importantTodoText()
|
importantTodoText: this.getters.importantTodoText(),
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -468,7 +468,7 @@ describe("connecting a component to store", () => {
|
|||||||
<TodoItem id="todo.id" t-key="todo.id"/>
|
<TodoItem id="todo.id" t-key="todo.id"/>
|
||||||
</t>
|
</t>
|
||||||
</div>`;
|
</div>`;
|
||||||
todos = useStore(state => state.todos);
|
todos = useStore((state) => state.todos);
|
||||||
}
|
}
|
||||||
|
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -513,13 +513,13 @@ describe("connecting a component to store", () => {
|
|||||||
</div>`;
|
</div>`;
|
||||||
|
|
||||||
// we have here a new object
|
// we have here a new object
|
||||||
data = useStore(state => ({ beers: state.beers, otherKey: 1 }));
|
data = useStore((state) => ({ beers: state.beers, otherKey: 1 }));
|
||||||
}
|
}
|
||||||
|
|
||||||
const actions = {
|
const actions = {
|
||||||
addBeer({ state }, name) {
|
addBeer({ state }, name) {
|
||||||
state.beers.push({ name });
|
state.beers.push({ name });
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const state = { beers: [{ name: "jupiler" }] };
|
const state = { beers: [{ name: "jupiler" }] };
|
||||||
@@ -542,9 +542,9 @@ describe("connecting a component to store", () => {
|
|||||||
class Beer extends Component {
|
class Beer extends Component {
|
||||||
static template = xml`<span><t t-esc="beer.name"/></span>`;
|
static template = xml`<span><t t-esc="beer.name"/></span>`;
|
||||||
beer = useStore((state, props) => state.beers[props.id], {
|
beer = useStore((state, props) => state.beers[props.id], {
|
||||||
onUpdate: result => {
|
onUpdate: (result) => {
|
||||||
++counter;
|
++counter;
|
||||||
}
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -558,7 +558,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
renameBeer({ state }, { id, name }) {
|
renameBeer({ state }, { id, name }) {
|
||||||
state.beers[id].name = name;
|
state.beers[id].name = name;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -609,7 +609,7 @@ describe("connecting a component to store", () => {
|
|||||||
data = useStore((state, props) => ({
|
data = useStore((state, props) => ({
|
||||||
selected: state.beers[props.id],
|
selected: state.beers[props.id],
|
||||||
consumed: state.beers[state.consumedID] || null,
|
consumed: state.beers[state.consumedID] || null,
|
||||||
taster: state.taster
|
taster: state.taster,
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -622,14 +622,14 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
consume({ state }, beerId) {
|
consume({ state }, beerId) {
|
||||||
state.consumedID = beerId;
|
state.consumedID = beerId;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const state = {
|
const state = {
|
||||||
beers: {
|
beers: {
|
||||||
1: { name: "jupiler" }
|
1: { name: "jupiler" },
|
||||||
},
|
},
|
||||||
consumedID: null,
|
consumedID: null,
|
||||||
taster: "aaron"
|
taster: "aaron",
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -665,11 +665,11 @@ describe("connecting a component to store", () => {
|
|||||||
<span t-if="info.selected">selected:<t t-esc="info.selected.name"/></span>
|
<span t-if="info.selected">selected:<t t-esc="info.selected.name"/></span>
|
||||||
<span t-if="info.consumed">consumed:<t t-esc="info.consumed.name"/></span>
|
<span t-if="info.consumed">consumed:<t t-esc="info.consumed.name"/></span>
|
||||||
</div>`;
|
</div>`;
|
||||||
info = useStore(function(state, props) {
|
info = useStore(function (state, props) {
|
||||||
return {
|
return {
|
||||||
selected: state.beers[props.id],
|
selected: state.beers[props.id],
|
||||||
consumed: state.beers[state.consumedID] || null,
|
consumed: state.beers[state.consumedID] || null,
|
||||||
taster: state.taster
|
taster: state.taster,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -689,14 +689,14 @@ describe("connecting a component to store", () => {
|
|||||||
},
|
},
|
||||||
renameBeer({ state }, { beerId, name }) {
|
renameBeer({ state }, { beerId, name }) {
|
||||||
state.beers[beerId].name = name;
|
state.beers[beerId].name = name;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const state = {
|
const state = {
|
||||||
beers: {
|
beers: {
|
||||||
1: { name: "jupiler" }
|
1: { name: "jupiler" },
|
||||||
},
|
},
|
||||||
consumedID: null,
|
consumedID: null,
|
||||||
taster: "aaron"
|
taster: "aaron",
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -747,11 +747,11 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
setValue({ state }, val) {
|
setValue({ state }, val) {
|
||||||
state.x.val = val;
|
state.x.val = val;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
static template = xml`<div><t t-esc="x.val"/></div>`;
|
static template = xml`<div><t t-esc="x.val"/></div>`;
|
||||||
x = useStore(state => {
|
x = useStore((state) => {
|
||||||
return Object.assign({}, state.x);
|
return Object.assign({}, state.x);
|
||||||
});
|
});
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
@@ -782,11 +782,11 @@ describe("connecting a component to store", () => {
|
|||||||
static template = xml`<div><Child key="state.current"/></div>`;
|
static template = xml`<div><Child key="state.current"/></div>`;
|
||||||
static components = { Child };
|
static components = { Child };
|
||||||
|
|
||||||
state = useStore(state => {
|
state = useStore((state) => {
|
||||||
steps.push("parent");
|
steps.push("parent");
|
||||||
return {
|
return {
|
||||||
current: state.current,
|
current: state.current,
|
||||||
isvisible: state.isvisible
|
isvisible: state.isvisible,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -795,7 +795,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
setCurrent({ state }, c) {
|
setCurrent({ state }, c) {
|
||||||
state.current = c;
|
state.current = c;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
@@ -831,7 +831,7 @@ describe("connecting a component to store", () => {
|
|||||||
<Child t-if="state.flag" someId="state.someId"/>
|
<Child t-if="state.flag" someId="state.someId"/>
|
||||||
</div>`;
|
</div>`;
|
||||||
static components = { Child };
|
static components = { Child };
|
||||||
state = useStore(s => {
|
state = useStore((s) => {
|
||||||
steps.push("parent");
|
steps.push("parent");
|
||||||
return { flag: s.flag, someId: s.someId };
|
return { flag: s.flag, someId: s.someId };
|
||||||
});
|
});
|
||||||
@@ -846,7 +846,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
setFlagToFalse({ state }) {
|
setFlagToFalse({ state }) {
|
||||||
state.flag = false;
|
state.flag = false;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
@@ -874,15 +874,15 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
editTodo({ state }) {
|
editTodo({ state }) {
|
||||||
state.todos[1].title = "abc";
|
state.todos[1].title = "abc";
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const todos = { 1: { id: 1, title: "kikoou" } };
|
const todos = { 1: { id: 1, title: "kikoou" } };
|
||||||
const state = {
|
const state = {
|
||||||
todos
|
todos,
|
||||||
};
|
};
|
||||||
const store = new Store({
|
const store = new Store({
|
||||||
state,
|
state,
|
||||||
actions
|
actions,
|
||||||
});
|
});
|
||||||
|
|
||||||
class TodoItem extends Component<{}, EnvWithStore> {
|
class TodoItem extends Component<{}, EnvWithStore> {
|
||||||
@@ -894,7 +894,7 @@ describe("connecting a component to store", () => {
|
|||||||
state = useStore((state, props) => {
|
state = useStore((state, props) => {
|
||||||
steps.push("item:usestore");
|
steps.push("item:usestore");
|
||||||
return {
|
return {
|
||||||
todo: state.todos[props.id]
|
todo: state.todos[props.id],
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -914,7 +914,7 @@ describe("connecting a component to store", () => {
|
|||||||
</t>
|
</t>
|
||||||
</div>`;
|
</div>`;
|
||||||
static components = { TodoItem };
|
static components = { TodoItem };
|
||||||
state = useStore(state => {
|
state = useStore((state) => {
|
||||||
steps.push("app:usestore");
|
steps.push("app:usestore");
|
||||||
return { todos: state.todos };
|
return { todos: state.todos };
|
||||||
});
|
});
|
||||||
@@ -947,15 +947,15 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
removeTodo({ state }) {
|
removeTodo({ state }) {
|
||||||
delete state.todos[1];
|
delete state.todos[1];
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const todos = { 1: { id: 1, title: "kikoou" } };
|
const todos = { 1: { id: 1, title: "kikoou" } };
|
||||||
const state = {
|
const state = {
|
||||||
todos
|
todos,
|
||||||
};
|
};
|
||||||
const store = new Store({
|
const store = new Store({
|
||||||
state,
|
state,
|
||||||
actions
|
actions,
|
||||||
});
|
});
|
||||||
|
|
||||||
class TodoItem extends Component<{}, EnvWithStore> {
|
class TodoItem extends Component<{}, EnvWithStore> {
|
||||||
@@ -967,7 +967,7 @@ describe("connecting a component to store", () => {
|
|||||||
state = useStore((state, props) => {
|
state = useStore((state, props) => {
|
||||||
steps.push("item:usestore");
|
steps.push("item:usestore");
|
||||||
return {
|
return {
|
||||||
todo: state.todos[props.id]
|
todo: state.todos[props.id],
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -988,7 +988,7 @@ describe("connecting a component to store", () => {
|
|||||||
</t>
|
</t>
|
||||||
</div>`;
|
</div>`;
|
||||||
static components = { TodoItem };
|
static components = { TodoItem };
|
||||||
state = useStore(state => {
|
state = useStore((state) => {
|
||||||
steps.push("app:usestore");
|
steps.push("app:usestore");
|
||||||
return { todos: state.todos };
|
return { todos: state.todos };
|
||||||
});
|
});
|
||||||
@@ -1016,7 +1016,7 @@ describe("connecting a component to store", () => {
|
|||||||
"item:usestore",
|
"item:usestore",
|
||||||
"item:render",
|
"item:render",
|
||||||
"app:usestore",
|
"app:usestore",
|
||||||
"app:render"
|
"app:render",
|
||||||
]);
|
]);
|
||||||
expect(fixture.innerHTML).toBe('<div class="todoapp"></div>');
|
expect(fixture.innerHTML).toBe('<div class="todoapp"></div>');
|
||||||
});
|
});
|
||||||
@@ -1026,7 +1026,7 @@ describe("connecting a component to store", () => {
|
|||||||
|
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<div><t t-esc="store.msg"/></div>`;
|
static template = xml`<div><t t-esc="store.msg"/></div>`;
|
||||||
store = useStore(s => ({ msg: s.msg }));
|
store = useStore((s) => ({ msg: s.msg }));
|
||||||
|
|
||||||
willPatch() {
|
willPatch() {
|
||||||
steps.push("willpatch");
|
steps.push("willpatch");
|
||||||
@@ -1040,7 +1040,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
setMsg({ state }, c) {
|
setMsg({ state }, c) {
|
||||||
state.msg = c;
|
state.msg = c;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
@@ -1061,7 +1061,7 @@ describe("connecting a component to store", () => {
|
|||||||
|
|
||||||
class Child extends Component {
|
class Child extends Component {
|
||||||
static template = xml`<div><t t-esc="store.val"/></div>`;
|
static template = xml`<div><t t-esc="store.val"/></div>`;
|
||||||
store = useStore(s => s);
|
store = useStore((s) => s);
|
||||||
}
|
}
|
||||||
|
|
||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
@@ -1099,7 +1099,7 @@ describe("connecting a component to store", () => {
|
|||||||
|
|
||||||
class Child extends Component {
|
class Child extends Component {
|
||||||
static template = xml`<div><t t-esc="store.val"/></div>`;
|
static template = xml`<div><t t-esc="store.val"/></div>`;
|
||||||
store = useStore(s => {
|
store = useStore((s) => {
|
||||||
steps.push("child selector");
|
steps.push("child selector");
|
||||||
return s;
|
return s;
|
||||||
});
|
});
|
||||||
@@ -1107,7 +1107,7 @@ describe("connecting a component to store", () => {
|
|||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
static template = xml`<div><Child t-if="store.child" /></div>`;
|
static template = xml`<div><Child t-if="store.child" /></div>`;
|
||||||
static components = { Child };
|
static components = { Child };
|
||||||
store = useStore(s => {
|
store = useStore((s) => {
|
||||||
steps.push("parent selector");
|
steps.push("parent selector");
|
||||||
return s;
|
return s;
|
||||||
});
|
});
|
||||||
@@ -1118,7 +1118,7 @@ describe("connecting a component to store", () => {
|
|||||||
const actions = {
|
const actions = {
|
||||||
toggleChild({ state }) {
|
toggleChild({ state }) {
|
||||||
state.child = !state.child;
|
state.child = !state.child;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
(<any>env).store = store;
|
(<any>env).store = store;
|
||||||
@@ -1137,18 +1137,18 @@ describe("connecting a component to store", () => {
|
|||||||
test("dispatch an action", async () => {
|
test("dispatch an action", async () => {
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
static template = xml`<div><t t-esc="store.counter"/></div>`;
|
static template = xml`<div><t t-esc="store.counter"/></div>`;
|
||||||
store = useStore(state => state);
|
store = useStore((state) => state);
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
}
|
}
|
||||||
|
|
||||||
const state = {
|
const state = {
|
||||||
counter: 0
|
counter: 0,
|
||||||
};
|
};
|
||||||
|
|
||||||
const actions = {
|
const actions = {
|
||||||
inc({ state }) {
|
inc({ state }) {
|
||||||
return ++state.counter;
|
return ++state.counter;
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
const store = new Store({ state, actions });
|
const store = new Store({ state, actions });
|
||||||
@@ -1185,21 +1185,21 @@ describe("various scenarios", () => {
|
|||||||
await Promise.resolve();
|
await Promise.resolve();
|
||||||
delete state.attachments[100];
|
delete state.attachments[100];
|
||||||
state.messages[10].attachmentIds = [];
|
state.messages[10].attachmentIds = [];
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const state = {
|
const state = {
|
||||||
attachments: {
|
attachments: {
|
||||||
100: {
|
100: {
|
||||||
id: 100,
|
id: 100,
|
||||||
name: "text.txt"
|
name: "text.txt",
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
messages: {
|
messages: {
|
||||||
10: {
|
10: {
|
||||||
attachmentIds: [100],
|
attachmentIds: [100],
|
||||||
id: 10
|
id: 10,
|
||||||
}
|
},
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
const store = new Store({ actions, state });
|
const store = new Store({ actions, state });
|
||||||
|
|
||||||
@@ -1220,7 +1220,7 @@ describe("various scenarios", () => {
|
|||||||
<Attachment t-foreach="store.attachmentIds" t-key="attachmentId" t-as="attachmentId" id="attachmentId"/>
|
<Attachment t-foreach="store.attachmentIds" t-key="attachmentId" t-as="attachmentId" id="attachmentId"/>
|
||||||
</div>`;
|
</div>`;
|
||||||
|
|
||||||
store = useStore(state => ({ attachmentIds: state.messages[10].attachmentIds }));
|
store = useStore((state) => ({ attachmentIds: state.messages[10].attachmentIds }));
|
||||||
static components = { Attachment };
|
static components = { Attachment };
|
||||||
state = { isAttachmentDeleted: false };
|
state = { isAttachmentDeleted: false };
|
||||||
dispatch = useDispatch();
|
dispatch = useDispatch();
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ debugOwl(owl, {});
|
|||||||
test("can log full lifecycle", async () => {
|
test("can log full lifecycle", async () => {
|
||||||
const steps: string[] = [];
|
const steps: string[] = [];
|
||||||
const log = console.log;
|
const log = console.log;
|
||||||
console.log = arg => steps.push(arg);
|
console.log = (arg) => steps.push(arg);
|
||||||
|
|
||||||
class Child extends Component {
|
class Child extends Component {
|
||||||
static template = xml`<div>child</div>`;
|
static template = xml`<div>child</div>`;
|
||||||
@@ -51,7 +51,7 @@ test("can log full lifecycle", async () => {
|
|||||||
"[OWL_DEBUG] Child<id=2> rendering template",
|
"[OWL_DEBUG] Child<id=2> rendering template",
|
||||||
"[OWL_DEBUG] Parent<id=1> willPatch",
|
"[OWL_DEBUG] Parent<id=1> willPatch",
|
||||||
"[OWL_DEBUG] Child<id=2> mounted",
|
"[OWL_DEBUG] Child<id=2> mounted",
|
||||||
"[OWL_DEBUG] Parent<id=1> patched"
|
"[OWL_DEBUG] Parent<id=1> patched",
|
||||||
]);
|
]);
|
||||||
console.log = log;
|
console.log = log;
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -19,7 +19,7 @@ debugOwl(owl, { logScheduler: true });
|
|||||||
test("can log scheduler start and stop", async () => {
|
test("can log scheduler start and stop", async () => {
|
||||||
const steps: string[] = [];
|
const steps: string[] = [];
|
||||||
const log = console.log;
|
const log = console.log;
|
||||||
console.log = arg => steps.push(arg);
|
console.log = (arg) => steps.push(arg);
|
||||||
|
|
||||||
class Child extends Component {
|
class Child extends Component {
|
||||||
static template = xml`<div>child</div>`;
|
static template = xml`<div>child</div>`;
|
||||||
@@ -44,7 +44,7 @@ test("can log scheduler start and stop", async () => {
|
|||||||
"[OWL_DEBUG] Child<id=2> rendering template",
|
"[OWL_DEBUG] Child<id=2> rendering template",
|
||||||
"[OWL_DEBUG] Child<id=2> mounted",
|
"[OWL_DEBUG] Child<id=2> mounted",
|
||||||
"[OWL_DEBUG] Parent<id=1> mounted",
|
"[OWL_DEBUG] Parent<id=1> mounted",
|
||||||
"[OWL_DEBUG] scheduler: stop running tasks queue"
|
"[OWL_DEBUG] scheduler: stop running tasks queue",
|
||||||
]);
|
]);
|
||||||
console.log = log;
|
console.log = log;
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -19,7 +19,7 @@ debugOwl(owl, { logScheduler: true });
|
|||||||
test("log a specific message for render method calls if component is not mounted", async () => {
|
test("log a specific message for render method calls if component is not mounted", async () => {
|
||||||
const steps: string[] = [];
|
const steps: string[] = [];
|
||||||
const log = console.log;
|
const log = console.log;
|
||||||
console.log = arg => steps.push(arg);
|
console.log = (arg) => steps.push(arg);
|
||||||
|
|
||||||
class Parent extends Component {
|
class Parent extends Component {
|
||||||
static template = xml`<div><t t-esc="state.value"/></div>`;
|
static template = xml`<div><t t-esc="state.value"/></div>`;
|
||||||
@@ -40,7 +40,7 @@ test("log a specific message for render method calls if component is not mounted
|
|||||||
"[OWL_DEBUG] Parent<id=1> mounted",
|
"[OWL_DEBUG] Parent<id=1> mounted",
|
||||||
"[OWL_DEBUG] scheduler: stop running tasks queue",
|
"[OWL_DEBUG] scheduler: stop running tasks queue",
|
||||||
"[OWL_DEBUG] Parent<id=1> willUnmount",
|
"[OWL_DEBUG] Parent<id=1> willUnmount",
|
||||||
"[OWL_DEBUG] Parent<id=1> render (warning: component is not mounted, this render has no effect)"
|
"[OWL_DEBUG] Parent<id=1> render (warning: component is not mounted, this render has no effect)",
|
||||||
]);
|
]);
|
||||||
console.log = log;
|
console.log = log;
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -19,7 +19,7 @@ debugOwl(owl, { logScheduler: true });
|
|||||||
test("log a sub component with non stringifiable props", async () => {
|
test("log a sub component with non stringifiable props", async () => {
|
||||||
const steps: string[] = [];
|
const steps: string[] = [];
|
||||||
const log = console.log;
|
const log = console.log;
|
||||||
console.log = arg => steps.push(arg);
|
console.log = (arg) => steps.push(arg);
|
||||||
|
|
||||||
class Child extends Component {
|
class Child extends Component {
|
||||||
static template = xml`<span><t t-esc="props.obj.val"/></span>`;
|
static template = xml`<span><t t-esc="props.obj.val"/></span>`;
|
||||||
@@ -51,7 +51,7 @@ test("log a sub component with non stringifiable props", async () => {
|
|||||||
"[OWL_DEBUG] Parent<id=1> mounted",
|
"[OWL_DEBUG] Parent<id=1> mounted",
|
||||||
"[OWL_DEBUG] scheduler: stop running tasks queue",
|
"[OWL_DEBUG] scheduler: stop running tasks queue",
|
||||||
"[OWL_DEBUG] Parent<id=1> willUnmount",
|
"[OWL_DEBUG] Parent<id=1> willUnmount",
|
||||||
"[OWL_DEBUG] Child<id=2> willUnmount"
|
"[OWL_DEBUG] Child<id=2> willUnmount",
|
||||||
]);
|
]);
|
||||||
console.log = log;
|
console.log = log;
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -60,14 +60,14 @@ function getFiles(path: string[] = []): FileData[] {
|
|||||||
if (path.length === 0) {
|
if (path.length === 0) {
|
||||||
const baseFiles: FileData[] = [
|
const baseFiles: FileData[] = [
|
||||||
{ name: "README.md", path: [], links: [], sections: [], fullName: "README.md" },
|
{ name: "README.md", path: [], links: [], sections: [], fullName: "README.md" },
|
||||||
{ name: "roadmap.md", path: [], links: [], sections: [], fullName: "roadmap.md" }
|
{ name: "roadmap.md", path: [], links: [], sections: [], fullName: "roadmap.md" },
|
||||||
];
|
];
|
||||||
const rest = getFiles(["doc"]);
|
const rest = getFiles(["doc"]);
|
||||||
const result = baseFiles.concat(rest);
|
const result = baseFiles.concat(rest);
|
||||||
result.forEach(addMardownData);
|
result.forEach(addMardownData);
|
||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
const files = fs.readdirSync(path.join("/"), { withFileTypes: true }).map(f => {
|
const files = fs.readdirSync(path.join("/"), { withFileTypes: true }).map((f) => {
|
||||||
if (f.isDirectory()) {
|
if (f.isDirectory()) {
|
||||||
return getFiles(path.concat(f.name));
|
return getFiles(path.concat(f.name));
|
||||||
}
|
}
|
||||||
@@ -78,8 +78,8 @@ function getFiles(path: string[] = []): FileData[] {
|
|||||||
path,
|
path,
|
||||||
links: [],
|
links: [],
|
||||||
sections: [],
|
sections: [],
|
||||||
fullName
|
fullName,
|
||||||
}
|
},
|
||||||
];
|
];
|
||||||
});
|
});
|
||||||
return Array.prototype.concat(...files);
|
return Array.prototype.concat(...files);
|
||||||
@@ -127,7 +127,7 @@ export function isLinkValid(link: MarkDownLink, current: FileData, files: FileDa
|
|||||||
}
|
}
|
||||||
|
|
||||||
// Step 4: check if there is a matching file
|
// Step 4: check if there is a matching file
|
||||||
let target: FileData | undefined = files.find(f => f.fullName === linkFullName);
|
let target: FileData | undefined = files.find((f) => f.fullName === linkFullName);
|
||||||
if (!target) {
|
if (!target) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
@@ -135,7 +135,7 @@ export function isLinkValid(link: MarkDownLink, current: FileData, files: FileDa
|
|||||||
// Step 5: if necessary, check if there is a corresponding link inside the target
|
// Step 5: if necessary, check if there is a corresponding link inside the target
|
||||||
// link name
|
// link name
|
||||||
if (hash) {
|
if (hash) {
|
||||||
if (!target.sections.find(s => s.slug === hash)) {
|
if (!target.sections.find((s) => s.slug === hash)) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -153,7 +153,7 @@ function slugify(str) {
|
|||||||
.toLowerCase()
|
.toLowerCase()
|
||||||
.replace(/\//g, "") // remove /
|
.replace(/\//g, "") // remove /
|
||||||
.replace(/\s+/g, "-") // Replace spaces with -
|
.replace(/\s+/g, "-") // Replace spaces with -
|
||||||
.replace(p, c => b.charAt(a.indexOf(c))) // Replace special characters
|
.replace(p, (c) => b.charAt(a.indexOf(c))) // Replace special characters
|
||||||
.replace(/&/g, "-and-") // Replace & with ‘and’
|
.replace(/&/g, "-and-") // Replace & with ‘and’
|
||||||
.replace(/[^\w\-]+/g, "") // Remove all non-word characters
|
.replace(/[^\w\-]+/g, "") // Remove all non-word characters
|
||||||
.replace(/\-\-+/g, "-") // Replace multiple - with single -
|
.replace(/\-\-+/g, "-") // Replace multiple - with single -
|
||||||
|
|||||||
+192
-192
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user