@aws/mynah-ui 4.35.4 → 4.35.6

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@aws/mynah-ui",
     "displayName": "AWS Mynah UI",
-    "version": "4.35.4",
+    "version": "4.35.6",
     "description": "AWS Toolkit VSCode and Intellij IDE Extension Mynah UI",
     "publisher": "Amazon Web Services",
     "license": "Apache License 2.0",
@@ -28,14 +28,20 @@
         "format:check": "npx prettier --check .",
         "format:write": "npx prettier --write .",
         "docker:clean": "docker rm -f mynah-ui-e2e-container || true",
-        "docker:build": "docker build -t mynah-ui-e2e -f Dockerfile .",
-        "docker:run": "docker run --name mynah-ui-e2e-container mynah-ui-e2e",
+        "docker:build": "node scripts/docker-build.js",
+        "docker:run": "docker run --name mynah-ui-e2e-container -e WEBKIT_FORCE_COMPLEX_TEXT=0 -e WEBKIT_DISABLE_COMPOSITING_MODE=1 mynah-ui-e2e",
         "docker:run:chromium": "docker run -e BROWSER=chromium --name mynah-ui-e2e-container mynah-ui-e2e",
-        "docker:run:webkit": "docker run -e BROWSER=webkit --name mynah-ui-e2e-container mynah-ui-e2e",
+        "docker:run:webkit": "docker run -e BROWSER=webkit -e WEBKIT_FORCE_COMPLEX_TEXT=0 -e WEBKIT_DISABLE_COMPOSITING_MODE=1 --name mynah-ui-e2e-container mynah-ui-e2e",
         "docker:extract": "docker cp mynah-ui-e2e-container:/app/ui-tests/__results__ ./ui-tests/ && docker cp mynah-ui-e2e-container:/app/ui-tests/__snapshots__ ./ui-tests/__results__/__snapshots__",
+        "playwright:setup": "node scripts/setup-playwright.js",
+        "playwright:version": "node scripts/get-playwright-version.js",
+        "playwright:pre-test": "node scripts/pre-test-setup.js",
         "tests:e2e": "npm run docker:clean && npm run docker:build && npm run docker:run",
         "tests:e2e:chromium": "npm run docker:clean && npm run docker:build && npm run docker:run:chromium",
         "tests:e2e:webkit": "npm run docker:clean && npm run docker:build && npm run docker:run:webkit",
+        "tests:e2e:webkit:local": "npm run playwright:pre-test && cd ui-tests && npm run e2e:webkit",
+        "tests:webkit:check": "node scripts/test-webkit.js",
+        "tests:e2e:local": "npm run playwright:pre-test && cd ui-tests && npm run e2e",
         "tests:e2e:trace": "cd ./ui-tests && npm run trace",
         "tests:unit": "jest --collect-coverage",
         "api-docs": "npx typedoc src/main.ts --out ./api-docs",
@@ -96,7 +102,7 @@
         "ts-loader": "^9.4.4",
         "ts-node": "^10.9.1",
         "typedoc": "^0.25.13",
-        "typescript": "^5.0.4",
+        "typescript": "^5.1.6",
         "webpack": "5.94.0",
         "webpack-cli": "4.7.2"
     }

package/scripts/docker-build.js

@@ -0,0 +1,36 @@
+#!/usr/bin/env node
+
+/**
+ * Script to build Docker image with detected Playwright version
+ */
+
+const { execSync } = require('child_process');
+const { getPlaywrightVersion } = require('./get-playwright-version');
+
+function buildDockerImage() {
+    try {
+        const version = getPlaywrightVersion();
+        console.log(`Building Docker image with Playwright version: ${version}`);
+
+        // Use the detected version or fallback to latest
+        // Add 'v' prefix for version numbers, but not for 'latest'
+        const dockerVersion = version === 'latest' ? 'latest' : `v${version}`;
+
+        const buildCommand = `docker build --build-arg PLAYWRIGHT_VERSION=${dockerVersion} -t mynah-ui-e2e .`;
+
+        console.log(`Executing: ${buildCommand}`);
+        execSync(buildCommand, { stdio: 'inherit' });
+
+        console.log('Docker image built successfully!');
+    } catch (error) {
+        console.error('Error building Docker image:', error.message);
+        process.exit(1);
+    }
+}
+
+// If called directly, run the build
+if (require.main === module) {
+    buildDockerImage();
+}
+
+module.exports = { buildDockerImage };

