[Website] IDE-like PHP playground

.eslintrc.json

@@ -29,11 +29,13 @@
 				"no-inner-declarations": 0,
 				"no-use-before-define": "off",
 				"react/prop-types": 0,
+				"react-hooks/exhaustive-deps": 0,
 				"no-console": 1,
 				"no-empty": 0,
 				"no-async-promise-executor": 0,
 				"no-constant-condition": 0,
 				"no-nested-ternary": 0,
+				"jsx-a11y/accessible-emoji": 0,
 				"jsx-a11y/click-events-have-key-events": 0,
 				"jsx-a11y/no-static-element-interactions": 0,
 				"comment-length/limit-single-line-comments": [

package.json

@@ -66,6 +66,18 @@
 	},
 	"private": true,
 	"dependencies": {
+		"@codemirror/autocomplete": "6.19.0",
+		"@codemirror/commands": "6.8.1",
+		"@codemirror/lang-css": "6.3.1",
+		"@codemirror/lang-html": "6.4.10",
+		"@codemirror/lang-javascript": "6.2.4",
+		"@codemirror/lang-json": "6.0.2",
+		"@codemirror/lang-markdown": "6.3.4",
+		"@codemirror/lang-php": "6.0.2",
+		"@codemirror/language": "6.11.3",
+		"@codemirror/search": "6.5.11",
+		"@codemirror/state": "6.5.2",
+		"@codemirror/view": "6.38.3",
 		"@preact/signals-react": "1.3.6",
 		"@reduxjs/toolkit": "2.6.1",
 		"@types/xml2js": "0.4.14",
@@ -87,6 +99,7 @@
 		"react-dom": "18.3.1",
 		"react-hook-form": "7.53.0",
 		"react-redux": "8.1.3",
+		"react-resizable-panels": "3.0.6",
 		"react-transition-group": "4.4.5",
 		"sha.js": "2.4.11",
 		"tmp-promise": "3.0.3",
@@ -183,6 +196,7 @@
 		"react": "18.3.1",
 		"react-dom": "18.3.1",
 		"typescript": "5.4.5",
+		"@playwright/test": "1.47.1",
 		"ws": "^8.18.0"
 	},
 	"workspaces": [

packages/playground/build-config.ts

@@ -3,3 +3,6 @@ export const remoteDevServerPort = 4400;
 
 export const websiteDevServerHost = '127.0.0.1';
 export const websiteDevServerPort = 5400;
+
+export const websiteExtrasDevServerHost = '127.0.0.1';
+export const websiteExtrasDevServerPort = 6400;

packages/playground/components/e2e/playwright.config.ts

@@ -0,0 +1,56 @@
+import {
+	defineConfig,
+	devices,
+	type PlaywrightTestConfig,
+} from '@playwright/test';
+
+const baseURL =
+	process.env.PLAYWRIGHT_TEST_BASE_URL || 'http://127.0.0.1:5174/';
+
+export const playwrightConfig: PlaywrightTestConfig = {
+	testDir: './tests',
+	/* Run tests in files in parallel */
+	fullyParallel: false,
+	/* Fail the build on CI if you accidentally left test.only in the source code. */
+	forbidOnly: !!process.env.CI,
+	retries: 3,
+	workers: 3,
+
+	/* Reporter to use. See https://playwright.dev/docs/test-reporters */
+	reporter: [['html'], ['list', { printSteps: true }]],
+	/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+	use: {
+		/* Base URL to use in actions like `await page.goto('/')`. */
+		baseURL,
+		/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+		trace: 'on-first-retry',
+		actionTimeout: 120000,
+		navigationTimeout: 120000,
+	},
+
+	timeout: 300000,
+	expect: { timeout: 60000 },
+
+	/* Configure projects for major browsers */
+	projects: [
+		{
+			name: 'chromium',
+			use: {
+				...devices['Desktop Chrome'],
+			},
+		},
+	],
+
+	/* Run your local dev server before starting the tests */
+	webServer: {
+		command:
+			'npx nx run playground-components:dev -- --host 127.0.0.1 --port 5174',
+		url: 'http://127.0.0.1:5174/',
+		reuseExistingServer: !process.env.CI,
+	},
+};
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ */
+export default defineConfig(playwrightConfig);