Upgrade @vercel/style-guide (#110)

* Upgrade @vercel/style-guide

* Run prettier

apps/nextjs/app/api/edge-no-context/route.ts

@@ -12,7 +12,7 @@ async function handler(request: Request) {
     },
     {
       request,
-    },
+    }
   );
 
   return new Response('OK');

apps/nextjs/components/withAnalytics.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 
 export function withAnalytics<P extends Omit<AnalyticsProps, 'mode'>>(
   Component: React.ComponentType,
-  props?: P,
+  props?: P
 ) {
   function WithAnalytics(props?: P) {
     return (

apps/nextjs/e2e/development/pageview.spec.ts

@@ -9,6 +9,8 @@ test.describe('pageview', () => {
     page.on('console', (msg) => {
       const message = msg.text();
 
+      console.log(message);
+
       if (
         message.includes('[Vercel Web Analytics]') ||
         message.includes('[Vercel Analytics]')

apps/nextjs/middleware.ts

@@ -7,7 +7,7 @@ export async function middleware(request: NextRequest, event: NextFetchEvent) {
     track('Redirect', {
       path: request.nextUrl.pathname,
       type: 'waitUntil',
-    }),
+    })
   );
   return NextResponse.redirect(new URL('/server-actions', request.url));
 }

apps/nextjs/pages/api/test.ts

@@ -9,7 +9,7 @@ async function handler(request: NextRequest, event: NextFetchEvent) {
     track('Pages Api Route', {
       runtime: 'edge',
       router: 'pages',
-    }),
+    })
   );
 
   return new Response('OK');

package.json

@@ -13,7 +13,7 @@
     "lint-staged": "^13.2.2"
   },
   "devDependencies": {
-    "@vercel/style-guide": "^4.0.2",
+    "@vercel/style-guide": "^5.0.1",
     "husky": "^8.0.3",
     "prettier": "2.8.8",
     "typescript": "^5.1.6"

packages/eslint-config/package.json

@@ -4,10 +4,10 @@
   "private": true,
   "main": "index.js",
   "dependencies": {
-    "@next/eslint-plugin-next": "13.4.7",
-    "@vercel/style-guide": "4.0.2"
+    "@next/eslint-plugin-next": "13.4.7"
   },
   "devDependencies": {
+    "@vercel/style-guide": "5.0.1",
     "eslint": "8.43.0",
     "prettier": "2.8.8",
     "typescript": "5.1.3"

packages/web/src/generic.test.ts

@@ -15,7 +15,7 @@ describe('inject', () => {
       }
 
       expect(script.src).toEqual(
-        'https://va.vercel-scripts.com/v1/script.debug.js',
+        'https://va.vercel-scripts.com/v1/script.debug.js'
       );
       expect(script).toHaveAttribute('defer');
     });
@@ -95,10 +95,10 @@ describe('track custom events', () => {
         track('custom event', {
           string: 'string',
           number: 1,
-          // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+          // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- This is intentional
           nested: {
             object: '',
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any -- This is intentional
           } as any,
         });
 
@@ -125,7 +125,7 @@ describe('track custom events', () => {
       inject({
         mode: 'development',
       });
-      // eslint-disable-next-line @typescript-eslint/no-empty-function
+      // eslint-disable-next-line @typescript-eslint/no-empty-function -- This is intentional
       jest.spyOn(global.console, 'error').mockImplementation(() => {});
     });
 
@@ -171,14 +171,14 @@ describe('track custom events', () => {
         track('custom event', {
           string: 'string',
           number: 1,
-          // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+          // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- This is intentional
           nested: {
             object: '',
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any -- This is intentional
           } as any,
         });
 
-        // eslint-disable-next-line no-console
+        // eslint-disable-next-line no-console -- Logging to console is intentional
         expect(console.error).toHaveBeenCalledTimes(1);
       });
     });

packages/web/src/generic.ts

@@ -22,7 +22,7 @@ import {
 function inject(
   props: AnalyticsProps = {
     debug: true,
-  },
+  }
 ): void {
   if (!isBrowser()) return;
 
@@ -51,9 +51,9 @@ function inject(
       ? 'Please check if any ad blockers are enabled and try again.'
       : 'Be sure to enable Web Analytics for your project and deploy again. See https://vercel.com/docs/analytics/quickstart for more information.';
 
-    // eslint-disable-next-line no-console
+    // eslint-disable-next-line no-console -- Logging to console is intentional
     console.log(
-      `[Vercel Web Analytics] Failed to load script from ${src}. ${errorMessage}`,
+      `[Vercel Web Analytics] Failed to load script from ${src}. ${errorMessage}`
     );
   };
 
@@ -72,14 +72,14 @@ function inject(
  */
 function track(
   name: string,
-  properties?: Record<string, AllowedPropertyValues>,
+  properties?: Record<string, AllowedPropertyValues>
 ): void {
   if (!isBrowser()) {
     const msg =
       '[Vercel Web Analytics] Please import `track` from `@vercel/analytics/server` when using this function in a server environment';
 
     if (isProduction()) {
-      // eslint-disable-next-line no-console
+      // eslint-disable-next-line no-console -- Show warning in production
       console.warn(msg);
     } else {
       throw new Error(msg);
@@ -104,7 +104,7 @@ function track(
     });
   } catch (err) {
     if (err instanceof Error && isDevelopment()) {
-      // eslint-disable-next-line no-console
+      // eslint-disable-next-line no-console -- Logging to console is intentional
       console.error(err);
     }
   }
@@ -113,7 +113,7 @@ function track(
 export { inject, track };
 export type { AnalyticsProps };
 
-// eslint-disable-next-line import/no-default-export
+// eslint-disable-next-line import/no-default-export -- Default export is intentional
 export default {
   inject,
   track,

packages/web/src/react.test.tsx

@@ -3,25 +3,25 @@ import { cleanup, render } from '@testing-library/react';
 import { Analytics, track } from './react';
 
 describe('<Analytics />', () => {
-  afterEach(() => cleanup());
+  afterEach(() => {
+    cleanup();
+  });
 
   describe('in development mode', () => {
     it('should add the script tag correctly', () => {
       render(<Analytics mode="development" />);
 
-      // eslint-disable-next-line testing-library/no-node-access
       const scripts = document.getElementsByTagName('script');
       expect(scripts).toHaveLength(1);
 
-      // eslint-disable-next-line testing-library/no-node-access
       const script = document.head.querySelector('script');
 
       if (!script) {
         throw new Error('Could not find script tag');
       }
 
       expect(script.src).toEqual(
-        'https://va.vercel-scripts.com/v1/script.debug.js',
+        'https://va.vercel-scripts.com/v1/script.debug.js'
       );
       expect(script).toHaveAttribute('defer');
     });
@@ -31,11 +31,9 @@ describe('<Analytics />', () => {
     it('should add the script tag correctly', () => {
       render(<Analytics mode="production" />);
 
-      // eslint-disable-next-line testing-library/no-node-access
       const scripts = document.getElementsByTagName('script');
       expect(scripts).toHaveLength(1);
 
-      // eslint-disable-next-line testing-library/no-node-access
       const script = document.head.querySelector('script');
 
       if (!script) {
@@ -101,10 +99,10 @@ describe('<Analytics />', () => {
         track('custom event', {
           string: 'string',
           number: 1,
-          // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+          // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment -- Intentional to trigger error
           nested: {
             object: '',
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any -- Allow
           } as any,
         });
 

packages/web/src/server/index.ts

@@ -1,5 +1,4 @@
-// eslint-disable-next-line eslint-comments/disable-enable-pair
-/* eslint-disable no-console */
+/* eslint-disable no-console -- Allow loggin on the server */
 import 'server-only';
 import type { AllowedPropertyValues } from '../types';
 import { isProduction, parseProperties } from '../utils';
@@ -37,7 +36,7 @@ const symbol = Symbol.for('@vercel/request-context');
 export async function track(
   eventName: string,
   properties?: Record<string, AllowedPropertyValues>,
-  context?: Context,
+  context?: Context
 ): Promise<void> {
   const props = parseProperties(properties, {
     strip: isProduction(),
@@ -46,13 +45,13 @@ export async function track(
   if (!ENDPOINT) {
     if (isProduction()) {
       console.log(
-        `[Vercel Web Analytics] Can't find VERCEL_URL in environment variables.`,
+        `[Vercel Web Analytics] Can't find VERCEL_URL in environment variables.`
       );
     } else if (!DISABLE_LOGS) {
       console.log(
         `[Vercel Web Analytics] Track "${eventName}" ${
           props ? `with data ${JSON.stringify(props)}` : ''
-        }`,
+        }`
       );
     }
     return;
@@ -99,7 +98,7 @@ export async function track(
 
     if (!hasHeaders) {
       throw new Error(
-        'No session context found. Pass `request` or `headers` to the `track` function.',
+        'No session context found. Pass `request` or `headers` to the `track` function.'
       );
     }
 

packages/web/src/utils.ts

@@ -40,7 +40,7 @@ export function isDevelopment(): boolean {
 
 function removeKey(
   key: string,
-  { [key]: _, ...rest },
+  { [key]: _, ...rest }
 ): Record<string, unknown> {
   return rest;
 }
@@ -49,7 +49,7 @@ export function parseProperties(
   properties: Record<string, unknown> | undefined,
   options: {
     strip?: boolean;
-  },
+  }
 ): Error | Record<string, AllowedPropertyValues> | undefined {
   if (!properties) return undefined;
   let props = properties;
@@ -67,8 +67,8 @@ export function parseProperties(
   if (errorProperties.length > 0 && !options.strip) {
     throw Error(
       `The following properties are not valid: ${errorProperties.join(
-        ', ',
-      )}. Only strings, numbers, booleans, and null are allowed.`,
+        ', '
+      )}. Only strings, numbers, booleans, and null are allowed.`
     );
   }
   return props as Record<string, AllowedPropertyValues>;