package/scripts/docker-health-check.js

@@ -0,0 +1,45 @@
+#!/usr/bin/env node
+
+/**
+ * Docker health check script to verify browser installations
+ */
+
+const { execSync } = require('child_process');
+
+function healthCheck() {
+    try {
+        console.log('=== Docker Health Check ===');
+
+        // Check if we're in Docker
+        console.log('Environment: Docker Container');
+
+        // Check Playwright installation
+        console.log('\n1. Checking Playwright...');
+        execSync('npx playwright --version', { stdio: 'inherit' });
+
+        // Check browser installations
+        console.log('\n2. Checking browsers...');
+        execSync('npx playwright install --dry-run', { stdio: 'inherit' });
+
+        // Test WebKit specifically
+        console.log('\n3. Testing WebKit launch...');
+        execSync('npx playwright test --list --project=webkit | head -5', {
+            stdio: 'inherit',
+            shell: true,
+        });
+
+        console.log('\n=== Health Check Passed ===');
+        return true;
+    } catch (error) {
+        console.error('Health check failed:', error.message);
+        return false;
+    }
+}
+
+// If called directly, run the health check
+if (require.main === module) {
+    const success = healthCheck();
+    process.exit(success ? 0 : 1);
+}
+
+module.exports = { healthCheck };

package/scripts/get-playwright-version.js

@@ -0,0 +1,62 @@
+#!/usr/bin/env node
+
+/**
+ * Script to detect and return the appropriate Playwright version
+ * Priority: local installation > package.json > latest
+ */
+
+const fs = require('fs');
+const path = require('path');
+const { execSync } = require('child_process');
+
+function getPlaywrightVersion() {
+    try {
+        // 1. Try to get locally installed version
+        try {
+            const localVersion = execSync('playwright --version', { encoding: 'utf8', stdio: 'pipe' });
+            const versionMatch = localVersion.match(/Version (\d+\.\d+\.\d+)/);
+            if (versionMatch) {
+                console.log(`Found local Playwright version: ${versionMatch[1]}`);
+                return versionMatch[1];
+            }
+        } catch (error) {
+            console.log('No local Playwright installation found');
+        }
+
+        // 2. Try to get version from ui-tests package.json
+        const uiTestsPackagePath = path.join(__dirname, '../ui-tests/package.json');
+        if (fs.existsSync(uiTestsPackagePath)) {
+            const packageJson = JSON.parse(fs.readFileSync(uiTestsPackagePath, 'utf8'));
+
+            // Check both playwright and @playwright/test dependencies
+            const playwrightVersion = packageJson.devDependencies?.playwright || packageJson.dependencies?.playwright;
+            const playwrightTestVersion =
+                packageJson.devDependencies?.['@playwright/test'] || packageJson.dependencies?.['@playwright/test'];
+
+            // Prefer @playwright/test version if available, otherwise use playwright
+            const version = playwrightTestVersion || playwrightVersion;
+
+            if (version) {
+                // Remove ^ or ~ prefix and get clean version
+                const cleanVersion = version.replace(/[\^~]/, '');
+                const sourcePackage = playwrightTestVersion ? '@playwright/test' : 'playwright';
+                console.log(`Found ${sourcePackage} version in ui-tests package.json: ${cleanVersion}`);
+                return cleanVersion;
+            }
+        }
+
+        // 3. Fallback to latest
+        console.log('No specific version found, using latest');
+        return 'latest';
+    } catch (error) {
+        console.error('Error detecting Playwright version:', error.message);
+        return 'latest';
+    }
+}
+
+// If called directly, output the version
+if (require.main === module) {
+    console.log(getPlaywrightVersion());
+}
+
+module.exports = { getPlaywrightVersion };

package/scripts/pre-test-setup.js

