playwright: make all tests executable in electron

Contributed on behalf of STMicroelectronics

Signed-off-by: Olaf Lessenich <olessenich@eclipsesource.com>

.github/workflows/playwright.yml

@@ -60,4 +60,4 @@ jobs:
       - name: Test (playwright)
         uses: GabrielBB/xvfb-action@v1
         with:
-          run: yarn test:playwright
+          run: yarn --cwd examples/playwright ui-tests-ci 

examples/playwright/configs/playwright.ci.config.ts

@@ -20,7 +20,8 @@ import baseConfig from './playwright.config';
 const ciConfig: PlaywrightTestConfig = {
     ...baseConfig,
     workers: 1,
-    retries: 1
+    retries: 1,
+    reporter: [['list'], ['allure-playwright'], ['github']]
 };
 
 export default ciConfig;

examples/playwright/package.json

@@ -20,7 +20,8 @@
     "lint:fix": "eslint -c ./.eslintrc.js --ext .ts ./src --fix",
     "playwright:install": "playwright install chromium",
     "ui-tests": "yarn build && playwright test --config=./configs/playwright.config.ts",
-    "ui-tests-ci": "yarn build && playwright test --config=./configs/playwright.ci.config.ts",
+    "ui-tests-electron": "yarn build && USE_ELECTRON=true playwright test --config=./configs/playwright.config.ts",
+    "ui-tests-ci": "yarn build && playwright test --config=./configs/playwright.ci.config.ts && USE_ELECTRON=true playwright test --config=./configs/playwright.ci.config.ts ",
     "ui-tests-headful": "yarn build && playwright test --config=./configs/playwright.headful.config.ts",
     "ui-tests-report-generate": "allure generate ./allure-results --clean -o allure-results/allure-report",
     "ui-tests-report": "yarn ui-tests-report-generate && allure open allure-results/allure-report"

examples/playwright/src/tests/theia-app.test.ts

@@ -16,11 +16,33 @@
 
 import { expect, test } from '@playwright/test';
 import { TheiaAppLoader } from '../theia-app-loader';
