diff --git a/src/common/types.ts b/src/common/types.ts
index 0a900bdb8..2df9ab1f9 100644
--- a/src/common/types.ts
+++ b/src/common/types.ts
@@ -1,4 +1,4 @@
 export type customDirectives = Record<
   string,
-  (node: Element, value: string, modifier?: string) => void
+  (node: Element, value: string, modifier: string[]) => void
 >;
diff --git a/src/compiler/parser.ts b/src/compiler/parser.ts
index dc5c3ee79..5dbf0078f 100644
--- a/src/compiler/parser.ts
+++ b/src/compiler/parser.ts
@@ -299,10 +299,10 @@ function parseTCustom(node: Element, ctx: ParsingContext): AST | null {
         throw new OwlError(`Custom directive "${directiveName}" is not defined`);
       }
       const value = node.getAttribute(attr)!;
-      const modifier = attr.split(".").length > 1 ? attr.split(".")[1] : undefined;
+      const modifiers = attr.split(".").slice(1);
       node.removeAttribute(attr);
       try {
-        customDirective(node, value, modifier);
+        customDirective(node, value, modifiers);
       } catch (error) {
         throw new OwlError(
           `Custom directive "${directiveName}" throw the following error: ${error}`
diff --git a/tests/compiler/__snapshots__/t_custom.test.ts.snap b/tests/compiler/__snapshots__/t_custom.test.ts.snap
index 4d16e4768..d5769badd 100644
--- a/tests/compiler/__snapshots__/t_custom.test.ts.snap
+++ b/tests/compiler/__snapshots__/t_custom.test.ts.snap
@@ -14,7 +14,7 @@ exports[`t-custom can use t-custom directive on a node 1`] = `
 }"
 `;
 
-exports[`t-custom can use t-custom directive with modifier on a node 1`] = `
+exports[`t-custom can use t-custom directive with modifiers on a node 1`] = `
 "function anonymous(app, bdom, helpers
 ) {
   let { text, createBlock, list, multi, html, toggler, comment } = bdom;
diff --git a/tests/compiler/t_custom.test.ts b/tests/compiler/t_custom.test.ts
index abfb745f7..8a00e71b5 100644
--- a/tests/compiler/t_custom.test.ts
+++ b/tests/compiler/t_custom.test.ts
@@ -31,25 +31,27 @@ describe("t-custom", () => {
     expect(steps).toEqual(["clicked"]);
   });
 
-  test("can use t-custom directive with modifier on a node", async () => {
+  test("can use t-custom directive with modifiers on a node", async () => {
     const steps: string[] = [];
     class SomeComponent extends Component {
-      static template = xml`<div t-custom-plop.mouse="click" class="my-div"/>`;
+      static template = xml`<div t-custom-plop.mouse.stop="click" class="my-div"/>`;
       click() {
         steps.push("clicked");
       }
     }
     const app = new App(SomeComponent, {
       customDirectives: {
-        plop: (node, value, modifier) => {
+        plop: (node, value, modifiers) => {
           node.setAttribute("t-on-click", value);
-          steps.push(modifier || "");
+          for (let mod of modifiers) {
+            steps.push(mod);
+          }
         },
       },
     });
     await app.mount(fixture);
     expect(fixture.innerHTML).toBe(`<div class="my-div"></div>`);
     fixture.querySelector("div")!.click();
-    expect(steps).toEqual(["mouse", "clicked"]);
+    expect(steps).toEqual(["mouse", "stop", "clicked"]);
   });
 });