@@ -0,0 +1,80 @@
+#!/usr/bin/env node
+
+/**
+ * Pre-test setup script that ensures Playwright is properly configured
+ * This runs before tests to guarantee version consistency
+ */
+
+const fs = require('fs');
+const path = require('path');
+const { execSync } = require('child_process');
+const { getPlaywrightVersion } = require('./get-playwright-version');
+
+function checkPlaywrightInstallation() {
+    const uiTestsPath = path.join(__dirname, '../ui-tests');
+    const nodeModulesPath = path.join(uiTestsPath, 'node_modules');
+    const playwrightPath = path.join(nodeModulesPath, '@playwright');
+
+    return fs.existsSync(playwrightPath);
+}
+
+function getInstalledPlaywrightVersion() {
+    try {
+        const uiTestsPath = path.join(__dirname, '../ui-tests');
+        const packageLockPath = path.join(uiTestsPath, 'package-lock.json');
+
+        if (fs.existsSync(packageLockPath)) {
+            const packageLock = JSON.parse(fs.readFileSync(packageLockPath, 'utf8'));
+            return (
+                packageLock.packages?.['node_modules/@playwright/test']?.version ||
+                packageLock.packages?.['node_modules/playwright']?.version ||
+                null
+            );
+        }
+        return null;
+    } catch (error) {
+        console.warn('Could not read package-lock.json:', error.message);
+        return null;
+    }
+}
+
+function preTestSetup() {
+    console.log('🔍 Running pre-test setup...');
+
+    try {
+        const expectedVersion = getPlaywrightVersion();
+        console.log(`📋 Expected Playwright version: ${expectedVersion}`);
+
+        const isInstalled = checkPlaywrightInstallation();
+        const installedVersion = getInstalledPlaywrightVersion();
+
+        console.log(`📦 Playwright installed: ${isInstalled}`);
+        console.log(`📦 Installed version: ${installedVersion || 'unknown'}`);
+
+        // Check if we need to install/update
+        const needsSetup = !isInstalled || (expectedVersion !== 'latest' && installedVersion !== expectedVersion);
+
+        if (needsSetup) {
+            console.log('🔧 Setting up Playwright...');
+
+            // Run setup with target directory
+            const { setupPlaywright } = require('./setup-playwright');
+            const uiTestsPath = path.join(__dirname, '../ui-tests');
+            setupPlaywright(uiTestsPath);
+        } else {
+            console.log('✅ Playwright is already properly configured');
+        }
+
+        console.log('🎉 Pre-test setup completed successfully!');
+    } catch (error) {
+        console.error('❌ Pre-test setup failed:', error.message);
+        process.exit(1);
+    }
+}
+
+// If called directly, run the setup
+if (require.main === module) {
+    preTestSetup();
+}
+
+module.exports = { preTestSetup };

package/scripts/setup-playwright.js

@@ -0,0 +1,61 @@
+#!/usr/bin/env node
+
+/**
+ * Script to setup Playwright with version-agnostic approach
+ * This ensures consistent versions across local and Docker environments
+ */
+
+const { execSync } = require('child_process');
+const path = require('path');
+const fs = require('fs');
+const { getPlaywrightVersion } = require('./get-playwright-version');
+
+function setupPlaywright(targetDir = null) {
+    try {
+        const version = getPlaywrightVersion();
+        console.log(`Setting up Playwright version: ${version}`);
+
+        // Determine target directory
+        const uiTestsPath = targetDir || path.join(__dirname, '../ui-tests');
+
+        // Ensure target directory exists
+        if (!fs.existsSync(uiTestsPath)) {
+            throw new Error(`Target directory does not exist: ${uiTestsPath}`);
+        }
+
+        const installCommand =
+            version === 'latest'
+                ? 'npm install @playwright/test@latest playwright@latest --save-dev'
+                : `npm install @playwright/test@${version} playwright@${version} --save-dev`;
+
+        console.log(`Installing Playwright in ${uiTestsPath}...`);
+        execSync(installCommand, {
+            stdio: 'inherit',
+            cwd: uiTestsPath,
+        });
+
+        // Install Playwright browsers with dependencies
+        console.log('Installing Playwright browsers with dependencies...');
+        execSync('npx playwright install --with-deps', {
+            stdio: 'inherit',
+            cwd: uiTestsPath,
+        });
+
+        console.log('Playwright setup completed successfully!');
+        return true;
+    } catch (error) {
+        console.error('Error setting up Playwright:', error.message);
+        throw error; // Re-throw to allow caller to handle
+    }
+}
+
+// If called directly, run the setup
+if (require.main === module) {
+    try {
+        setupPlaywright();
+    } catch (error) {
+        process.exit(1);
+    }
+}
+
+module.exports = { setupPlaywright };

