Skip to content

Commit 1ef655a

Browse files
OlgaLarinaOlgaLarina
andauthored
playwright survey tests (#9761)
* playwright survey tests * playwright survey tests * playwright survey tests * playwright * playwright survey tests * playwright survey tests * playwright survey tests - switch off settings.animationEnabled * playwright survey tests * playwright survey tests --------- Co-authored-by: OlgaLarina <olga.larina.dev@gmail.com>
1 parent 32be7a8 commit 1ef655a

File tree

82 files changed

+8662
-4289
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

82 files changed

+8662
-4289
lines changed

e2e/components/popup.spec.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -182,7 +182,6 @@ frameworks.forEach((framework) => {
182182
await clickButton.click();
183183
await expect(popupModalSelector).toBeVisible();
184184
await expect(page.locator(".sv-popup span").getByText("modal_question")).toBeVisible();
185-
await page.waitForTimeout(500);
186185

187186
const popupClientRect = await popupModalSelector.locator(".sv-popup__container").boundingBox();
188187
const paddingDiff = 32;
Lines changed: 112 additions & 123 deletions
Original file line numberDiff line numberDiff line change
@@ -1,138 +1,127 @@
1-
import { frameworks, url, initSurvey, getSurveyResult } from "../helper";
1+
import { frameworks, url_test, initSurvey } from "../helper";
2+
import { QuestionRadiogroup } from "../questionHelper";
23
import { test, expect } from "@playwright/test";
4+
import { Survey } from "../surveyHelper";
35

46
const title = "completeTrigger";
7+
const themeName = "default";
58

6-
const json = {
7-
triggers: [
8-
{ type: "complete", name: "exit1", operator: "equal", value: "Yes" },
9-
{ type: "complete", name: "exit2", operator: "equal", value: "Yes" }
10-
],
11-
pages: [
12-
{
13-
title: "What operating system do you use?",
14-
questions: [
15-
{
16-
type: "checkbox",
17-
name: "opSystem",
18-
title: "OS",
19-
hasOther: true,
20-
choices: ["Windows", "Linux", "Macintosh OSX"]
21-
},
22-
{
23-
type: "radiogroup",
24-
name: "exit1",
25-
title: "Do you want to finish the survey?",
26-
choices: ["Yes", "No"],
27-
colCount: 0
28-
}
29-
]
30-
},
31-
{
32-
title: "What language(s) are you currently using?",
33-
questions: [
34-
{
35-
type: "checkbox",
36-
name: "langs",
37-
title: "Plese select from the list",
38-
colCount: 4,
39-
choices: [
40-
"Javascript",
41-
"Java",
42-
"Python",
43-
"CSS",
44-
"PHP",
45-
"Ruby",
46-
"C++",
47-
"C",
48-
"Shell",
49-
"C#",
50-
"Objective-C",
51-
"R",
52-
"VimL",
53-
"Go",
54-
"Perl",
55-
"CoffeeScript",
56-
"TeX",
57-
"Swift",
58-
"Scala",
59-
"Emacs List",
60-
"Haskell",
61-
"Lua",
62-
"Clojure",
63-
"Matlab",
64-
"Arduino",
65-
"Makefile",
66-
"Groovy",
67-
"Puppet",
68-
"Rust",
69-
"PowerShell"
70-
]
71-
},
72-
{
73-
type: "radiogroup",
74-
name: "exit2",
75-
title: "Do you want to finish the survey?",
76-
choices: ["Yes", "No"],
77-
colCount: 0
78-
}
79-
]
80-
},
81-
{
82-
title: "Please enter your name and e-mail",
83-
questions: [
84-
{ type: "text", name: "name", title: "Name:" },
85-
{ type: "text", name: "email", title: "Your e-mail" }
86-
]
87-
}
88-
]
89-
};
90-
91-
frameworks.forEach(framework => {
92-
test.describe(`${title} - ${framework}`, () => {
9+
frameworks.forEach((framework) => {
10+
test.describe(`${framework} ${title}`, () => {
9311
test.beforeEach(async ({ page }) => {
94-
await page.goto(`${url}${framework}`);
12+
const json = {
13+
triggers: [
14+
{ type: "complete", name: "exit1", operator: "equal", value: "Yes" },
15+
{ type: "complete", name: "exit2", operator: "equal", value: "Yes" }
16+
],
17+
pages: [
18+
{
19+
title: "What operating system do you use?",
20+
questions: [
21+
{
22+
type: "checkbox",
23+
name: "opSystem",
24+
title: "OS",
25+
hasOther: true,
26+
choices: ["Windows", "Linux", "Macintosh OSX"]
27+
},
28+
{
29+
type: "radiogroup",
30+
name: "exit1",
31+
title: "Do you want to finish the survey?",
32+
choices: ["Yes", "No"],
33+
colCount: 0
34+
}
35+
]
36+
},
37+
{
38+
title: "What language(s) are you currently using?",
39+
questions: [
40+
{
41+
type: "checkbox",
42+
name: "langs",
43+
title: "Plese select from the list",
44+
colCount: 4,
45+
choices: [
46+
"Javascript",
47+
"Java",
48+
"Python",
49+
"CSS",
50+
"PHP",
51+
"Ruby",
52+
"C++",
53+
"C",
54+
"Shell",
55+
"C#",
56+
"Objective-C",
57+
"R",
58+
"VimL",
59+
"Go",
60+
"Perl",
61+
"CoffeeScript",
62+
"TeX",
63+
"Swift",
64+
"Scala",
65+
"Emacs List",
66+
"Haskell",
67+
"Lua",
68+
"Clojure",
69+
"Matlab",
70+
"Arduino",
71+
"Makefile",
72+
"Groovy",
73+
"Puppet",
74+
"Rust",
75+
"PowerShell"
76+
]
77+
},
78+
{
79+
type: "radiogroup",
80+
name: "exit2",
81+
title: "Do you want to finish the survey?",
82+
choices: ["Yes", "No"],
83+
colCount: 0
84+
}
85+
]
86+
},
87+
{
88+
title: "Please enter your name and e-mail",
89+
questions: [
90+
{ type: "text", name: "name", title: "Name:" },
91+
{ type: "text", name: "email", title: "Your e-mail" }
92+
]
93+
}
94+
]
95+
};
96+
await page.goto(`${url_test}${themeName}/${framework}`);
9597
await initSurvey(page, framework, json);
9698
});
97-
9899
test("check visibility", async ({ page }) => {
99-
const nextSelector = page.locator("input[value=\"Next\"]").filter({ visible: true });
100-
const completeSelector = page.locator("input[value=\"Complete\"]").filter({ visible: true });
101-
const yesSelector = page.locator("label").filter({ hasText: "Yes" }).locator("span").first();
102-
const noSelector = page.locator("label").filter({ hasText: "No" }).locator("span").first();
100+
const survey = new Survey(page);
101+
const exit1 = new QuestionRadiogroup(page, "exit1");
102+
await exit1.clickByValue("No");
103+
await survey.nextPage();
104+
const exit2 = new QuestionRadiogroup(page, "exit2");
105+
await exit2.clickByValue("Yes");
106+
await survey.complete();
103107

104-
await expect(page.locator(".sv-string-viewer").filter({ hasText: "4. Do you want to finish the survey?" })).toHaveCount(0);
105-
await noSelector.click();
106-
await nextSelector.click();
107-
await yesSelector.click();
108-
await completeSelector.click();
109-
110-
const surveyResult = await getSurveyResult(page);
111-
expect(surveyResult).toEqual({ exit1: "No", exit2: "Yes" });
108+
await survey.checkData({ exit1: "No", exit2: "Yes" });
112109
});
113-
114110
test("check complete and next buttons visibility", async ({ page }) => {
115-
const nextSelector = page.locator("input[value=\"Next\"]").filter({ visible: true });
116-
const completeSelector = page.locator("input[value=\"Complete\"]").filter({ visible: true });
117-
const yesSelector = page.locator("label").filter({ hasText: "Yes" }).locator("span").first();
118-
const noSelector = page.locator("label").filter({ hasText: "No" }).locator("span").first();
119-
120-
await expect(nextSelector).toHaveCount(1);
121-
await expect(completeSelector).toHaveCount(0);
122-
123-
await yesSelector.click();
124-
await expect(nextSelector).toHaveCount(0);
125-
await expect(completeSelector).toHaveCount(1);
126-
127-
await noSelector.click();
128-
await expect(nextSelector).toHaveCount(1);
129-
await expect(completeSelector).toHaveCount(0);
130-
131-
await yesSelector.click();
132-
await completeSelector.click();
111+
const survey = new Survey(page);
112+
const exit1 = new QuestionRadiogroup(page, "exit1");
113+
await exit1.clickByValue("Yes");
114+
await survey.checkNextButtonVisibility(false);
115+
await survey.checkCompleteButtonVisibility(true);
116+
await survey.checkNextButtonVisibility(true);
117+
await survey.checkCompleteButtonVisibility(false);
118+
await exit1.clickByValue("No");
119+
await exit1.clickByValue("Yes");
120+
await survey.checkNextButtonVisibility(false);
121+
await survey.checkCompleteButtonVisibility(true);
122+
await survey.complete();
133123

134-
const surveyResult = await getSurveyResult(page);
135-
expect(surveyResult).toEqual({ exit1: "Yes" });
124+
await survey.checkData({ exit1: "Yes" });
136125
});
137126
});
138127
});

e2e/helper.ts

Lines changed: 15 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { Page } from "@playwright/test";
1+
import type { Locator, Page } from "@playwright/test";
22
import { expect } from "@playwright/test";
33

44
const environment = process.env.env;
@@ -39,8 +39,7 @@ export const initSurvey = async (page: Page, framework: string, json: any, isDes
3939
// eslint-disable-next-line no-console
4040
console.log("surveyjs console.error and console.warn override");
4141

42-
//!!!TODO!!!
43-
//window["Survey"].settings.animationEnabled = false;
42+
window["Survey"].settings.animationEnabled = false;
4443
const self: any = window;
4544
const model = new window["Survey"].Model(json);
4645
model.setDesignMode(isDesignMode);
@@ -131,4 +130,16 @@ export async function setRowItemFlowDirection(page) {
131130
await page.evaluate(() => {
132131
window["Survey"].settings.itemFlowDirection = "row";
133132
});
134-
}
133+
}
134+
135+
export async function visibleInViewport (page, locator: Locator) {
136+
const rect = await locator.boundingBox();
137+
return await page.evaluate((rect) => {
138+
return (
139+
rect?.y >= 0 &&
140+
rect?.x >= 0 &&
141+
rect?.y + rect?.height <= (window.innerHeight || document.documentElement.clientHeight) &&
142+
rect?.x + rect?.width <= (window.innerWidth || document.documentElement.clientWidth)
143+
);
144+
}, rect);
145+
}

e2e/questions/allTypes.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ const title = "allTypes";
77
const themeName = "default";
88

99
frameworks.forEach((framework) => {
10-
test.describe(title + " - " + framework, () => {
10+
test.describe(`${framework} ${title}`, () => {
1111
test.beforeEach(async ({ page }) => {
1212
const img_base64 =
1313
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAADICAYAAABS39xVAAAGP0lEQVR4Xu3UPS6FURiF0aNW6SS38BPRyC3MQCNR68V09KIwCgqJuVAzAAoEuZJbmcH3Pck6Ezg7a7/ZG6vVajU8AgQIBAQ2DFagJREJEFgLGCyHQIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYE9/A2/fXuHt5Gpe7y4mT+J7A/AUM1sQdLR5u1gnOF4fj+vh04jS+JzBvAYM1YT8fvz/j4PF2neBi52hcLU8mTONrAvMXMFgTd3T/8jxeP9/H/ubWONvemziN7wnMW8Bgzbsf6QgQ+CdgsJwDAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYyAwcpUJSgBAgbLDRAgkBEwWJmqBCVAwGC5AQIEMgIGK1OVoAQIGCw3QIBARsBgZaoSlAABg+UGCBDICBisTFWCEiBgsNwAAQIZAYOVqUpQAgQMlhsgQCAjYLAyVQlKgIDBcgMECGQEDFamKkEJEDBYboAAgYzAH3j2MtZeCYSgAAAAAElFTkSuQmCC";

e2e/questions/boolean.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import { test, expect } from "@playwright/test";
55
const themeName = "default";
66
const title = "boolean";
77
frameworks.forEach((framework) => {
8-
test.describe(title + " - " + framework, () => {
8+
test.describe(`${framework} ${title}`, () => {
99
test.beforeEach(async ({ page }) => {
1010
const json = {
1111
questions: [

e2e/questions/checkboxes.spec.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ const json = {
3636
};
3737

3838
frameworks.forEach((framework) => {
39-
test.describe(title + " - " + framework, () => {
39+
test.describe(`${framework} ${title}`, () => {
4040
test.beforeEach(async ({ page }) => {
4141
await page.goto(`${url_test}${themeName}/${framework}`);
4242
await initSurvey(page, framework, json);
@@ -487,7 +487,7 @@ frameworks.forEach((framework) => {
487487
});
488488

489489
frameworks.forEach((framework) => {
490-
test.describe(title + " - " + framework, () => {
490+
test.describe(`${framework} ${title}`, () => {
491491
test.beforeEach(async ({ page }) => {
492492
await page.goto(`${url_test}${themeName}/${framework}`);
493493
await initSurvey(page, framework, json);
@@ -518,7 +518,7 @@ frameworks.forEach((framework) => {
518518
});
519519

520520
frameworks.forEach((framework) => {
521-
test.describe(title + " - " + framework, () => {
521+
test.describe(`${framework} ${title}`, () => {
522522
test.beforeEach(async ({ page }) => {
523523
await page.goto(`${url_test}${themeName}/${framework}`);
524524
await page.setViewportSize({ width: 800, height: 600 });

0 commit comments

Comments
 (0)