[@astrojs/vercel] Individually enable Speed Insights and Web Analytics (#8021)

* Individually enable Speed Insights and Web Analytics

* Update pnpm-lock.yaml

* Remove .only on tests

* Fix build

* Move `beforeSend` out of config

* Address feedback from review

* Update README.md

* Add back the `analytics` property and add deprecation warning when used

* Add migration guide for the deprecated `analytics` property

* Update packages/integrations/vercel/README.md

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>

* Update README.md

* Fix external dependency issue

* Simplify plugin and reduce scope

* Update .changeset/sixty-teachers-tap.md

Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>

* Apply feedback from review

* Move exposeEnv to speed-insights since it's only used there

---------

Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
Co-authored-by: Matthew Phillips <matthew@skypack.dev>
Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>

1 files changed, 30 insertions, 0 deletions

diff --git a/packages/integrations/vercel/src/lib/web-analytics.ts b/packages/integrations/vercel/src/lib/web-analytics.ts
new file mode 100644
index 000000000..d6ee4d78d
--- /dev/null
+++ b/packages/integrations/vercel/src/lib/web-analytics.ts
@@ -0,0 +1,30 @@
+export type VercelWebAnalyticsConfig = {
+	enabled: boolean;
+};
+
+export async function getInjectableWebAnalyticsContent({
+	mode,
+}: {
+	mode: 'development' | 'production';
+}) {
+	const base = `window.va = window.va || function () { (window.vaq = window.vaq || []).push(arguments); };`;
+
+	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);
+	`;
+}