mirror of https://github.com/nocodb/nocodb
Raju Udava
2 years ago
committed by
Muhammed Mustafa
4 changed files with 226 additions and 4 deletions
@ -0,0 +1,118 @@
|
||||
// playwright-dev-page.ts
|
||||
import { Page, expect, Locator } from "@playwright/test"; |
||||
import BasePage from "../../Base"; |
||||
|
||||
export class SurveyFormPage extends BasePage { |
||||
readonly formHeading: Locator; |
||||
readonly formSubHeading: Locator; |
||||
readonly submitButton: Locator; |
||||
readonly nextButton: Locator; |
||||
readonly nextSlideButton: Locator; |
||||
readonly prevSlideButton: Locator; |
||||
readonly darkModeButton: Locator; |
||||
readonly formFooter: Locator; |
||||
|
||||
constructor(rootPage: Page) { |
||||
super(rootPage); |
||||
this.formHeading = this.get().locator( |
||||
'[data-pw="nc-survey-form__heading"]' |
||||
); |
||||
this.formSubHeading = this.get().locator( |
||||
'[data-pw="nc-survey-form__sub-heading"]' |
||||
); |
||||
this.submitButton = this.get().locator( |
||||
'[data-pw="nc-survey-form__btn-submit"]' |
||||
); |
||||
this.nextButton = this.get().locator( |
||||
'[data-pw="nc-survey-form__btn-next"]' |
||||
); |
||||
this.nextSlideButton = this.get().locator( |
||||
'[data-pw="nc-survey-form__icon-next"]' |
||||
); |
||||
this.prevSlideButton = this.get().locator( |
||||
'[data-pw="nc-survey-form__icon-prev"]' |
||||
); |
||||
this.darkModeButton = this.get().locator('[data-pw="nc-form-dark-mode"]'); |
||||
this.formFooter = this.get().locator('[data-pw="nc-survey-form__footer"]'); |
||||
} |
||||
|
||||
get() { |
||||
return this.rootPage.locator("html >> .nc-form-view"); |
||||
} |
||||
|
||||
async validate({ |
||||
heading, |
||||
subHeading, |
||||
fieldLabel, |
||||
footer, |
||||
}: { |
||||
heading: string; |
||||
subHeading: string; |
||||
fieldLabel: string; |
||||
footer: string; |
||||
}) { |
||||
await expect(this.get()).toBeVisible(); |
||||
await expect(this.formHeading).toHaveText(heading); |
||||
await expect(this.formSubHeading).toHaveText(subHeading); |
||||
await expect(this.formFooter).toHaveText(footer); |
||||
await expect( |
||||
this.get().locator(`[data-pw="nc-form-column-label"]`) |
||||
).toHaveText(fieldLabel); |
||||
|
||||
// parse footer text ("1 / 3") to identify if last slide
|
||||
let isLastSlide = false; |
||||
const footerText = await this.formFooter.innerText(); |
||||
const slideNumber = footerText.split(" / ")[0]; |
||||
const totalSlides = footerText.split(" / ")[1]; |
||||
if (slideNumber === totalSlides) { |
||||
isLastSlide = true; |
||||
} |
||||
if (isLastSlide) { |
||||
await expect(this.submitButton).toBeVisible(); |
||||
} else { |
||||
await expect(this.nextButton).toBeVisible(); |
||||
} |
||||
} |
||||
|
||||
async fill(param: { fieldLabel: string; type?: string; value?: string }) { |
||||
await this.get() |
||||
.locator(`[data-pw="nc-survey-form__input-${param.fieldLabel}"]`) |
||||
.click(); |
||||
if (param.type === "SingleLineText") { |
||||
await this.get() |
||||
.locator( |
||||
`[data-pw="nc-survey-form__input-${param.fieldLabel}"] >> input` |
||||
) |
||||
.fill(param.value); |
||||
// press enter key
|
||||
await this.get() |
||||
.locator( |
||||
`[data-pw="nc-survey-form__input-${param.fieldLabel}"] >> input` |
||||
) |
||||
.press("Enter"); |
||||
} else if (param.type === "DateTime") { |
||||
const modal = await this.rootPage.locator(".nc-picker-datetime"); |
||||
await expect(modal).toBeVisible(); |
||||
await modal.locator(".ant-picker-now-btn").click(); |
||||
await modal.locator(".ant-picker-ok").click(); |
||||
await this.nextButton.click(); |
||||
} |
||||
} |
||||
|
||||
async validateSuccessMessage(param: { |
||||
message: string; |
||||
showAnotherForm?: boolean; |
||||
}) { |
||||
await expect( |
||||
this.get().locator( |
||||
`[data-pw="nc-survey-form__success-msg"]:has-text("${param.message}")` |
||||
) |
||||
).toBeVisible(); |
||||
|
||||
if (param.showAnotherForm) { |
||||
await expect( |
||||
this.get().locator(`button:has-text("Submit Another Form")`) |
||||
).toBeVisible(); |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,79 @@
|
||||
import { test } from "@playwright/test"; |
||||
import { DashboardPage } from "../pages/Dashboard"; |
||||
import { SurveyFormPage } from "../pages/Dashboard/SurveyForm"; |
||||
import setup from "../setup"; |
||||
|
||||
test.describe("Share form", () => { |
||||
let dashboard: DashboardPage; |
||||
let surveyForm: SurveyFormPage; |
||||
let context: any; |
||||
|
||||
test.beforeEach(async ({ page }) => { |
||||
context = await setup({ page }); |
||||
dashboard = new DashboardPage(page, context.project); |
||||
}); |
||||
|
||||
test("Survey", async () => { |
||||
// close 'Team & Auth' tab
|
||||
await dashboard.closeTab({ title: "Team & Auth" }); |
||||
await dashboard.treeView.openTable({ title: "Country" }); |
||||
|
||||
await dashboard.viewSidebar.createFormView({ |
||||
title: "Country Form", |
||||
}); |
||||
await dashboard.form.configureHeader({ |
||||
title: "Country Title", |
||||
subtitle: "Country Form Subtitle", |
||||
}); |
||||
await dashboard.form.configureSubmitMessage({ |
||||
message: "Thank you for submitting the form", |
||||
}); |
||||
await dashboard.form.showAnotherFormRadioButton.click(); |
||||
await dashboard.form.showAnotherFormAfter5SecRadioButton.click(); |
||||
await dashboard.toolbar.clickShareView(); |
||||
await dashboard.toolbar.shareView.toggleSurveyMode(); |
||||
|
||||
const surveyLink = await dashboard.toolbar.shareView.getShareLink(); |
||||
await dashboard.rootPage.waitForTimeout(2000); |
||||
await dashboard.rootPage.goto(surveyLink); |
||||
await dashboard.rootPage.waitForTimeout(2000); |
||||
|
||||
surveyForm = new SurveyFormPage(dashboard.rootPage); |
||||
await surveyForm.validate({ |
||||
heading: "Country Title", |
||||
subHeading: "Country Form Subtitle", |
||||
fieldLabel: "Country *", |
||||
footer: "1 / 3", |
||||
}); |
||||
await surveyForm.fill({ |
||||
fieldLabel: "Country", |
||||
value: "New Country", |
||||
type: "SingleLineText", |
||||
}); |
||||
|
||||
await surveyForm.validate({ |
||||
heading: "Country Title", |
||||
subHeading: "Country Form Subtitle", |
||||
fieldLabel: "LastUpdate", |
||||
footer: "2 / 3", |
||||
}); |
||||
await surveyForm.fill({ |
||||
fieldLabel: "LastUpdate", |
||||
type: "DateTime", |
||||
}); |
||||
|
||||
await surveyForm.validate({ |
||||
heading: "Country Title", |
||||
subHeading: "Country Form Subtitle", |
||||
fieldLabel: "City List", |
||||
footer: "3 / 3", |
||||
}); |
||||
await surveyForm.submitButton.click(); |
||||
|
||||
// validate post submit data
|
||||
await surveyForm.validateSuccessMessage({ |
||||
message: "Thank you for submitting the form", |
||||
showAnotherForm: true, |
||||
}); |
||||
}); |
||||
}); |
||||
Loading…
Reference in new issue