Test: Added .env toggles for local testing and screenshot directory by MaksRomanchuk · Pull Request #487 · APIs-guru/graphql-voyager

MaksRomanchuk · 2026-02-23T18:11:56Z

List of changes:

Added support for .env file in non-production environments and added .env.example.
Added environment variable for switching test execution contexts:
- docker (default, execute tests inside docker container)
- local (run tests locally, ignoring snapshot comparison)
Added an optional environment variable to save test screenshots locally.
Split page object model code for easier navigation.

Copilot

Pull request overview

This PR introduces environment-based configuration for test execution and refactors the page object model for better code organization. It enables developers to run tests locally without Docker for easier debugging while maintaining the existing Docker-based CI testing approach. The PR also adds optional screenshot saving functionality for local test development.

Changes:

Added .env file support with TEST_ENV toggle (docker/local) and optional SNAPSHOT_SAVE_DIR configuration
Refactored monolithic PageObjectModel.ts into a modular directory structure under tests/pageObjectModel/
Implemented compareWithSnapshot() method to conditionally skip snapshot comparisons in local mode

Reviewed changes

Copilot reviewed 14 out of 16 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
.env.example	Provides template for environment configuration with TEST_ENV and SNAPSHOT_SAVE_DIR variables
.gitignore	Adds .env and /playwright-screenshots to ignored files
package.json	Adds dotenv ^17.3.1 as dev dependency
package-lock.json	Updates lock file with dotenv dependency
playwright.config.ts	Conditionally configures projects and web servers based on TEST_ENV; loads .env file
tests/PageObjectModel.ts	Deleted - split into modular structure
tests/pageObjectModel/index.ts	New entry point that loads dotenv and exports gotoVoyagerPage and SchemaPresets
tests/pageObjectModel/goToVoyagerPage.ts	Extracted function for navigating to Voyager page with error handling
tests/pageObjectModel/PlaywrightVoyagerPage.ts	Page object with new compareWithSnapshot method for conditional snapshot testing
tests/pageObjectModel/schema/changeDialog.ts	Schema dialog page object component
tests/pageObjectModel/schema/index.ts	Barrel export for schema-related page objects
tests/pageObjectModel/schema/presets.ts	Schema preset constants
tests/pageObjectModel/schema/tabs.ts	Tab components for schema dialog
tests/demo.spec.ts	Updated imports and replaced toHaveScreenshot with compareWithSnapshot; added explicit waits for UI elements
tests/express.spec.ts	Updated import path to new pageObjectModel structure
tests/webpack.spec.ts	Updated import path to new pageObjectModel structure

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

tests/pageObjectModel/PlaywrightVoyagerPage.ts

tests/pageObjectModel/index.ts

.env.example

tests/pageObjectModel/PlaywrightVoyagerPage.ts

Copilot

Pull request overview

Copilot reviewed 14 out of 16 changed files in this pull request and generated 5 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

tests/pageObjectModel/schema/tabs.ts

playwright.config.ts

tests/demo.spec.ts

package.json

IvanGoncharov · 2026-02-27T12:26:55Z

tests/pageObjectModel/schema/changeDialog.ts

+    this.displayButton = this.dialog.getByRole('button', { name: 'Display' });
+    this.cancelButton = this.dialog.getByRole('button', { name: 'Cancel' });
+  }
+}


у тебе едітор не додає нормально трейлінг нову лінію
додай будьласка в файли

IvanGoncharov · 2026-02-27T12:28:53Z

tests/pageObjectModel/schema/index.ts

@@ -0,0 +1,3 @@
+export * from './changeDialog.ts';
+export * from './presets.ts';
+export * from './tabs.ts';


я індекс файли майже ніколи не роблю хіба якщо це частина публічно АПІ тоді ок

IvanGoncharov · 2026-02-27T12:29:32Z

tests/pageObjectModel/schema/presets.ts

+  'Yelp',
+  'Shopify Storefront',
+  'GitHub',
+] as const;


занадто дрібні експорти
я для таких штук не створюю окремі файли

IvanGoncharov · 2026-02-27T12:34:30Z

playwright.config.ts

-      use: { baseURL: 'http://serve-express-example:9090' },
-    },
-  ],
+  projects: isLocalTesting


локал тестінг не повинно змінювати список проектів тільки
варіант де браузер працює
локально чи ні

IvanGoncharov · 2026-02-27T12:34:50Z

playwright.config.ts

+            wsEndpoint: 'ws://127.0.0.1:3000/',
+            exposeNetwork: '<loopback>',
+          },
+        }),


оце правильна зміна

IvanGoncharov · 2026-02-27T12:37:28Z

playwright.config.ts

+    ? [
+        {
+          name: 'npm run serve',
+          command: 'npm run serve',


щоб не дублювати значення може зроби змінні в кінці файлу
тоді і тексту менше буде і зрозуміти легше

IvanGoncharov · 2026-02-27T12:41:33Z

tests/pageObjectModel/PlaywrightVoyagerPage.ts

+    });
+
+    this.changeSchemaDialog = new PlaywrightChangeSchemaDialog(page);
+    this.snapshotSaveDir = process.env['SNAPSHOT_SAVE_DIR'];


дуже складно зрозуміти який код в мене вже був а який додався новий
перенеси будьласка назад в один файл тільки новий код виділявся
розділити мабуть варто але окремою зміною + я б не виносив зовсім маленькі константи і класи в окремі файли

IvanGoncharov · 2026-02-27T12:44:12Z

.env.example

+TEST_ENV=docker
+
+# Directory path to save screenshots of tests. No screenshots will be saved if the variable is not set. 
+SNAPSHOT_SAVE_DIR=./playwright-screenshots


навіщо то робити опцією
я б просто зробив би папку playwright-local-screenshots і додав би в гітігнор і не робив би опцію

і доречі, і я б тоді дот енв не робив.
бо навіть локально тести треба запускати в докері бо це правильніше
а запустити через локальний браузер то треба тільки для дебага і для інших не типиових випадків
а дот енв буде кожного разу загружатись і вийде що локально ніколи не запускається + можна легко забути поміняти в файлі
то менше очевидно ніж в шелі додати TEST_ENV="local"

можна ще спростити і зробити NO_DOCKER=1 (де просто сам факт зміної враховується а значення не важливе)

test: Added .env toggles for local testing and screenshot directory

0fad966

Copilot AI review requested due to automatic review settings February 23, 2026 18:11

Copilot started reviewing on behalf of MaksRomanchuk February 23, 2026 18:12 View session

Copilot AI reviewed Feb 23, 2026

View reviewed changes

MaksRomanchuk added 2 commits February 23, 2026 20:24

chore: Fixed formatting accorting to prettier rules

01246a3

chore: Changed decriptions and removed redundant config load

05ebebc

MaksRomanchuk requested a review from Copilot February 23, 2026 18:28

Copilot started reviewing on behalf of MaksRomanchuk February 23, 2026 18:29 View session

Copilot AI reviewed Feb 23, 2026

View reviewed changes

tests/pageObjectModel/schema/tabs.ts Outdated Show resolved Hide resolved

tests/pageObjectModel/schema/tabs.ts Show resolved Hide resolved

playwright.config.ts Show resolved Hide resolved

tests/demo.spec.ts Show resolved Hide resolved

package.json Outdated Show resolved Hide resolved

fix: Fixed package name typo

c13ba6d

IvanGoncharov requested changes Feb 28, 2026

View reviewed changes

Uh oh!

Conversation

MaksRomanchuk commented Feb 23, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants