Skip to content

Commit cc9e8a2

Browse files
committed
tests
1 parent 087f00f commit cc9e8a2

17 files changed

+377
-150
lines changed

.github/workflows/playwright.yml

Lines changed: 7 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -37,15 +37,15 @@ jobs:
3737
- name: Run Vite tests
3838
run: CI=true npm test
3939
- name: Run Playwright tests
40-
run: CI=true npm test:e2e
40+
run: CI=true npm run test:e2e
4141
- uses: actions/upload-artifact@v4
4242
if: ${{ !cancelled() }}
4343
with:
4444
name: playwright-report
4545
path: playwright-report/
4646
retention-days: 30
4747

48-
test-api-org:
48+
test-docker-playwright:
4949
timeout-minutes: 15
5050
runs-on: ubuntu-latest
5151
steps:
@@ -55,58 +55,17 @@ jobs:
5555
- name: Build and export to Docker
5656
uses: docker/build-push-action@v6
5757
with:
58-
file: api.Dockerfile
5958
load: true
60-
tags: api:test
59+
tags: app:pw
6160
build-args: mode=playwright
6261
- name: Run Playwright tests
6362
run: |
6463
docker run --rm --name playwright \
65-
-v $(pwd)/test-results-docker-org:/test-results \
66-
-e CI=true \
67-
-e VUE_APP_SCOPE=organization \
68-
-e VUE_APP_GITHUB_ORG=octodemo \
69-
-e VUE_APP_GITHUB_API=/api/github \
70-
-e APP_MOCKED_DATA=true \
71-
-e VUE_APP_GITHUB_TOKEN=dummy \
72-
-e SESSION_SECRET=dummy \
73-
api:test "@org"
64+
-v $(pwd)/test-results-docker:/test-results \
65+
app:pw
7466
- uses: actions/upload-artifact@v4
7567
if: always()
7668
with:
77-
name: playwright-report-docker-org
78-
path: test-results-docker-org/
79-
retention-days: 30
80-
81-
test-api-ent:
82-
timeout-minutes: 15
83-
runs-on: ubuntu-latest
84-
steps:
85-
- uses: actions/checkout@v4
86-
- name: Set up Docker Buildx
87-
uses: docker/setup-buildx-action@v3
88-
- name: Build and export to Docker
89-
uses: docker/build-push-action@v6
90-
with:
91-
file: api.Dockerfile
92-
load: true
93-
tags: api:test
94-
build-args: mode=playwright
95-
- name: Run Playwright tests
96-
run: |
97-
docker run --rm --name playwright \
98-
-v $(pwd)/test-results-docker-ent:/test-results \
99-
-e CI=true \
100-
-e VUE_APP_SCOPE=enterprise \
101-
-e VUE_APP_GITHUB_ENT=octodemo \
102-
-e VUE_APP_GITHUB_API=/api/github \
103-
-e APP_MOCKED_DATA=true \
104-
-e VUE_APP_GITHUB_TOKEN=dummy \
105-
-e SESSION_SECRET=dummy \
106-
api:test "@ent"
107-
- uses: actions/upload-artifact@v4
108-
if: always()
109-
with:
110-
name: playwright-report-docker-ent
111-
path: test-results-docker-ent/
69+
name: playwright-report-docker
70+
path: test-results-docker/
11271
retention-days: 30

