[FIX] parser: make t-on stricter

Before this commit, the `t-on` directive assumed that the next character
would be a -, and ignored it, so if someone would write `t-onclick` by
mistake, Owl would then add an event handler on the `lick` event,
instead of `click`.

With this commit, we improve the parser to make it stricter and fail if
there is no dash.

closes #1441
This commit is contained in:
Géry Debongnie
2023-05-24 15:55:43 +02:00
committed by Bruno Boi
parent 78d6ff735e
commit fbf4c4add2
2 changed files with 28 additions and 4 deletions
+4 -4
View File
@@ -336,10 +336,10 @@ function parseDOMNode(node: Element, ctx: ParsingContext): AST | null {
for (let attr of nodeAttrsNames) {
const value = node.getAttribute(attr)!;
if (attr.startsWith("t-on")) {
if (attr === "t-on") {
throw new OwlError("Missing event name with t-on directive");
}
if (attr === "t-on" || attr === "t-on-") {
throw new OwlError("Missing event name with t-on directive");
}
if (attr.startsWith("t-on-")) {
on = on || {};
on[attr.slice(5)] = value;
} else if (attr.startsWith("t-model")) {
+24
View File
@@ -1147,6 +1147,24 @@ describe("qweb parser", () => {
});
});
test("t-onclick without dash", async () => {
expect(() => parse(`<button t-onclick="add">Click</button>`)).toThrowError(
"Unknown QWeb directive: 't-onclick'"
);
});
test("t-on without event", async () => {
expect(() => parse(`<button t-on="add">Click</button>`)).toThrowError(
"Missing event name with t-on directive"
);
});
test("t-on- without event", async () => {
expect(() => parse(`<button t-on-="add">Click</button>`)).toThrowError(
"Missing event name with t-on directive"
);
});
// ---------------------------------------------------------------------------
// t-model
// ---------------------------------------------------------------------------
@@ -1275,6 +1293,12 @@ describe("qweb parser", () => {
});
});
test("component with event handler", async () => {
expect(() => parse(`<MyComponent t-onclick="someMethod"/>`)).toThrowError(
"unsupported directive on Component: t-onclick"
);
});
test("component with t-ref", async () => {
expect(() => parse(`<MyComponent t-ref="something"/>`)).toThrow(
"t-ref is no longer supported on components. Consider exposing only the public part of the component's API through a callback prop."