E2e setup and add first test

.github/workflows/e2e_tests.yml

@@ -0,0 +1,56 @@
+name: 📊 E2E Tests
+
+on:
+  workflow_dispatch:
+
+jobs:
+  e2e:
+    name: E2E
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "24"
+
+      - name: Install and compile extension
+        run: |
+          npm ci
+          npm run compile
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10.24.0
+
+      - name: Install E2E dependencies
+        run: pnpm install
+        working-directory: test/e2e
+
+      - name: Run E2E tests
+        uses: GabrielBB/xvfb-action@v1
+        with:
+          run: pnpm test:e2e
+          working-directory: test/e2e
+        env:
+          E2E_CLOUD: ${{ secrets.E2E_CLOUD }}
+          E2E_API_KEY: ${{ secrets.E2E_API_KEY }}
+          E2E_API_SECRET: ${{ secrets.E2E_API_SECRET }}
+          CI: true
+
+      - name: Generate Allure report
+        if: always()
+        run: pnpm exec allure generate allure-results -o allure-report --clean
+        working-directory: test/e2e
+
+      - name: Upload Allure report
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: allure-report-${{ github.run_number }}
+          path: test/e2e/allure-report
+          retention-days: 30

.gitignore

@@ -54,3 +54,11 @@ CLAUDE.md
 *.temp
 temp/
 
+
+# Test reports
+test/e2e/allure-results/
+test/e2e/allure-report/
+test/e2e/.wdio-vscode-service/
+test/e2e/.env
+test/e2e/videos/
+test/e2e/_results_/

test/e2e/README.md

@@ -0,0 +1,82 @@
+# E2E Tests
+
+End-to-end tests for the Cloudinary VS Code extension using [WebdriverIO](https://webdriver.io/) and [wdio-vscode-service](https://github.com/webdriverio-community/wdio-vscode-service).
+
+## Setup
+
+```bash
+cd test/e2e
+pnpm install
+```
+
+## Environment variables
+
+End-to-end runs require Cloudinary credentials in `process.env`. The `onPrepare` hook in `wdio.conf.ts` reads `E2E_CLOUD`, `E2E_API_KEY`, and `E2E_API_SECRET`, then writes `~/.cloudinary/environments.json` in the shape the extension expects (cloud name as the top-level key, with `apiKey` and `apiSecret`).
+
+| Variable | Description |
+|----------|-------------|
+| `E2E_CLOUD` | Cloudinary cloud name |
+| `E2E_API_KEY` | API key |
+| `E2E_API_SECRET` | API secret |
+
+**Local:** add a `test/e2e/.env` file (gitignored) such as:
+
+## Running Tests
+
+```bash
+pnpm test:e2e
+```
+
+This will:
+1. Download a VS Code binary (if not already cached in `.wdio-vscode-service/`)
+2. Launch VS Code with the extension loaded
+3. Run all specs in `specs/`
+
+## Viewing Reports
+
+After a test run, generate and open the Allure report:
+
+```bash
+pnpm test:report
+```
+
+## Project Structure
+
+```
+test/e2e/
+├── wdio.conf.ts              # WebdriverIO configuration
+├── tsconfig.json              # TypeScript config for e2e tests
+├── package.json               # Dependencies (separate from root)
+├── specs/                     # Test spec files
+├── src/
+│   └── utils/                 # Page object utilities
+```
+
+## Writing Tests
+
+Tests use [Mocha](https://mochajs.org/) as the test framework and the `wdio-vscode-service` page objects to interact with VS Code.
+
+```ts
+import { activityBarUtils } from '../src/utils/ActivityBarUtils.js'
+import { sideBarViewUtils } from '../src/utils/SideBarViewUtils.js'
+
+it('should open the Cloudinary view', async () => {
+    await activityBarUtils.openView('Cloudinary')
+    await sideBarViewUtils.validateSideBarViewTitle('CLOUDINARY')
+    await sideBarViewUtils.validateContentItemsExist(['cats', 'dogs'])
+})
+```
+
+### Allure Reporting
+
+Steps are reported via `allureReporter.addStep()` inside utility methods. WebDriver-level steps (findElement, etc.) are disabled in the config to keep reports clean.
+
+## Configuration
+
+Key settings in `wdio.conf.ts`:
+
+| Setting | Value | Description |
+|---------|-------|-------------|
+| `browserVersion` | `'stable'` | VS Code version to test against |
+| `logLevel` | `'warn'` | Suppresses verbose WebDriver logs |
+| `extensionPath` | `../../` | Points to the root extension directory |

test/e2e/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "e2e",
+  "type": "module",
+  "devDependencies": {
+    "@types/node": "^25.5.2",
+    "@wdio/allure-reporter": "^9.27.0",
+    "@wdio/cli": "^9.27.0",
+    "@wdio/globals": "^9.27.0",
+    "@wdio/local-runner": "^9.27.0",
+    "@wdio/mocha-framework": "^9.27.0",
+    "@wdio/spec-reporter": "^9.27.0",
+    "allure-commandline": "^2.38.1",
+    "cloudinary": "^2.9.0",
+    "expect-webdriverio": "^5.6.5",
+    "wdio-video-reporter": "^6.2.0",
+    "wdio-vscode-service": "^6.1.4"
+  },
+  "scripts": {
+    "test:e2e": "wdio run ./wdio.conf.ts",
+    "test:report": "allure generate allure-results -o allure-report --clean && allure open allure-report"
+  }
+}