From a44d8bb53af5d0b15b9663ef55f80c436020b225 Mon Sep 17 00:00:00 2001 From: Chris <7249920+chriswdmr@users.noreply.github.com> Date: Thu, 7 Sep 2023 14:53:36 +0200 Subject: [PATCH] Simplify plugin and reduce scope --- packages/integrations/vercel/README.md | 20 ---- .../vercel/src/lib/web-analytics.ts | 102 ++++-------------- .../vercel/src/serverless/adapter.ts | 13 +-- .../integrations/vercel/src/static/adapter.ts | 13 +-- .../output-as-server/astro.config.mjs | 10 -- .../output-as-server/package.json | 9 -- .../output-as-server/src/pages/one.astro | 8 -- .../output-as-server/src/pages/two.astro | 8 -- .../vercel/test/web-analytics.test.js | 31 +----- 9 files changed, 30 insertions(+), 184 deletions(-) delete mode 100644 packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/astro.config.mjs delete mode 100644 packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/package.json delete mode 100644 packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/one.astro delete mode 100644 packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/two.astro diff --git a/packages/integrations/vercel/README.md b/packages/integrations/vercel/README.md index 67c2eb1bf..6dc0bd4ff 100644 --- a/packages/integrations/vercel/README.md +++ b/packages/integrations/vercel/README.md @@ -92,7 +92,6 @@ To configure this adapter, pass an object to the `vercel()` function call in `as **Added in:** `@astrojs/vercel@3.8.0` You can enable [Vercel Web Analytics](https://vercel.com/docs/concepts/analytics) by setting `webAnalytics: { enabled: true }`. This will inject Vercel’s tracking scripts into all of your pages. -You can also pass [configuration options](https://vercel.com/docs/concepts/analytics/package) like `mode` and `debug` via the `config` property inside `webAnalytics`. ```js // astro.config.mjs @@ -109,25 +108,6 @@ export default defineConfig({ }); ``` -#### `beforeSend` - -`beforeSend` is a function that can modify analytics event data before it's sent to Vercel. - -Define this function in a separate file at the root of your project called `vercel-web-analytics.ts` (or `vercel-web-analytics.js` if you're not using TypeScript). - -```ts -// vercel-web-analytics.ts -import type { VercelWebAnalyticsBeforeSend } from '@astrojs/vercel'; - -export const beforeSend: VercelWebAnalyticsBeforeSend = (event) => { - // Ignore all events that have a `/private` inside the URL - if (event.url.includes('/private')) { - return null; - } - return event; -}; -``` - ### Speed Insights You can enable [Vercel Speed Insights](https://vercel.com/docs/concepts/speed-insights) by setting `speedInsights: { enabled: true }`. This will collect and send Web Vital data to Vercel. diff --git a/packages/integrations/vercel/src/lib/web-analytics.ts b/packages/integrations/vercel/src/lib/web-analytics.ts index c098f5b7f..d6ee4d78d 100644 --- a/packages/integrations/vercel/src/lib/web-analytics.ts +++ b/packages/integrations/vercel/src/lib/web-analytics.ts @@ -1,90 +1,30 @@ -import { AstroError } from 'astro/errors'; -import type { AnalyticsProps } from '@vercel/analytics'; -import { fileURLToPath } from 'url'; -import { existsSync } from 'node:fs'; -import type { AstroIntegrationLogger } from 'astro'; - export type VercelWebAnalyticsConfig = { enabled: boolean; - config?: Omit; }; -export function getWebAnalyticsViteConfig(enabled?: boolean) { - if (enabled) { - return { - build: { - rollupOptions: { - external: ['@vercel/analytics'], - }, - }, - }; - } - - return {}; -} - -async function getWebAnalyticsFunctions({ - root, - logger, -}: { - root: URL; - logger: AstroIntegrationLogger; -}) { - const tsPath = fileURLToPath(new URL('./vercel-web-analytics.ts', root)); - const jsPath = fileURLToPath(new URL('./vercel-web-analytics.js', root)); - - const tsFileExists = existsSync(tsPath); - const jsFileExists = existsSync(jsPath); - - if (tsFileExists && jsFileExists) { - logger.warn( - `@astrojs/vercel: Both \`vercel-web-analytics.ts\` and \`vercel-web-analytics.js\` exist. Using \`vercel-web-analytics.ts\`.` - ); - } - - if (!tsFileExists && !jsFileExists) { - logger.debug( - `@astrojs/vercel: \`vercel-web-analytics.ts\` or \`vercel-web-analytics.js\` not found.` - ); - - return { - beforeSend: undefined, - }; - } - - const functions = await import( - tsFileExists ? /* @vite-ignore */ tsPath : /* @vite-ignore */ jsPath - ); - - if (typeof functions.beforeSend !== 'function') { - throw new AstroError( - `@astrojs/vercel: \`vercel-web-analytics.${ - tsFileExists ? 'ts' : 'js' - }\` must export a \`beforeSend\` function.` - ); - } - - return { - beforeSend: functions.beforeSend, - }; -} - export async function getInjectableWebAnalyticsContent({ - config, - astro, + mode, }: { - config: Omit | undefined; - astro: { - root: URL; - logger: AstroIntegrationLogger; - }; + mode: 'development' | 'production'; }) { - const { beforeSend } = await getWebAnalyticsFunctions(astro); + const base = `window.va = window.va || function () { (window.vaq = window.vaq || []).push(arguments); };`; - return `import { inject } from '@vercel/analytics'; - inject({ - mode: ${config?.mode}, - beforeSend: ${beforeSend}, - debug: ${config?.debug} - });`; + if (mode === 'development') { + return ` + ${base} + var script = document.createElement('script'); + script.defer = true; + script.src = 'https://cdn.vercel-insights.com/v1/script.debug.js'; + var head = document.querySelector('head'); + head.appendChild(script); + `; + } + + return `${base} + var script = document.createElement('script'); + script.defer = true; + script.src = '/_vercel/insights/script.js'; + var head = document.querySelector('head'); + head.appendChild(script); + `; } diff --git a/packages/integrations/vercel/src/serverless/adapter.ts b/packages/integrations/vercel/src/serverless/adapter.ts index 99e3a08e3..1b222af15 100644 --- a/packages/integrations/vercel/src/serverless/adapter.ts +++ b/packages/integrations/vercel/src/serverless/adapter.ts @@ -16,7 +16,6 @@ import { getRedirects } from '../lib/redirects.js'; import { generateEdgeMiddleware } from './middleware.js'; import { getInjectableWebAnalyticsContent, - getWebAnalyticsViteConfig, type VercelWebAnalyticsConfig, } from '../lib/web-analytics.js'; import { @@ -148,16 +147,9 @@ export default function vercelServerless({ } injectScript( - 'page', + 'head-inline', await getInjectableWebAnalyticsContent({ - config: { - ...(webAnalytics?.config || {}), - mode: command === 'dev' ? 'development' : 'production', - }, - astro: { - root: config.root, - logger, - }, + mode: command === 'dev' ? 'development' : 'production', }) ); } @@ -173,7 +165,6 @@ export default function vercelServerless({ server: new URL('./dist/', config.root), }, vite: { - ...getWebAnalyticsViteConfig(webAnalytics?.enabled || analytics), ...getSpeedInsightsViteConfig(speedInsights?.enabled || analytics), ssr: { external: ['@vercel/nft'], diff --git a/packages/integrations/vercel/src/static/adapter.ts b/packages/integrations/vercel/src/static/adapter.ts index 063cfed60..f0e30ca5c 100644 --- a/packages/integrations/vercel/src/static/adapter.ts +++ b/packages/integrations/vercel/src/static/adapter.ts @@ -10,7 +10,6 @@ import { } from '../lib/speed-insights.js'; import { getInjectableWebAnalyticsContent, - getWebAnalyticsViteConfig, type VercelWebAnalyticsConfig, } from '../lib/web-analytics.js'; @@ -68,16 +67,9 @@ export default function vercelStatic({ } injectScript( - 'page', + 'head-inline', await getInjectableWebAnalyticsContent({ - config: { - ...(webAnalytics?.config || {}), - mode: command === 'dev' ? 'development' : 'production', - }, - astro: { - root: config.root, - logger, - }, + mode: command === 'dev' ? 'development' : 'production', }) ); } @@ -92,7 +84,6 @@ export default function vercelStatic({ redirects: false, }, vite: { - ...getWebAnalyticsViteConfig(webAnalytics?.enabled || analytics), ...getSpeedInsightsViteConfig(speedInsights?.enabled || analytics), }, ...getImageConfig(imageService, imagesConfig, command), diff --git a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/astro.config.mjs b/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/astro.config.mjs deleted file mode 100644 index 8f47c4f5a..000000000 --- a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/astro.config.mjs +++ /dev/null @@ -1,10 +0,0 @@ -import { defineConfig } from 'astro/config'; -import vercel from '@astrojs/vercel/serverless'; - -export default defineConfig({ - adapter: vercel({ - webAnalytics: { - enabled: true - } - }) -}); diff --git a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/package.json b/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/package.json deleted file mode 100644 index 9f7d696c4..000000000 --- a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/package.json +++ /dev/null @@ -1,9 +0,0 @@ -{ - "name": "@test/astro-vercel-with-web-analytics-enabled-output-as-server", - "version": "0.0.0", - "private": true, - "dependencies": { - "@astrojs/vercel": "workspace:*", - "astro": "workspace:*" - } -} diff --git a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/one.astro b/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/one.astro deleted file mode 100644 index 0c7fb90a7..000000000 --- a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/one.astro +++ /dev/null @@ -1,8 +0,0 @@ - - - One - - -