package/scripts/test-webkit.js

@@ -0,0 +1,44 @@
+#!/usr/bin/env node
+
+/**
+ * Script to test WebKit browser availability and functionality
+ */
+
+const { execSync } = require('child_process');
+const path = require('path');
+
+function testWebKit() {
+    try {
+        console.log('Testing WebKit browser availability...');
+
+        const uiTestsPath = path.join(__dirname, '../ui-tests');
+
+        // Check if WebKit is installed
+        console.log('Checking WebKit installation...');
+        execSync('npx playwright install webkit --with-deps', {
+            stdio: 'inherit',
+            cwd: uiTestsPath,
+        });
+
+        // Run a simple WebKit test
+        console.log('Running WebKit test...');
+        execSync('npx playwright test --project=webkit --grep "should render initial data"', {
+            stdio: 'inherit',
+            cwd: uiTestsPath,
+        });
+
+        console.log('WebKit test completed successfully!');
+        return true;
+    } catch (error) {
+        console.error('WebKit test failed:', error.message);
+        return false;
+    }
+}
+
+// If called directly, run the test
+if (require.main === module) {
+    const success = testWebKit();
+    process.exit(success ? 0 : 1);
+}
+
+module.exports = { testWebKit };

package/ui-tests/package.json

@@ -6,12 +6,16 @@
     "scripts": {
         "clean": "rm -rf build dist node_modules __results__",
         "prepare": "webpack --config webpack.config.js --mode development",
-        "e2e": "playwright test --workers=12",
-        "e2e:update": "playwright test --update-snapshots --workers=12",
-        "e2e:chromium": "playwright test --project=chromium --workers=12",
-        "e2e:webkit": "playwright test --project=webkit --workers=12",
-        "e2e:update:chromium": "playwright test --project=chromium --update-snapshots --workers=12",
-        "e2e:update:webkit": "playwright test --project=webkit --update-snapshots --workers=12",
+        "playwright:setup": "node ../scripts/setup-playwright.js",
+        "playwright:version": "node ../scripts/get-playwright-version.js",
+        "playwright:pre-test": "node ../scripts/pre-test-setup.js",
+        "e2e": "npm run playwright:pre-test && playwright test --workers=12",
+        "e2e:update": "npm run playwright:pre-test && playwright test --update-snapshots --workers=12",
+        "e2e:chromium": "npm run playwright:pre-test && playwright test --project=chromium --workers=12",
+        "e2e:webkit": "npm run playwright:pre-test && playwright test --project=webkit --workers=12",
+        "e2e:update:chromium": "npm run playwright:pre-test && playwright test --project=chromium --update-snapshots --workers=12",
+        "e2e:update:webkit": "npm run playwright:pre-test && playwright test --project=webkit --update-snapshots --workers=12",
+        "e2e:quick": "playwright test --workers=12",
         "trace": "playwright show-trace"
     },
     "dependencies": {

package/ui-tests/playwright.config.ts

@@ -24,7 +24,19 @@ export default defineConfig({
     },
   },
   projects: [
-    { name: 'chromium', use: { browserName: 'chromium' } },
+    {
+      name: 'chromium',
+      use: {
+        browserName: 'chromium',
+        launchOptions: {
+          args: [
+            '--disable-features=VizDisplayCompositor',
+            '--disable-dev-shm-usage',
+            '--no-sandbox',
+          ],
+        },
+      }
+    },
     { name: 'webkit', use: { browserName: 'webkit' } },
   ],
   updateSnapshots: updateSnapshots ? 'all' : 'missing',