@eventra_dev/eventra-cli 0.0.5 → 0.0.6

package/.github/workflows/release.yml

@@ -33,6 +33,9 @@ jobs:
       - name: Build CLI
         run: pnpm build
 
+      - name: Run tests
+        run: pnpm test
+
       - name: Publish to npm
         run: npm publish --access public
         env:

package/README.md

@@ -7,6 +7,8 @@
 [![npm version](https://img.shields.io/npm/v/@eventra_dev/eventra-cli.svg)](https://www.npmjs.com/package/@eventra_dev/eventra-cli)
 [![npm downloads](https://img.shields.io/npm/dm/@eventra_dev/eventra-cli.svg)](https://www.npmjs.com/package/@eventra_dev/eventra-cli)
 [![TypeScript](https://img.shields.io/badge/typescript-ready-blue.svg)](https://www.typescriptlang.org/)
+[![Tests](https://github.com/and-1991/eventra-cli/actions/workflows/release.yml/badge.svg)]()
+[![License](https://img.shields.io/npm/l/@eventra_dev/eventra-cli)]()
 
 Eventra CLI automatically discovers feature usage events in your codebase and syncs them with Eventra.
 

package/dist/commands/init.js

@@ -29,7 +29,9 @@ async function init() {
         wrappers: [],
         functionWrappers: [],
         sync: {
-            include: ["**/*.{ts,tsx,js,jsx}"],
+            include: [
+                "**/*.{ts,tsx,js,jsx,vue,svelte,astro}"
+            ],
             exclude: [
                 "node_modules",
                 "dist",

package/dist/commands/sync.js

@@ -28,6 +28,11 @@ async function sync() {
     const files = await (0, fast_glob_1.default)(config.sync.include, {
         ignore: config.sync.exclude
     });
+    const functionWrappers = (config.functionWrappers ?? []).map((w) => ({
+        ...w,
+        path: w.path ?? "0"
+    }));
+    const componentWrappers = config.wrappers ?? [];
     for (const file of files) {
         const parser = (0, router_1.detectParser)(file);
         let content = await promises_1.default.readFile(file, "utf-8");
@@ -37,10 +42,13 @@ async function sync() {
             content = (0, svelte_1.parseSvelte)(content);
         if (parser === "astro")
             content = (0, astro_1.parseAstro)(content);
-        const source = project.createSourceFile(file, content, { overwrite: true });
+        const virtualFile = parser === "ts"
+            ? file
+            : file + ".tsx";
+        const source = project.createSourceFile(virtualFile, content, { overwrite: true });
         (0, track_1.scanTrack)(source).forEach((e) => events.add(e));
-        (0, function_wrappers_1.scanFunctionWrappers)(source, config.functionWrappers ?? []).forEach((e) => events.add(e));
-        (0, component_wrappers_1.scanComponentWrappers)(source, config.wrappers ?? []).forEach((e) => events.add(e));
+        (0, function_wrappers_1.scanFunctionWrappers)(source, functionWrappers).forEach((e) => events.add(e));
+        (0, component_wrappers_1.scanComponentWrappers)(source, componentWrappers).forEach((e) => events.add(e));
     }
     const list = [...events].sort();
     config.events = list;

package/dist/utils/config.js

@@ -18,7 +18,7 @@ function normalizeConfig(config) {
         functionWrappers: config.functionWrappers ?? [],
         sync: config.sync ?? {
             include: [
-                "**/*.{ts,tsx,js,jsx}"
+                "**/*.{ts,tsx,js,jsx,vue,svelte,astro}"
             ],
             exclude: [
                 "node_modules",

package/dist/utils/extract.js

@@ -7,23 +7,38 @@ function extractEvent(call, path) {
     let node = call.getArguments()[Number(parts[0])];
     if (!node)
         return null;
+    node = unwrap(node);
     for (let i = 1; i < parts.length; i++) {
-        if (ts_morph_1.Node.isObjectLiteralExpression(node)) {
-            const obj = node;
-            const prop = obj.getProperty(parts[i]);
-            if (!prop)
-                return null;
-            if (ts_morph_1.Node.isPropertyAssignment(prop)) {
-                const initializer = prop.getInitializer();
-                if (!initializer)
-                    return null;
-                node = initializer;
-            }
+        if (!ts_morph_1.Node.isObjectLiteralExpression(node)) {
+            return null;
         }
+        const obj = node;
+        const prop = obj.getProperty(parts[i]);
+        if (!prop)
+            return null;
+        if (!ts_morph_1.Node.isPropertyAssignment(prop)) {
+            return null;
+        }
+        const initializer = prop.getInitializer();
+        if (!initializer)
+            return null;
+        node = unwrap(initializer);
     }
-    if (node &&
-        ts_morph_1.Node.isStringLiteral(node)) {
+    if (ts_morph_1.Node.isStringLiteral(node)) {
         return node.getLiteralText();
     }
+    if (node.getKind() ===
+        ts_morph_1.SyntaxKind.NoSubstitutionTemplateLiteral) {
+        return node
+            .getText()
+            .replace(/`/g, "");
+    }
     return null;
 }
+function unwrap(node) {
+    let current = node;
+    while (ts_morph_1.Node.isParenthesizedExpression(current)) {
+        current = current.getExpression();
+    }
+    return current;
+}

package/dist/utils/parsers/vue.js

@@ -4,7 +4,15 @@ exports.parseVue = parseVue;
 function parseVue(content) {
     const template = content.match(/<template[\s\S]*?>([\s\S]*?)<\/template>/);
     const script = content.match(/<script[\s\S]*?>([\s\S]*?)<\/script>/);
-    return ((template?.[1] ?? "") +
-        "\n" +
-        (script?.[1] ?? ""));
+    return `
+${script?.[1] ?? ""}
+
+function __vue_template__() {
+  return (
+    <>
+      ${template?.[1] ?? ""}
+    </>
+  );
+}
+`;
 }

package/dist/utils/scanners/component-wrappers.js

@@ -32,13 +32,11 @@ function scanComponentWrappers(source, wrappers) {
                 const init = attrNode.getInitializer();
                 if (!init)
                     continue;
-                // event="signup"
                 if (init.getKind() ===
                     ts_morph_1.SyntaxKind.StringLiteral) {
                     const value = init.asKindOrThrow(ts_morph_1.SyntaxKind.StringLiteral);
                     events.add(value.getLiteralText());
                 }
-                // event={"signup"}
                 if (init.getKind() ===
                     ts_morph_1.SyntaxKind.JsxExpression) {
                     const expr = init

package/dist/utils/scanners/function-wrappers.js

@@ -7,29 +7,39 @@ function scanFunctionWrappers(source, wrappers) {
     const events = new Set();
     const calls = source.getDescendantsOfKind(ts_morph_1.SyntaxKind.CallExpression);
     for (const call of calls) {
-        const expression = call.getExpression();
-        let name = null;
-        // trackFeature()
-        if (expression.getKind() ===
-            ts_morph_1.SyntaxKind.Identifier) {
-            name =
-                expression.getText();
-        }
-        // analytics.trackFeature()
-        if (expression.getKind() ===
-            ts_morph_1.SyntaxKind.PropertyAccessExpression) {
-            const prop = expression.asKindOrThrow(ts_morph_1.SyntaxKind.PropertyAccessExpression);
-            name = prop.getName();
-        }
+        const name = getFunctionName(call);
         if (!name)
             continue;
         for (const wrapper of wrappers) {
-            if (name !== wrapper.name)
+            if (wrapper.name !== name)
                 continue;
-            const event = (0, extract_1.extractEvent)(call, wrapper.path);
+            const event = (0, extract_1.extractEvent)(call, wrapper.path ?? "0");
             if (event)
                 events.add(event);
         }
     }
     return events;
 }
+function getFunctionName(call) {
+    const expression = call.getExpression();
+    // trackFeature()
+    if (ts_morph_1.Node.isIdentifier(expression)) {
+        return expression.getText();
+    }
+    // analytics.trackFeature()
+    if (ts_morph_1.Node.isPropertyAccessExpression(expression)) {
+        return getDeepName(expression);
+    }
+    return null;
+}
+function getDeepName(node) {
+    let current = node;
+    let name = "";
+    while (ts_morph_1.Node.isPropertyAccessExpression(current)) {
+        name =
+            current.getName();
+        current =
+            current.getExpression();
+    }
+    return name;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eventra_dev/eventra-cli",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "Eventra CLI",
   "type": "commonjs",
   "bin": {
@@ -15,7 +15,8 @@
   "license": "MIT",
   "scripts": {
     "build": "tsc",
-    "dev": "tsx src/index.ts"
+    "dev": "tsx src/index.ts",
+    "test": "tsx tests/run.ts"
   },
   "dependencies": {
     "chalk": "^4.1.2",
@@ -29,6 +30,7 @@
     "@types/fs-extra": "^11.0.4",
     "@types/inquirer": "^9.0.9",
     "@types/node": "^20.0.0",
+    "cross-spawn": "^7.0.6",
     "tsx": "^4.7.0",
     "typescript": "^5.3.0"
   }

package/src/commands/init.ts

@@ -41,7 +41,9 @@ export async function init() {
     wrappers: [],
     functionWrappers: [],
     sync: {
-      include: ["**/*.{ts,tsx,js,jsx}"],
+      include: [
+        "**/*.{ts,tsx,js,jsx,vue,svelte,astro}"
+      ],
       exclude: [
         "node_modules",
         "dist",

package/src/commands/sync.ts

@@ -41,6 +41,17 @@ export async function sync() {
     }
   );
 
+  const functionWrappers =
+    (config.functionWrappers ?? []).map(
+      (w) => ({
+        ...w,
+        path: w.path ?? "0"
+      })
+    );
+
+  const componentWrappers =
+    config.wrappers ?? [];
+
   for (const file of files) {
     const parser =
       detectParser(file);
@@ -60,9 +71,14 @@ export async function sync() {
     if (parser === "astro")
       content = parseAstro(content);
 
+    const virtualFile =
+      parser === "ts"
+        ? file
+        : file + ".tsx";
+
     const source =
       project.createSourceFile(
-        file,
+        virtualFile,
         content,
         { overwrite: true }
       );
@@ -71,16 +87,17 @@ export async function sync() {
       (e) => events.add(e)
     );
 
+
     scanFunctionWrappers(
       source,
-      config.functionWrappers ?? []
+      functionWrappers
     ).forEach((e) =>
       events.add(e)
     );
 
     scanComponentWrappers(
       source,
-      config.wrappers ?? []
+      componentWrappers
     ).forEach((e) =>
       events.add(e)
     );

package/src/types.ts

@@ -5,7 +5,7 @@ export type ComponentWrapper = {
 
 export type FunctionWrapper = {
   name: string;
-  path: string;
+  path?: string;
 };
 
 export type EventraConfig = {

package/src/utils/config.ts

@@ -15,7 +15,7 @@ export function normalizeConfig(
       config.functionWrappers ?? [],
     sync: config.sync ?? {
       include: [
-        "**/*.{ts,tsx,js,jsx}"
+        "**/*.{ts,tsx,js,jsx,vue,svelte,astro}"
       ],
       exclude: [
         "node_modules",

package/src/utils/extract.ts

@@ -2,6 +2,7 @@ import {
   CallExpression,
   Node,
   ObjectLiteralExpression,
+  SyntaxKind,
 } from "ts-morph";
 
 export function extractEvent(
@@ -15,37 +16,59 @@ export function extractEvent(
 
   if (!node) return null;
 
-  for (let i = 1; i < parts.length; i++) {
-    if (
-      Node.isObjectLiteralExpression(node)
-    ) {
-      const obj: ObjectLiteralExpression =
-        node;
+  node = unwrap(node);
 
-      const prop =
-        obj.getProperty(parts[i]);
+  for (let i = 1; i < parts.length; i++) {
+    if (!Node.isObjectLiteralExpression(node)) {
+      return null;
+    }
 
-      if (!prop) return null;
+    const obj: ObjectLiteralExpression =
+      node;
 
-      if (
-        Node.isPropertyAssignment(prop)
-      ) {
-        const initializer =
-          prop.getInitializer();
+    const prop =
+      obj.getProperty(parts[i]);
 
-        if (!initializer) return null;
+    if (!prop) return null;
 
-        node = initializer;
-      }
+    if (!Node.isPropertyAssignment(prop)) {
+      return null;
     }
+
+    const initializer =
+      prop.getInitializer();
+
+    if (!initializer) return null;
+
+    node = unwrap(initializer);
+  }
+
+  if (Node.isStringLiteral(node)) {
+    return node.getLiteralText();
   }
 
   if (
-    node &&
-    Node.isStringLiteral(node)
+    node.getKind() ===
+    SyntaxKind.NoSubstitutionTemplateLiteral
   ) {
-    return node.getLiteralText();
+    return node
+      .getText()
+      .replace(/`/g, "");
   }
 
   return null;
 }
+
+function unwrap(node: Node): Node {
+  let current = node;
+
+  while (
+    Node.isParenthesizedExpression(
+      current
+    )
+    ) {
+    current = current.getExpression();
+  }
+
+  return current;
+}

package/src/utils/parsers/vue.ts

@@ -11,9 +11,15 @@ export function parseVue(
       /<script[\s\S]*?>([\s\S]*?)<\/script>/
     );
 
+  return `
+${script?.[1] ?? ""}
+
+function __vue_template__() {
   return (
-    (template?.[1] ?? "") +
-    "\n" +
-    (script?.[1] ?? "")
+    <>
+      ${template?.[1] ?? ""}
+    </>
   );
 }
+`;
+}

package/src/utils/scanners/component-wrappers.ts

@@ -61,7 +61,6 @@ export function scanComponentWrappers(
 
         if (!init) continue;
 
-        // event="signup"
         if (
           init.getKind() ===
           SyntaxKind.StringLiteral
@@ -76,7 +75,6 @@ export function scanComponentWrappers(
           );
         }
 
-        // event={"signup"}
         if (
           init.getKind() ===
           SyntaxKind.JsxExpression

package/src/utils/scanners/function-wrappers.ts

@@ -1,6 +1,9 @@
 import {
   SourceFile,
   SyntaxKind,
+  Node,
+  CallExpression,
+  PropertyAccessExpression,
 } from "ts-morph";
 
 import { extractEvent } from "../extract";
@@ -10,8 +13,7 @@ export function scanFunctionWrappers(
   source: SourceFile,
   wrappers: FunctionWrapper[]
 ) {
-  const events =
-    new Set<string>();
+  const events = new Set<string>();
 
   const calls =
     source.getDescendantsOfKind(
@@ -19,43 +21,19 @@ export function scanFunctionWrappers(
     );
 
   for (const call of calls) {
-    const expression =
-      call.getExpression();
-
-    let name: string | null = null;
-
-    // trackFeature()
-    if (
-      expression.getKind() ===
-      SyntaxKind.Identifier
-    ) {
-      name =
-        expression.getText();
-    }
-
-    // analytics.trackFeature()
-    if (
-      expression.getKind() ===
-      SyntaxKind.PropertyAccessExpression
-    ) {
-      const prop =
-        expression.asKindOrThrow(
-          SyntaxKind.PropertyAccessExpression
-        );
-
-      name = prop.getName();
-    }
+    const name =
+      getFunctionName(call);
 
     if (!name) continue;
 
     for (const wrapper of wrappers) {
-      if (name !== wrapper.name)
+      if (wrapper.name !== name)
         continue;
 
       const event =
         extractEvent(
           call,
-          wrapper.path
+          wrapper.path ?? "0"
         );
 
       if (event)
@@ -65,3 +43,56 @@ export function scanFunctionWrappers(
 
   return events;
 }
+
+function getFunctionName(
+  call: CallExpression
+): string | null {
+  const expression =
+    call.getExpression();
+
+  // trackFeature()
+  if (
+    Node.isIdentifier(
+      expression
+    )
+  ) {
+    return expression.getText();
+  }
+
+  // analytics.trackFeature()
+  if (
+    Node.isPropertyAccessExpression(
+      expression
+    )
+  ) {
+    return getDeepName(
+      expression
+    );
+  }
+
+  return null;
+}
+
+function getDeepName(
+  node: PropertyAccessExpression
+): string {
+  let current:
+    | Node
+    | undefined = node;
+
+  let name = "";
+
+  while (
+    Node.isPropertyAccessExpression(
+      current
+    )
+    ) {
+    name =
+      current.getName();
+
+    current =
+      current.getExpression();
+  }
+
+  return name;
+}

package/tests/fixtures/backend/express/app.ts

@@ -0,0 +1,78 @@
+/* eslint-disable */
+
+declare function track(event: string): void;
+
+const express = (...args: any[]) => ({
+  get: (...args: any[]) => {},
+  post: (...args: any[]) => {},
+  put: (...args: any[]) => {},
+  delete: (...args: any[]) => {},
+  use: (...args: any[]) => {},
+  listen: (...args: any[]) => {}
+});
+
+const app = express();
+
+// ===== direct =====
+track("express_event");
+
+// ===== middleware =====
+app.use(() => {
+  track("middleware_event");
+});
+
+// ===== get =====
+app.get("/", () => {
+  track("get_event");
+});
+
+// ===== post =====
+app.post("/users", () => {
+  track("post_event");
+});
+
+// ===== put =====
+app.put("/users", () => {
+  track("put_event");
+});
+
+// ===== delete =====
+app.delete("/users", () => {
+  track("delete_event");
+});
+
+// ===== nested =====
+app.get("/nested", () => {
+  if (true) {
+    track("nested_event");
+  }
+});
+
+// ===== async =====
+app.get("/async", async () => {
+  track("async_event");
+});
+
+// ===== arrow =====
+const handler = () => {
+  track("arrow_event");
+};
+
+app.get("/arrow", handler);
+
+// ===== function =====
+function service() {
+  track("function_event");
+}
+
+// ===== class =====
+class Service {
+  run() {
+    track("class_event");
+  }
+}
+
+// ===== listen =====
+app.listen(3000, () => {
+  track("listen_event");
+});

package/tests/fixtures/backend/nest/service.ts

@@ -0,0 +1,70 @@
+/* eslint-disable */
+
+declare function track(event: string): void;
+
+function Injectable(): any {
+  return () => {};
+}
+
+function Controller(): any {
+  return () => {};
+}
+
+function Get(): any {
+  return () => {};
+}
+
+function Post(): any {
+  return () => {};
+}
+
+// ===== service =====
+@Injectable()
+export class TestService {
+  run() {
+    track("nest_event");
+  }
+
+  async asyncRun() {
+    track("async_event");
+  }
+
+  arrow = () => {
+    track("arrow_event");
+  };
+}
+
+// ===== controller =====
+@Controller()
+export class TestController {
+  @Get()
+  get() {
+    track("get_event");
+  }
+
+  @Post()
+  post() {
+    track("post_event");
+  }
+
+  nested() {
+    if (true) {
+      track("nested_event");
+    }
+  }
+}
+
+// ===== function =====
+function service() {
+  track("function_event");
+}
+
+// ===== class =====
+class AnotherService {
+  run() {
+    track("class_event");
+  }
+}
+
+// ===== direct =====
+track("direct_event");

package/tests/fixtures/backend/node/index.ts

@@ -0,0 +1,63 @@
+/* eslint-disable */
+
+declare function track(event: string): void;
+
+const eventName = "variable_event";
+
+// ===== direct =====
+track("node_event");
+
+// ===== multiline =====
+track(
+  "multiline_event"
+);
+
+// ===== template string =====
+track(`template_event`);
+
+// ===== conditional =====
+if (true) {
+  track("conditional_event");
+}
+
+// ===== ternary =====
+true
+  ? track("ternary_a")
+  : track("ternary_b");
+
+// ===== variable =====
+track(eventName);
+
+// ===== function =====
+function run() {
+  track("function_event");
+}
+
+// ===== arrow =====
+const handler = () => {
+  track("arrow_event");
+};
+
+// ===== class =====
+class Service {
+  run() {
+    track("class_event");
+  }
+}
+
+// ===== nested =====
+function outer() {
+  function inner() {
+    track("nested_event");
+  }
+}
+
+// ===== async =====
+async function asyncRun() {
+  track("async_event");
+}
+
+// ===== promise =====
+Promise.resolve().then(() => {
+  track("promise_event");
+});

package/tests/fixtures/frontend/next/page.tsx

@@ -0,0 +1,101 @@
+/* eslint-disable */
+
+declare function track(event: string): void;
+declare function trackFeature(event: string): void;
+
+declare const analytics: any;
+declare const Button: any;
+declare const TrackedButton: any;
+declare const MyButton: any;
+
+const eventName = "variable_event";
+
+export default function Page() {
+  // ===== direct =====
+  track("next_event");
+
+  // ===== multiline =====
+  track(
+    "multiline_event"
+  );
+
+  // ===== template string =====
+  track(`template_event`);
+
+  // ===== wrapper function =====
+  trackFeature("wrapper_function");
+
+  // ===== object =====
+  analytics.track("object_track");
+
+  // ===== nested object =====
+  analytics.events.track("nested_track");
+
+  // ===== variable =====
+  track(eventName);
+
+  // ===== conditional =====
+  if (true) {
+    track("conditional_event");
+  }
+
+  // ===== ternary =====
+  true
+    ? track("ternary_a")
+    : track("ternary_b");
+
+  // ===== arrow function =====
+  const run = () => {
+    track("arrow_event");
+  };
+
+  // ===== function =====
+  function test() {
+    track("function_event");
+  }
+
+  // ===== class =====
+  class Service {
+    run() {
+      track("class_event");
+    }
+  }
+
+  return (
+    <>
+      {/* basic */}
+      <Button event="next_button" />
+
+      {/* expression */}
+      <Button event={"expression_event"} />
+
+      {/* wrapper component */}
+      <TrackedButton event="tracked_button" />
+
+      {/* another wrapper */}
+      <MyButton event="my_button" />
+
+      {/* nested */}
+      <div>
+        <Button event="nested_button" />
+      </div>
+
+      {/* conditional */}
+      {true && (
+        <Button event="conditional_button" />
+      )}
+
+      {/* ternary */}
+      {true
+        ? <Button event="ternary_a_button" />
+        : <Button event="ternary_b_button" />
+      }
+
+      {/* array */}
+      {[
+        <Button key="1" event="array_1" />,
+        <Button key="2" event="array_2" />
+      ]}
+    </>
+  );
+}

package/tests/fixtures/frontend/react/App.tsx

@@ -0,0 +1,104 @@
+/* eslint-disable */
+
+declare function track(event: string): void;
+declare function trackFeature(event: string): void;
+
+declare const analytics: any;
+declare const Button: any;
+declare const TrackedButton: any;
+declare const MyButton: any;
+
+const eventName = "variable_event";
+
+// ===== direct =====
+track("direct_event");
+
+// ===== multiline =====
+track(
+  "multiline_event"
+);
+
+// ===== template string =====
+track(`template_event`);
+
+// ===== conditional =====
+if (true) {
+  track("conditional_event");
+}
+
+// ===== ternary =====
+true
+  ? track("ternary_a")
+  : track("ternary_b");
+
+// ===== wrapper function =====
+trackFeature("wrapper_function");
+
+// ===== object function =====
+analytics.track("object_track");
+
+// ===== nested object =====
+analytics.events.track("nested_track");
+
+// ===== variable (optional support) =====
+track(eventName);
+
+// ===== function =====
+function test() {
+  track("function_event");
+}
+
+// ===== arrow function =====
+const run = () => {
+  track("arrow_event");
+};
+
+// ===== class =====
+class TestService {
+  run() {
+    track("class_event");
+  }
+}
+
+// ===== component return =====
+export default function Page() {
+  track("page_event");
+
+  return (
+    <>
+      {/* basic */}
+      <Button event="button_event" />
+
+      {/* wrapper component */}
+      <TrackedButton event="tracked_button" />
+
+      {/* another wrapper */}
+      <MyButton event="my_button" />
+
+      {/* expression */}
+      <Button event={"expression_event"} />
+
+      {/* nested */}
+      <div>
+        <Button event="nested_button" />
+      </div>
+
+      {/* conditional */}
+      {true && (
+        <Button event="conditional_button" />
+      )}
+
+      {/* ternary */}
+      {true
+        ? <Button event="ternary_a_button" />
+        : <Button event="ternary_b_button" />
+      }
+
+      {/* array */}
+      {[
+        <Button key="1" event="array_1" />,
+        <Button key="2" event="array_2" />
+      ]}
+    </>
+  );
+}

package/tests/fixtures/frontend/vue/App.vue

@@ -0,0 +1,83 @@
+<script setup lang="ts">
+/* eslint-disable */
+
+declare function track(event: string): void
+declare function trackFeature(event: string): void
+
+declare const analytics: any
+
+const eventName = "variable_event"
+
+// ===== direct =====
+track("vue_event")
+
+// ===== multiline =====
+track(
+    "multiline_event"
+)
+
+// ===== template string =====
+track(`template_event`)
+
+// ===== wrapper function =====
+trackFeature("wrapper_function")
+
+// ===== object =====
+analytics.track("object_track")
+
+// ===== nested object =====
+analytics.events.track("nested_track")
+
+// ===== variable =====
+track(eventName)
+
+// ===== conditional =====
+if (true) {
+  track("conditional_event")
+}
+
+// ===== ternary =====
+true
+    ? track("ternary_a")
+    : track("ternary_b")
+
+// ===== function =====
+function test() {
+  track("function_event")
+}
+
+// ===== arrow =====
+const run = () => {
+  track("arrow_event")
+}
+
+// ===== class =====
+class Service {
+  run() {
+    track("class_event")
+  }
+}
+</script>
+
+<template>
+  <!-- basic -->
+  <Button event="vue_button" />
+
+  <!-- expression -->
+  <Button event="expression_event" />
+
+  <!-- nested -->
+  <div>
+    <Button event="nested_button" />
+  </div>
+
+  <!-- conditional -->
+  <Button
+      v-if="true"
+      event="conditional_button"
+  />
+
+  <!-- array -->
+  <Button event="array_1" />
+  <Button event="array_2" />
+</template>

package/tests/fixtures/wrappers/component/test.tsx

@@ -0,0 +1,62 @@
+/* eslint-disable */
+
+declare const Button: any;
+declare const TrackedButton: any;
+declare const MyButton: any;
+
+const eventName = "variable_event";
+
+export default function WrapperTest() {
+  return (
+    <>
+      {/* basic */}
+      <Button event="wrapper_button" />
+
+      {/* expression */}
+      <Button event={"expression_button"} />
+
+      {/* nested */}
+      <div>
+        <Button event="nested_button" />
+      </div>
+
+      {/* fragment */}
+      <>
+        <Button event="fragment_button" />
+      </>
+
+      {/* conditional */}
+      {true && (
+        <Button event="conditional_button" />
+      )}
+
+      {/* ternary */}
+      {true
+        ? <Button event="ternary_a_button" />
+        : <Button event="ternary_b_button" />
+      }
+
+      {/* array */}
+      {[
+        <Button key="1" event="array_1" />,
+        <Button key="2" event="array_2" />
+      ]}
+
+      {/* wrapper components */}
+      <TrackedButton event="tracked_button" />
+      <MyButton event="my_button" />
+
+      {/* multiline */}
+      <Button
+        event="multiline_button"
+      />
+
+      {/* deep nested */}
+      <div>
+        <section>
+          <Button event="deep_nested" />
+        </section>
+      </div>
+    </>
+  );
+}

package/tests/fixtures/wrappers/function/test.ts

@@ -0,0 +1,60 @@
+/* eslint-disable */
+
+declare function trackFeature(event: string): void;
+declare const analytics: any;
+
+const eventName = "variable_event";
+
+// ===== basic =====
+trackFeature("wrapper_function");
+
+// ===== multiline =====
+trackFeature(
+  "multiline_function"
+);
+
+// ===== template string =====
+trackFeature(`template_function`);
+
+// ===== conditional =====
+if (true) {
+  trackFeature("conditional_function");
+}
+
+// ===== ternary =====
+true
+  ? trackFeature("ternary_a")
+  : trackFeature("ternary_b");
+
+// ===== variable =====
+trackFeature(eventName);
+
+// ===== function =====
+function run() {
+  trackFeature("function_event");
+}
+
+// ===== arrow =====
+const test = () => {
+  trackFeature("arrow_event");
+};
+
+// ===== class =====
+class Service {
+  run() {
+    trackFeature("class_event");
+  }
+}
+
+// ===== nested function =====
+function outer() {
+  function inner() {
+    trackFeature("nested_function");
+  }
+}
+
+// ===== object wrapper =====
+analytics.trackFeature("object_wrapper");
+
+// ===== nested object wrapper =====
+analytics.events.trackFeature("nested_object_wrapper");

package/tests/run.ts

@@ -0,0 +1,120 @@
+import { spawnSync } from "child_process";
+import * as path from "path";
+import * as fs from "fs";
+
+const ROOT = path.resolve(__dirname, "..");
+const CLI = path.resolve(ROOT, "dist/index.js");
+
+const fixtures = [
+  "frontend/react",
+  "frontend/vue",
+  "frontend/next",
+
+  "backend/node",
+  "backend/express",
+  "backend/nest",
+
+  "wrappers/component",
+  "wrappers/function"
+];
+
+function runCLI(args: string[], cwd: string) {
+  const result = spawnSync(
+    process.execPath,
+    [CLI, ...args],
+    {
+      cwd,
+      encoding: "utf-8",
+      input: "\n"
+    }
+  );
+
+  return (result.stdout ?? "") + (result.stderr ?? "");
+}
+
+function ensureTestConfig(dir: string) {
+  const configPath = path.join(dir, "eventra.json");
+
+  if (fs.existsSync(configPath)) return;
+
+  const config = {
+    apiKey: "",
+    events: [],
+    wrappers: [
+      {
+        name: "Button",
+        prop: "event"
+      }
+    ],
+    functionWrappers: [
+      {
+        name: "trackFeature",
+        path: "0"
+      }
+    ],
+    sync: {
+      include: [
+        "**/*.{ts,tsx,js,jsx,vue,svelte,astro}"
+      ],
+      exclude: [
+        "node_modules",
+        "dist",
+        ".next",
+        ".git"
+      ]
+    }
+  };
+
+  fs.writeFileSync(
+    configPath,
+    JSON.stringify(config, null, 2)
+  );
+}
+
+function cleanup(dir: string) {
+  const configPath = path.join(dir, "eventra.json");
+
+  if (fs.existsSync(configPath)) {
+    fs.unlinkSync(configPath);
+  }
+}
+
+function runFixture(name: string) {
+  const dir = path.resolve(
+    __dirname,
+    "fixtures",
+    name
+  );
+
+  console.log(`\nRunning: ${name}`);
+
+  ensureTestConfig(dir);
+
+  runCLI(["init"], dir);
+
+  const output = runCLI(["sync"], dir);
+
+  const match =
+    output.match(/Found (\d+) events/);
+
+  const count = match ? match[1] : "0";
+
+  console.log(
+    `✓ ${name} OK (${count} events)`
+  );
+
+  // cleanup
+  cleanup(dir);
+}
+
+function run() {
+  for (const fixture of fixtures) {
+    runFixture(fixture);
+  }
+
+  console.log(
+    "\nAll fixtures passed"
+  );
+}
+
+run();