Add dotenv exec in vitest config after rename of local .env to .env.development associated with e2e mock third-party service container work

Author: webstackdev

_TODO.md

@@ -1,5 +1,9 @@
 # TODO
 
+## Performance
+
+Implement mitigations in test/e2e/specs/07-performance/PERFORMANCE.md
+
 ## Analytics
 
 Vercel Analytics
@@ -15,16 +19,9 @@ See note in src/components/scripts/sentry/client.ts - "User Feedback - allow use
 
 ## src/pages/api next steps
 
-1. build Supabase-aware fixtures to cover the GDPR endpoints (consent/request/export/verify) end-to-end
-2. add integration-style tests that exercise the DSAR flow using a lightweight fake DB layer.
-3. Do the same for RESEND and the contact endpoint
-4. Where are we uploading files to? We need to implement the Uppy library in ContactForm, but currently nowhere to send the files to
-5. Need to add network failure testing modes to component unit tests where it's possible, but this is related to the above Toast issue.
-
-Components that need full e2e testing implemented:
-
-- CallToAction/Newsletter
-- ContactForm
+run npm run containers:up && npm run containers:wait
+start Supabase via npm run containers:supabase:start
+launch the dev server and Playwright against the mocks.
 
 ## Typing client-side API calls and SSR API endpoints
 

src/components/Social/Shares/client/__tests__/index.spec.ts

@@ -1,7 +1,6 @@
-import { beforeEach, describe, expect, test, vi } from 'vitest'
+import { beforeAll, beforeEach, describe, expect, test, vi } from 'vitest'
 import { experimental_AstroContainer as AstroContainer } from 'astro/container'
 import { TestError } from '@test/errors'
-import SocialShareComponent from '@components/Social/Shares/index.astro'
 import type { SocialShareElement } from '@components/Social/Shares/client/index'
 import type { WebComponentModule } from '@components/scripts/@types/webComponentModule'
 import { executeRender } from '@test/unit/helpers/litRuntime'
@@ -20,9 +19,16 @@ type ComponentProps = {
   socialNetworks?: ('twitter' | 'linkedin' | 'bluesky' | 'reddit' | 'mastodon')[]
 }
 
+let SocialShareComponent: typeof import('@components/Social/Shares/index.astro').default
+
 describe('SocialShareElement web component', () => {
   let container: AstroContainer
 
+  beforeAll(async () => {
+    const module = await import('@components/Social/Shares/index.astro')
+    SocialShareComponent = module.default
+  })
+
   beforeEach(async () => {
     container = await AstroContainer.create()
   })
@@ -37,6 +43,10 @@ describe('SocialShareElement web component', () => {
     props: ComponentProps = defaultProps,
     assertion: (_context: RenderContext) => Promise<void> | void,
   ) => {
+    if (!SocialShareComponent) {
+      throw new TestError('SocialShareComponent failed to load')
+    }
+
     await executeRender<SocialShareModule>({
       container,
       component: SocialShareComponent,

vitest.config.ts

@@ -1,8 +1,11 @@
 /// <reference types="vitest" />
 import { getViteConfig } from 'astro/config'
+import { config as loadEnv } from 'dotenv'
 import { resolve } from 'path'
 import { getSiteUrl } from './src/lib/config'
 
+loadEnv({ path: resolve(process.cwd(), '.env.development'), override: false })
+
 /**
  * Needed to be able to skip running integrations in astro.config.ts
  * during unit tests