One

- - diff --git a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/two.astro b/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/two.astro deleted file mode 100644 index e7ba9910e..000000000 --- a/packages/integrations/vercel/test/fixtures/with-web-analytics-enabled/output-as-server/src/pages/two.astro +++ /dev/null @@ -1,8 +0,0 @@ - - - Two - - -

Two

- - diff --git a/packages/integrations/vercel/test/web-analytics.test.js b/packages/integrations/vercel/test/web-analytics.test.js index 78de43653..b728fae4c 100644 --- a/packages/integrations/vercel/test/web-analytics.test.js +++ b/packages/integrations/vercel/test/web-analytics.test.js @@ -2,27 +2,6 @@ import { loadFixture } from './test-utils.js'; import { expect } from 'chai'; describe('Vercel Web Analytics', () => { - describe('output: server', () => { - /** @type {import('./test-utils.js').Fixture} */ - let fixture; - - before(async () => { - fixture = await loadFixture({ - root: './fixtures/with-web-analytics-enabled/output-as-server/', - output: 'server', - }); - await fixture.build(); - }); - - it('ensures that Vercel Web Analytics is present in the bundle', async () => { - const [page] = await fixture.readdir('../.vercel/output/static/_astro'); - - const bundle = await fixture.readFile(`../.vercel/output/static/_astro/${page}`); - - expect(bundle).to.contain('/_vercel/insights'); - }); - }); - describe('output: static', () => { /** @type {import('./test-utils.js').Fixture} */ let fixture; @@ -35,12 +14,12 @@ describe('Vercel Web Analytics', () => { await fixture.build(); }); - it('ensures that Vercel Web Analytics is present in the bundle', async () => { - const [page] = await fixture.readdir('../.vercel/output/static/_astro'); + it('ensures that Vercel Web Analytics is present in the header', async () => { + const pageOne = await fixture.readFile('../.vercel/output/static/one/index.html'); + const pageTwo = await fixture.readFile('../.vercel/output/static/two/index.html'); - const bundle = await fixture.readFile(`../.vercel/output/static/_astro/${page}`); - - expect(bundle).to.contain('/_vercel/insights'); + expect(pageOne).to.contain('/_vercel/insights/script.js'); + expect(pageTwo).to.contain('/_vercel/insights/script.js'); }); }); });