diff --git a/cypress.config.js b/cypress.config.js index cdcae02e65..98bd8956a0 100644 --- a/cypress.config.js +++ b/cypress.config.js @@ -18,5 +18,6 @@ module.exports = defineConfig({ screenshotOnRunFailure: true, experimentalInteractiveRunEvents: true, experimentalSessionAndOrigin: true, + blockHosts: ['telemetry.n8n.io'], }, }); diff --git a/package.json b/package.json index 4af7318dd0..2e0facc379 100644 --- a/package.json +++ b/package.json @@ -63,6 +63,7 @@ "turbo": "1.10.12", "typescript": "*", "vite": "^4.4.7", + "vite-plugin-ejs": "^1.6.4", "vitest": "^0.33.0", "vue-tsc": "^1.8.8" }, diff --git a/packages/editor-ui/index.html b/packages/editor-ui/index.html index 12dbfaeb9d..d7259bd02a 100644 --- a/packages/editor-ui/index.html +++ b/packages/editor-ui/index.html @@ -9,6 +9,9 @@ window.BASE_PATH = '/{{BASE_PATH}}/'; window.REST_ENDPOINT = '{{REST_ENDPOINT}}'; + <% if(!isDev){ %> + + <% } %> n8n.io - Workflow Automation diff --git a/packages/editor-ui/src/plugins/telemetry/index.ts b/packages/editor-ui/src/plugins/telemetry/index.ts index 295ea7a006..84ff0f5904 100644 --- a/packages/editor-ui/src/plugins/telemetry/index.ts +++ b/packages/editor-ui/src/plugins/telemetry/index.ts @@ -1,35 +1,28 @@ import type { Plugin } from 'vue'; -import type { ITelemetrySettings, ITelemetryTrackProperties, IDataObject } from 'n8n-workflow'; +import type { IDataObject, ITelemetrySettings, ITelemetryTrackProperties } from 'n8n-workflow'; import type { RouteLocation } from 'vue-router'; import type { INodeCreateElement, IUpdateInformation } from '@/Interface'; -import type { IUserNodesPanelSession } from './telemetry.types'; +import type { IUserNodesPanelSession, RudderStack } from './telemetry.types'; import { useSettingsStore } from '@/stores/settings.store'; import { useRootStore } from '@/stores/n8nRoot.store'; import { useTelemetryStore } from '@/stores/telemetry.store'; import { SLACK_NODE_TYPE } from '@/constants'; export class Telemetry { - private pageEventQueue: Array<{ route: RouteLocation }>; - private previousPath: string; - - private get rudderStack() { - return window.rudderanalytics; - } - - private userNodesPanelSession: IUserNodesPanelSession = { - sessionId: '', - data: { - nodeFilter: '', - resultsNodes: [], - filterMode: 'Regular', + constructor( + private rudderStack: RudderStack, + private userNodesPanelSession: IUserNodesPanelSession = { + sessionId: '', + data: { + nodeFilter: '', + resultsNodes: [], + filterMode: 'Regular', + }, }, - }; - - constructor() { - this.pageEventQueue = []; - this.previousPath = ''; - } + private pageEventQueue: Array<{ route: RouteLocation }> = [], + private previousPath: string = '', + ) {} init( telemetrySettings: ITelemetrySettings, @@ -100,17 +93,12 @@ export class Telemetry { const pageName = route.name; let properties: { [key: string]: string } = {}; - if ( - route.meta && - route.meta.telemetry && - typeof route.meta.telemetry.getProperties === 'function' - ) { + if (route.meta?.telemetry && typeof route.meta.telemetry.getProperties === 'function') { properties = route.meta.telemetry.getProperties(route); } - const category = - (route.meta && route.meta.telemetry && route.meta.telemetry.pageCategory) || 'Editor'; - this.rudderStack.page(category, pageName!, properties); + const category = route.meta?.telemetry?.pageCategory || 'Editor'; + this.rudderStack.page(category, pageName, properties); } else { this.pageEventQueue.push({ route, @@ -234,8 +222,6 @@ export class Telemetry { } private initRudderStack(key: string, url: string, options: IDataObject) { - window.rudderanalytics = window.rudderanalytics || []; - this.rudderStack.methods = [ 'load', 'page', @@ -262,26 +248,20 @@ export class Telemetry { this.rudderStack[method] = this.rudderStack.factory(method); } - this.rudderStack.loadJS = () => { - const script = document.createElement('script'); - - script.type = 'text/javascript'; - script.async = !0; - script.src = 'https://cdn-rs.n8n.io/v1/ra.min.js'; - - const element: Element = document.getElementsByTagName('script')[0]; - - if (element && element.parentNode) { - element.parentNode.insertBefore(script, element); - } - }; - - this.rudderStack.loadJS(); this.rudderStack.load(key, url, options); } } -export const telemetry = new Telemetry(); +export const telemetry = new Telemetry( + window.rudderanalytics ?? { + identify: () => {}, + reset: () => {}, + track: () => {}, + page: () => {}, + push: () => {}, + load: () => {}, + }, +); export const TelemetryPlugin: Plugin<{}> = { install(app) { diff --git a/packages/editor-ui/src/plugins/telemetry/telemetry.types.ts b/packages/editor-ui/src/plugins/telemetry/telemetry.types.ts index b4d0078322..700edeea28 100644 --- a/packages/editor-ui/src/plugins/telemetry/telemetry.types.ts +++ b/packages/editor-ui/src/plugins/telemetry/telemetry.types.ts @@ -17,17 +17,15 @@ interface IUserNodesPanelSessionData { /** * Simplified version of: - * https://github.com/rudderlabs/rudder-sdk-js/blob/master/dist/rudder-sdk-js/index.d.ts + * https://github.com/rudderlabs/rudder-sdk-js/blob/production-staging/packages/npm/index.d.ts */ -interface RudderStack extends Array { +export interface RudderStack { [key: string]: unknown; methods: string[]; factory: (method: string) => (...args: unknown[]) => RudderStack; - loadJS(): void; - /** * Native methods */ diff --git a/packages/editor-ui/vite.config.ts b/packages/editor-ui/vite.config.ts index aaf4cd92ff..40ed61ebef 100644 --- a/packages/editor-ui/vite.config.ts +++ b/packages/editor-ui/vite.config.ts @@ -3,6 +3,7 @@ import { resolve } from 'path'; import { defineConfig, mergeConfig } from 'vite'; import { defineConfig as defineVitestConfig } from 'vitest/config'; import { sentryVitePlugin } from '@sentry/vite-plugin'; +import { ViteEjsPlugin } from "vite-plugin-ejs"; import packageJSON from './package.json'; @@ -62,7 +63,7 @@ const alias = [ }, ]; -const plugins = [vue()]; +const plugins = [vue(), ViteEjsPlugin()]; const { SENTRY_AUTH_TOKEN: authToken, RELEASE: release } = process.env; if (release && authToken) { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 35dbd66a4d..9753a547c2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -124,6 +124,9 @@ importers: vite: specifier: ^4.4.7 version: 4.4.7(less@4.1.3)(sass@1.64.1) + vite-plugin-ejs: + specifier: ^1.6.4 + version: 1.6.4 vitest: specifier: ^0.33.0 version: 0.33.0 @@ -20715,6 +20718,12 @@ packages: - terser dev: true + /vite-plugin-ejs@1.6.4: + resolution: {integrity: sha512-23p1RS4PiA0veXY5/gHZ60pl3pPvd8NEqdBsDgxNK8nM1rjFFDcVb0paNmuipzCgNP/Y0f/Id22M7Il4kvZ2jA==} + dependencies: + ejs: 3.1.8 + dev: true + /vite@4.4.7(@types/node@18.16.16): resolution: {integrity: sha512-6pYf9QJ1mHylfVh39HpuSfMPojPSKVxZvnclX1K1FyZ1PXDOcLBibdq5t1qxJSnL63ca8Wf4zts6mD8u8oc9Fw==} engines: {node: ^14.18.0 || >=16.0.0}