app/components/BreakdownComponent.vue

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,9 @@ ChartJS.register(
111111
112112
export default defineComponent({
113113
name: 'BreakdownComponent',
114+
components: {
115+
Pie
116+
},
114117
props: {
115118
metrics: {
116119
type: Object,
@@ -121,28 +124,6 @@ export default defineComponent({
121124
required: true
122125
}
123126
},
124-
components: {
125-
Pie
126-
},
127-
computed: {
128-
breakdownDisplayName() {
129-
return this.breakdownKey.charAt(0).toUpperCase() + this.breakdownKey.slice(1);
130-
},
131-
breakdownDisplayNamePlural() {
132-
return `${this.breakdownDisplayName}s`;
133-
},
134-
headers() {
135-
return [
136-
{ title: `${this.breakdownDisplayName} Name`, key: 'name' },
137-
{ title: 'Accepted Prompts', key: 'acceptedPrompts' },
138-
{ title: 'Suggested Prompts', key: 'suggestedPrompts' },
139-
{ title: 'Accepted Lines of Code', key: 'acceptedLinesOfCode' },
140-
{ title: 'Suggested Lines of Code', key: 'suggestedLinesOfCode' },
141-
{ title: 'Acceptance Rate by Count (%)', key: 'acceptanceRateByCount' },
142-
{ title: 'Acceptance Rate by Lines (%)', key: 'acceptanceRateByLines' },
143-
];
144-
},
145-
},
146127
setup(props) {
147128
148129
// Create a reactive reference to store the breakdowns.
@@ -250,6 +231,25 @@ export default defineComponent({
250231
return { chartOptions, breakdownList, numberOfBreakdowns,
251232
breakdownsChartData, breakdownsChartDataTop5AcceptedPrompts, breakdownsChartDataTop5AcceptedPromptsByLines, breakdownsChartDataTop5AcceptedPromptsByCounts };
252233
},
234+
computed: {
235+
breakdownDisplayName() {
236+
return this.breakdownKey.charAt(0).toUpperCase() + this.breakdownKey.slice(1);
237+
},
238+
breakdownDisplayNamePlural() {
239+
return `${this.breakdownDisplayName}s`;
240+
},
241+
headers() {
242+
return [
243+
{ title: `${this.breakdownDisplayName} Name`, key: 'name' },
244+
{ title: 'Accepted Prompts', key: 'acceptedPrompts' },
245+
{ title: 'Suggested Prompts', key: 'suggestedPrompts' },
246+
{ title: 'Accepted Lines of Code', key: 'acceptedLinesOfCode' },
247+
{ title: 'Suggested Lines of Code', key: 'suggestedLinesOfCode' },
248+
{ title: 'Acceptance Rate by Count (%)', key: 'acceptanceRateByCount' },
249+
{ title: 'Acceptance Rate by Lines (%)', key: 'acceptanceRateByLines' },
250+
];
251+
},
252+
},
253253
254254
255255
});

app/components/MainComponent.vue

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,10 +60,11 @@
6060
<BreakdownComponent v-if="item === 'editors'" :metrics="metrics" :breakdown-key="'editor'" />
6161
<CopilotChatViewer v-if="item === 'copilot chat'" :metrics="metrics" />
6262
<SeatsAnalysisViewer v-if="item === 'seat analysis'" :seats="seats" />
63-
<ApiResponse v-if="item === 'api response'" :metrics="metrics" :originalMetrics="originalMetrics" :seats="seats" />
63+
<ApiResponse v-if="item === 'api response'" :metrics="metrics" :original-metrics="originalMetrics" :seats="seats" />
6464
</v-card>
6565
</v-window-item>
66-
<v-alert v-show="metricsReady && metrics.length == 0" density="compact" text="No data available to display"
66+
<v-alert
67+
v-show="metricsReady && metrics.length == 0" density="compact" text="No data available to display"
6768
title="No data" type="warning" />
6869
</v-window>
6970

app/components/MetricsViewer.vue

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@
8181

8282
<script lang="ts">
8383
import { defineComponent, ref, toRef } from 'vue';
84-
import { Metrics } from '@/model/Metrics';
84+
import type { Metrics } from '@/model/Metrics';
8585
import {
8686
Chart as ChartJS,
8787
ArcElement,
@@ -112,34 +112,17 @@ ChartJS.register(
112112
113113
export default defineComponent({
114114
name: 'MetricsViewer',
115-
props: {
116-
metrics: {
117-
type: Array as PropType<Metrics[]>,
118-
required: true
119-
}
120-
},
121115
components: {
122116
Line,
123117
Bar
124118
}
125119
,
126-
data () {
127-
return {
128-
data : {
129-
labels: ['VueJs', 'EmberJs', 'ReactJs', 'AngularJs'],
130-
datasets: [
131-
{
132-
backgroundColor: ['#41B883', '#E46651', '#00D8FF', '#DD1B16'],
133-
data: [40, 20, 80, 10]
120+
props: {
121+
metrics: {
122+
type: Array as PropType<Metrics[]>,
123+
required: true
134124
}
135-
]
136-
},
137-
options : {
138-
responsive: true,
139-
maintainAspectRatio: false
140-
}
141-
}
142-
},
125+
},
143126
setup(props) {
144127
145128
//Tiles
@@ -331,6 +314,23 @@ export default defineComponent({
331314
totalActiveUsersChartOptions, acceptanceRateByLinesChartData, acceptanceRateByCountChartData, acceptanceRateAverageByLines, acceptanceRateAverageByCount, cumulativeNumberSuggestions,
332315
cumulativeNumberAcceptances, cumulativeNumberLOCAccepted, totalLinesSuggested };
333316
},
317+
data () {
318+
return {
319+
data : {
320+
labels: ['VueJs', 'EmberJs', 'ReactJs', 'AngularJs'],
321+
datasets: [
322+
{
323+
backgroundColor: ['#41B883', '#E46651', '#00D8FF', '#DD1B16'],
324+
data: [40, 20, 80, 10]
325+
}
326+
]
327+
},
328+
options : {
329+
responsive: true,
330+
maintainAspectRatio: false
331+
}
332+
}
333+
},
334334
335335
});
336336
</script>

app/components/SeatsAnalysisViewer.vue

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<div class="tiles-container">
3-
<v-card elevation="4" color="white" variant="elevated" class="mx-auto my-4"
3+
<v-card
4+
elevation="4" color="white" variant="elevated" class="mx-auto my-4"
45
style="width: 330px; height: 175px;">
56
<v-card-item class="d-flex justify-center align-center">
67
<div class="tiles-text">
@@ -14,7 +15,8 @@
1415
</v-card-item>
1516
</v-card>
1617

17-
<v-card elevation="4" color="white" variant="elevated" class="mx-auto my-3"
18+
<v-card
19+
elevation="4" color="white" variant="elevated" class="mx-auto my-3"
1820
style="width: 300px; height: 175px;">
1921
<v-card-item class="d-flex justify-center align-center">
2022
<div class="tiles-text">

e2e-tests/copilot.ent.spec.ts

Lines changed: 21 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,30 @@
11
import { expect, test } from '@playwright/test'
2+
import { DashboardPage } from './pages/DashboardPage';
3+
import { aw } from 'vitest/dist/chunks/reporters.D7Jzd9GS.js';
4+
import { a } from 'vitest/dist/chunks/suite.B2jumIFP.js';
25

36
const tag = { tag: ['@ent'] }
47

8+
let dashboard: DashboardPage;
59

6-
test('has title', tag, async ({ page }) => {
10+
test.beforeAll(async ({ browser }) => {
11+
const page = await browser.newPage();
712
await page.goto('/enterprises/octo-demo-ent');
813

9-
// Expect a title "to contain" a substring.
10-
await expect(page).toHaveTitle(/Copilot Metrics Viewer \| Enterprise : octo-demo-ent/);
11-
await expect(page.locator(".toolbar-title")).toHaveText(/Copilot Metrics Viewer \| Enterprise : octo-demo-ent/);
14+
dashboard = new DashboardPage(page);
15+
16+
// wait for the data
17+
await dashboard.expectMetricLabelsVisible();
1218
});
1319

14-
test('enterprise tab', tag, async ({ page }) => {
15-
await page.goto('/enterprises/octo-demo-ent');
16-
await expect(page.getByRole('tab', { name: 'enterprise' })).toBeVisible();
17-
});
20+
test.afterAll(async () => {
21+
await dashboard.close();
22+
});
23+
24+
test('has title', tag, async () => {
25+
await dashboard.expectToHaveTitle(/Copilot Metrics Viewer \| Enterprise : octo-demo-ent/);
26+
});
27+
28+
test('enterprise tab', tag, async () => {
29+
await dashboard.expectEnterpriseTabVisible();
30+
});

e2e-tests/copilot.org.spec.ts

Lines changed: 19 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,28 @@
11
import { expect, test } from '@playwright/test'
2+
import { DashboardPage } from './pages/DashboardPage';
23

34
const tag = { tag: ['@org'] }
45

5-
test('has title', tag, async ({ page }) => {
6+
let dashboard: DashboardPage;
7+
8+
test.beforeAll(async ({ browser }) => {
9+
const page = await browser.newPage();
610
await page.goto('/orgs/octo-demo-org');
711

8-
// Expect a title "to contain" a substring.
9-
await expect(page).toHaveTitle(/Copilot Metrics Viewer \| Organization : octo-demo-org/);
10-
await expect(page.locator(".toolbar-title")).toHaveText(/Copilot Metrics Viewer \| Organization : octo-demo-org/);
12+
dashboard = new DashboardPage(page);
13+
14+
// wait for the data
15+
await dashboard.expectMetricLabelsVisible();
1116
});
1217

13-
test('organization tab', tag, async ({ page }) => {
14-
await page.goto('/orgs/octo-demo-org');
15-
await expect(page.getByRole('tab', { name: 'organization' })).toBeVisible();
18+
test.afterAll(async () => {
19+
await dashboard?.close();
20+
});
21+
22+
test('has title', tag, async () => {
23+
await dashboard.expectToHaveTitle(/Copilot Metrics Viewer \| Organization : octo-demo-org/);
24+
});
25+
26+
test('organization tab', tag, async () => {
27+
await dashboard.expectOrgTabVisible();
1628
});

e2e-tests/copilot.team.spec.ts

Lines changed: 21 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,28 @@
11
import { expect, test } from '@playwright/test'
2+
import { DashboardPage } from './pages/DashboardPage';
23

3-
const tag = { tag: ['@team'] }
4+
const tag = { tag: ['@org'] }
45

5-
test('has title', tag, async ({ page }) => {
6+
let dashboard: DashboardPage;
7+
8+
test.beforeAll(async ({ browser }) => {
9+
const page = await browser.newPage();
610
await page.goto('/orgs/octo-demo-org/team/the-a-team');
711

8-
// Expect a title "to contain" a substring.
9-
await expect(page).toHaveTitle(/Copilot Metrics Viewer \| Organization : octo-demo-org \| Team : the-a-team/);
10-
await expect(page.locator(".toolbar-title")).toHaveText(/Copilot Metrics Viewer \| Organization : octo-demo-org \| Team : the-a-team/);
12+
dashboard = new DashboardPage(page);
13+
14+
// wait for the data
15+
await dashboard.expectMetricLabelsVisible();
1116
});
1217

13-
test('team tab', tag, async ({ page }) => {
14-
await page.goto('/orgs/octo-demo-org/team/the-a-team');
15-
await expect(page.getByRole('tab', { name: 'team' })).toBeVisible();
16-
});
18+
test.afterAll(async () => {
19+
await dashboard?.close();
20+
});
21+
22+
test('has title', tag, async () => {
23+
await dashboard.expectToHaveTitle(/Copilot Metrics Viewer \| Organization : octo-demo-org \| Team : the-a-team/);
24+
});
25+
26+
test('team tab', tag, async () => {
27+
await dashboard.expectTeamsTabVisible();
28+
});

0 commit comments

Comments
 (0)