refactor(alpinejs): Fix test execution and correct minor mistakes in test files

package.json

@@ -35,7 +35,9 @@
     "test:smoke:docs": "turbo run build --filter=docs",
     "test:check-examples": "node ./scripts/smoke/check.js",
     "test:vite-ci": "cd packages/astro && pnpm run test:unit && pnpm run test:integration",
-    "test:e2e": "cd packages/astro && pnpm playwright install firefox && pnpm run test:e2e",
+    "test:e2e": "pnpm run test:e2e:astro && pnpm run test:e2e:alpinejs",
+    "test:e2e:astro": "cd packages/astro && pnpm playwright install firefox && pnpm run test:e2e",
+    "test:e2e:alpinejs": "cd packages/integrations/alpinejs && pnpm run test:e2e",
     "test:e2e:match": "cd packages/astro && pnpm playwright install firefox && pnpm run test:e2e:match",
     "test:e2e:hosts": "turbo run test:hosted",
     "typecheck:tests": "pnpm -r run --sequential typecheck:tests",

packages/integrations/alpinejs/playwright.config.js

@@ -0,0 +1,26 @@
+import { defineConfig } from '@playwright/test';
+
+// NOTE: Sometimes, tests fail with `TypeError: process.stdout.clearLine is not a function`
+// for some reason. This comes from Vite, and is conditionally called based on `isTTY`.
+// We set it to false here to skip this odd behavior.
+process.stdout.isTTY = false;
+
+export default defineConfig({
+	testMatch: 'test/*.test.ts',
+	timeout: 40_000,
+	expect: {
+		timeout: 6_000,
+	},
+	forbidOnly: !!process.env.CI,
+	retries: process.env.CI ? 2 : 0,
+	workers: process.env.CI ? 1 : undefined,
+	projects: [
+		{
+			name: 'Chrome Stable',
+			use: {
+				browserName: 'chromium',
+				channel: 'chrome',
+			},
+		},
+	],
+});

packages/integrations/alpinejs/test/basics.test.ts

@@ -8,6 +8,6 @@ test.describe('Basics', () => {
 		await page.goto(astro.resolveUrl('/'));
 
 		const el = page.locator('#foo');
-		expect(await el.textContent()).toBe('bar');
+		await expect(el).toHaveText('bar');
 	});
 });

packages/integrations/alpinejs/test/directive.test.ts

@@ -1,13 +1,13 @@
 import { expect } from '@playwright/test';
 import { prepareTestFactory } from './test-utils.js';
 
-const { test } = prepareTestFactory({ root: './fixtures/basics/' });
+const { test } = prepareTestFactory({ root: './fixtures/directive/' });
 
-test.describe('Basics', () => {
+test.describe('Directive', () => {
 	test('Alpine is working', async ({ page, astro }) => {
 		await page.goto(astro.resolveUrl('/'));
 
 		const el = page.locator('#foo');
-		expect(await el.textContent()).toBe('bar');
+		await expect(el).toHaveText('bar');
 	});
 });

packages/integrations/alpinejs/test/plugin-script-import.test.ts

@@ -8,6 +8,6 @@ test.describe('Plugin Script Import', () => {
 		await page.goto(astro.resolveUrl('/'));
 
 		const el = page.locator('#foo');
-		expect(await el.getAttribute('hidden')).toBe('');
+		await expect(el).toHaveAttribute('hidden', '');
 	});
 });

packages/integrations/alpinejs/test/test-utils.ts

@@ -14,7 +14,7 @@ const testFiles = await fs.readdir(new URL('.', import.meta.url));
 const testFileToPort = new Map();
 for (let i = 0; i < testFiles.length; i++) {
 	const file = testFiles[i];
-	if (file.endsWith('.test.js')) {
+	if (file.endsWith('.test.ts')) {
 		testFileToPort.set(file.slice(0, -8), 4000 + i);
 	}
 }