+import { TheiaApp } from '../theia-app';
 
 test.describe('Theia Application', () => {
+    let app: TheiaApp;
+
+    test.afterAll(async () => {
+        await app.page.close();
+    });
 
     test('should load and should show main content panel', async ({ playwright, browser }) => {
-        const app = await TheiaAppLoader.load({ playwright, browser });
+        let args;
+        if (process.env.USE_ELECTRON === 'true') {
+            args = {
+                playwright: playwright,
+                browser: browser,
+                useElectron: {
+                    electronAppPath: '../electron',
+                    pluginsPath: '../../plugins'
+                }
+            };
+        } else {
+            args = {
+                playwright: playwright,
+                browser: browser
+            };
+        }
+        app = await TheiaAppLoader.load(args);
         expect(await app.isMainContentPanelVisible()).toBe(true);
     });
 

examples/playwright/src/tests/theia-explorer-view.test.ts

@@ -17,6 +17,7 @@
 import { expect, test } from '@playwright/test';
 import { TheiaAppLoader } from '../theia-app-loader';
 import { TheiaApp } from '../theia-app';
+import { PreferenceIds, TheiaPreferenceView } from '../theia-preference-view';
 import { DOT_FILES_FILTER, TheiaExplorerView } from '../theia-explorer-view';
 import { TheiaWorkspace } from '../theia-workspace';
 
@@ -26,10 +27,36 @@ test.describe('Theia Explorer View', () => {
 
     let app: TheiaApp;
     let explorer: TheiaExplorerView;
+    let isElectron: boolean;
 
     test.beforeAll(async ({ playwright, browser }) => {
+        isElectron = process.env.USE_ELECTRON === 'true';
         const ws = new TheiaWorkspace(['src/tests/resources/sample-files1']);
-        app = await TheiaAppLoader.load({ playwright, browser }, ws);
+        let args;
+        if (isElectron) {
+            args = {
+                playwright: playwright,
+                browser: browser,
+                useElectron: {
+                    electronAppPath: '../electron',
+                    pluginsPath: '../../plugins'
+                }
+            };
+        } else {
+            args = {
+                playwright: playwright,
+                browser: browser
+            };
+        }
+        app = await TheiaAppLoader.load(args, ws);
+
+        if (isElectron) {
+            // set trash preference to off
+            const preferenceView = await app.openPreferences(TheiaPreferenceView);
+            await preferenceView.setBooleanPreferenceById(PreferenceIds.Files.EnableTrash, false);
+            await preferenceView.close();
+        }
+
         explorer = await app.openView(TheiaExplorerView);
         await explorer.waitForVisibleFileNodes();
     });
@@ -137,7 +164,9 @@ test.describe('Theia Explorer View', () => {
         const menuItems = await menu.visibleMenuItems();
         expect(menuItems).toContain('Open');
         expect(menuItems).toContain('Delete');
-        expect(menuItems).toContain('Download');
+        if (!isElectron) {
+            expect(menuItems).toContain('Download');
+        }
 
         await menu.close();
         expect(await menu.isOpen()).toBe(false);
@@ -192,4 +221,11 @@ test.describe('Theia Explorer View', () => {
         expect(updatedFileStatElements.length).toBe(fileStatElements.length - 1);
     });
 
+    test('open "sample.txt" via the context menu', async () => {
+        expect(await explorer.existsFileNode('sample.txt')).toBe(true);
+        await explorer.clickContextMenuItem('sample.txt', ['Open']);
+        const span = await app.page.waitForSelector('span:has-text("content line 2")');
+        expect(await span.isVisible()).toBe(true);
+    });
+
 });

examples/playwright/src/tests/theia-main-menu.test.ts

@@ -17,6 +17,7 @@
 import { expect, test } from '@playwright/test';
 import { TheiaApp } from '../theia-app';
 import { TheiaAppLoader } from '../theia-app-loader';
+import { TheiaAboutDialog } from '../theia-about-dialog';
 import { TheiaMenuBar } from '../theia-main-menu';
 import { OSUtil } from '../util';
 
@@ -26,9 +27,27 @@ test.describe('Theia Main Menu', () => {
 
     let app: TheiaApp;
     let menuBar: TheiaMenuBar;
+    let isElectron: boolean;
 
     test.beforeAll(async ({ playwright, browser }) => {
-        app = await TheiaAppLoader.load({ playwright, browser });
+        isElectron = process.env.USE_ELECTRON === 'true';
+        let args;
+        if (isElectron) {
+            args = {
+                playwright: playwright,
+                browser: browser,
+                useElectron: {
+                    electronAppPath: '../electron',
+                    pluginsPath: '../../plugins'
+                }
+            };
+        } else {
+            args = {
+                playwright: playwright,
+                browser: browser
+            };
+        }
+        app = await TheiaAppLoader.load(args);
         menuBar = app.menuBar;
     });
 
@@ -64,7 +83,7 @@ test.describe('Theia Main Menu', () => {
         expect(label).toBe('New Text File');
 
         const shortCut = await menuItem?.shortCut();
-        expect(shortCut).toBe(OSUtil.isMacOS ? '⌥ N' : 'Alt+N');
+        expect(shortCut).toBe(OSUtil.isMacOS ? '⌥ N' : isElectron ? 'Ctrl+N' : 'Alt+N');
 
         const hasSubmenu = await menuItem?.hasSubmenu();
         expect(hasSubmenu).toBe(false);
@@ -93,4 +112,21 @@ test.describe('Theia Main Menu', () => {
         expect(await mainMenu.isOpen()).toBe(false);
     });
 
+    test('open about dialog using menu', async () => {
+        await (await menuBar.openMenu('Help')).clickMenuItem('About');
+        const aboutDialog = new TheiaAboutDialog(app);
+        expect(await aboutDialog.isVisible()).toBe(true);
+        await aboutDialog.page.getByRole('button', { name: 'OK' }).click();
+        expect(await aboutDialog.isVisible()).toBe(false);
+    });
+
+    test('open file via file menu and cancel', async () => {
+        const openFileEntry = isElectron ? 'Open File...' : 'Open...';
+        await (await menuBar.openMenu('File')).clickMenuItem(openFileEntry);
+        const fileDialog = await app.page.waitForSelector('div[class="dialogBlock"]');
+        expect(await fileDialog.isVisible()).toBe(true);
+        await app.page.locator('#theia-dialog-shell').getByRole('button', { name: 'Cancel' }).click();
+        expect(await fileDialog.isVisible()).toBe(false);
+    });
+
 });